dans ). */
.prisme-card--lien {
position: relative;
display: block;
padding-right: calc(var(--prisme-e4, 24px) + 24px); /* place du chevron */
color: var(--prisme-texte, #FFFFFF);
text-decoration: none;
cursor: pointer;
transition: transform 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease;
}
.prisme-card--lien::after {
content: "›";
position: absolute;
right: var(--prisme-e4, 24px);
top: 50%;
margin-top: -14px;
font-size: var(--prisme-t-xl, 1.75rem);
line-height: 1;
color: var(--prisme-texte-att, #A9A9B4);
}
.prisme-card--lien:hover,
.prisme-card--lien:focus-within {
transform: translateY(-2px);
border-color: var(--prisme-texte-att, #A9A9B4);
box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05), var(--prisme-ombre-survol);
}
.prisme-card-lien { color: inherit; text-decoration: none; }
.prisme-card-lien::after { content: ""; position: absolute; inset: 0; border-radius: inherit; }
.prisme-card--lien:has(.prisme-card-lien:focus-visible) { outline: 3px solid var(--prisme-or, #F5A623); outline-offset: 3px; }
.prisme-card-lien:focus-visible { outline: none; }
/* Boutons secondaires (définis ici pour exister même sans le thème) */
.prisme-btn-outline,
.prisme-bouton-segment {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 8px;
min-height: 48px;
font-family: var(--prisme-font, "Lexend PRISME", sans-serif);
font-weight: 600;
font-size: var(--prisme-t-s, 1rem);
line-height: 1.3;
background: transparent;
color: var(--prisme-texte, #FFFFFF);
border: 1px solid var(--prisme-texte-att, #A9A9B4);
border-radius: var(--prisme-radius-pill, 999px);
padding: 0 var(--prisme-e4, 24px);
text-decoration: none;
cursor: pointer;
transition: border-color 0.2s ease, transform 0.2s ease;
}
.prisme-btn-outline:hover,
.prisme-btn-outline:focus-visible { border-color: var(--prisme-action-fond, #FFFFFF); transform: translateY(-1px); }
.prisme-bouton-segment { min-height: 44px; min-width: 64px; padding: 0 var(--prisme-e3, 16px); border-color: transparent; }
.prisme-bouton-segment[aria-pressed="true"] { background: var(--prisme-action-fond, #FFFFFF); color: var(--prisme-action-texte, #17171A); }
.prisme-segment { display: inline-flex; flex-wrap: wrap; gap: var(--prisme-e1, 4px); padding: var(--prisme-e1, 4px); border: 1px solid var(--prisme-bordure, #34333B); border-radius: var(--prisme-radius-pill, 999px); background: var(--prisme-fond-carte, #201F24); }
/* En-tête de carte : petite icône + titre (comme Transports) */
.prisme-card-icone { display: inline-flex; width: 48px; height: 48px; align-items: center; justify-content: center; border-radius: var(--prisme-radius-s, 14px); border: 1px solid var(--prisme-bordure, #34333B); background: var(--prisme-fond, #17171A); }
/* Vitre : bandeaux et barres fixes (repli opaque si le flou n'est pas géré) */
.prisme-verre { background: var(--prisme-fond-carte, #201F24); }
@supports ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
.prisme-verre {
background: color-mix(in srgb, var(--prisme-fond, #17171A) 72%, transparent);
-webkit-backdrop-filter: var(--prisme-verre);
backdrop-filter: var(--prisme-verre);
}
}
@media (prefers-reduced-motion: reduce) {
.prisme-card--lien, .prisme-btn-outline, .prisme-bouton-segment { transition: none; }
.prisme-card--lien:hover, .prisme-card--lien:focus-within, .prisme-btn-outline:hover { transform: none; }
}
@media (max-width: 480px) {
.prisme-card { padding: var(--prisme-e3, 16px); }
.prisme-card--lien { padding-right: calc(var(--prisme-e3, 16px) + 24px); }
.prisme-card--lien::after { right: var(--prisme-e3, 16px); }
}
/* Responsive commun (mobile d'abord, 320 px minimum). Jeu de seuils unique du projet : 480 / 640 / 768 / 1024.
Un composant PRISME ne dépasse jamais de son conteneur, même sous un autre thème que celui de PRISME
(qui pose déjà img { max-width: 100% }). :where() : spécificité nulle, n'écrase rien. */
:where([class*="prisme-"]) :where(img, video, iframe, svg) { max-width: 100%; }
:where(.prisme-card) { min-width: 0; }
/* Glace : verre dépoli sur toutes les cartes publiques (thème 1.46.0 + plugins). Fond translucide teinté de la couleur de
rubrique (--prisme-rubrique, bleu par défaut), reflet en haut, flou de ce qui est derrière. Les couleurs viennent des
variables de la charte : elles suivent les thèmes d'événement. Exceptions : pages SOS (.prisme-crise-wrap, lisibilité
avant tout) et cartes qui se retournent (Octobre, Noël : elles n'utilisent pas .prisme-card). */
.prisme-card:not(.prisme-crise-wrap) {
background:
linear-gradient(180deg, rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0) 38%),
linear-gradient(160deg, color-mix(in srgb, var(--prisme-rubrique, var(--prisme-bleu, #2F8FE0)) 12%, color-mix(in srgb, var(--prisme-fond-carte, #201F24) 93%, transparent)), color-mix(in srgb, var(--prisme-fond-carte, #201F24) 88%, transparent)) !important;
-webkit-backdrop-filter: blur(24px) saturate(150%);
backdrop-filter: blur(24px) saturate(150%);
}
@supports not ((backdrop-filter: blur(1px)) or (-webkit-backdrop-filter: blur(1px))) {
.prisme-card:not(.prisme-crise-wrap) { background: var(--prisme-fond-carte, #201F24) !important; }
}
@media (prefers-reduced-transparency: reduce) {
.prisme-card:not(.prisme-crise-wrap) { background: var(--prisme-fond-carte, #201F24) !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
}
/* Glace, suite : boutons secondaires et champs (thème 1.47.0 + plugins). Le bouton principal (.prisme-btn-pill) et l'état
« actif » restent PLEINS : le contraste du texte sombre sur fond clair ne doit jamais dépendre de ce qui est derrière. */
.prisme-btn-outline,
.prisme-bouton-segment:not([aria-pressed="true"]),
.prisme-segment {
background: linear-gradient(rgba(255, 255, 255, 0.07), rgba(255, 255, 255, 0.07)), color-mix(in srgb, var(--prisme-fond-carte, #201F24) 85%, transparent);
-webkit-backdrop-filter: blur(20px) saturate(150%);
backdrop-filter: blur(20px) saturate(150%);
}
.prisme-segment { border-color: color-mix(in srgb, #FFFFFF 16%, var(--prisme-bordure, #34333B)); }
[class*="prisme-"]:not(.prisme-crise-wrap) :is(input[type="text"], input[type="search"], input[type="email"], input[type="tel"], input[type="url"], input[type="number"], input[type="time"], input[type="date"], input:not([type]), select, textarea) {
background: color-mix(in srgb, var(--prisme-fond, #17171A) 88%, transparent) !important;
-webkit-backdrop-filter: blur(16px) saturate(140%);
backdrop-filter: blur(16px) saturate(140%);
}
@media (prefers-reduced-transparency: reduce) {
.prisme-btn-outline, .prisme-bouton-segment:not([aria-pressed="true"]) { background: transparent; -webkit-backdrop-filter: none; backdrop-filter: none; }
.prisme-segment { background: var(--prisme-fond-carte, #201F24); -webkit-backdrop-filter: none; backdrop-filter: none; }
[class*="prisme-"]:not(.prisme-crise-wrap) :is(input[type="text"], input[type="search"], input[type="email"], input[type="tel"], input[type="url"], input[type="number"], input[type="time"], input[type="date"], input:not([type]), select, textarea) { background: var(--prisme-fond, #17171A) !important; -webkit-backdrop-filter: none; backdrop-filter: none; }
}