/* AEC — carte de domaine skiable ([aec_domaine]). Mobile d'abord (04/10/2026). */
.aec-dom { --dom-h: clamp(380px, 68vh, 560px); position: relative; margin: 2rem 0; background: #FAF8F4; border: 1px solid #E6E1D8; border-radius: 14px; overflow: hidden; }
.aec-dom__bar { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 12px 4px 16px; }
.aec-dom__title { margin: 0; font-family: 'Fraunces', Georgia, serif; font-size: 1.05rem; line-height: 1.25; color: #194750; }
.aec-dom__fs { flex: none; width: 44px; height: 44px; display: grid; place-items: center; border: 1px solid #E6E1D8; border-radius: 50%; background: #FFFFFF; color: #194750; cursor: pointer; }
.aec-dom__fs svg { width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.aec-dom__fs-off, .aec-dom.is-fs .aec-dom__fs-on { display: none; }
.aec-dom.is-fs .aec-dom__fs-off { display: block; }

/* Filtres : une rangée qui défile au doigt plutôt que trois lignes qui mangent la carte. */
.aec-dom__chips { display: flex; gap: 8px; overflow-x: auto; padding: 8px 16px 10px; scroll-snap-type: x proximity; scrollbar-width: none; -webkit-overflow-scrolling: touch; mask-image: linear-gradient(90deg, #000 88%, transparent); -webkit-mask-image: linear-gradient(90deg, #000 88%, transparent); }
.aec-dom__chips::-webkit-scrollbar { display: none; }
/* Ordinateur : les filtres passent à la ligne, une souris ne fait pas défiler la rangée (05/10). */
@media (min-width: 760px) {
	.aec-dom__chips { flex-wrap: wrap; overflow: visible; -webkit-mask-image: none; mask-image: none; }
}
.aec-dom__chip { flex: none; scroll-snap-align: start; display: inline-flex; align-items: center; gap: 7px; min-height: 44px; padding: 0 14px; border: 1px solid #DCD5C8; border-radius: 999px; background: #FFFFFF; color: #3D3A35; font: 500 .86rem/1 'Work Sans', system-ui, sans-serif; white-space: nowrap; cursor: pointer; -webkit-tap-highlight-color: transparent; }
.aec-dom__chip[aria-pressed="false"] { background: transparent; color: #8A867E; border-style: dashed; }
.aec-dom__chip[aria-pressed="false"] i { opacity: .35; }
.aec-dom__chip i { width: 12px; height: 12px; border-radius: 50%; flex: none; }
.aec-dom__chip--piste i { background: linear-gradient(90deg, #2E9E4F 0 25%, #2B7CD3 25% 50%, #D0342C 50% 75%, #1B1B1B 75%); border-radius: 3px; height: 8px; width: 18px; }
.aec-dom__chip--remontee i { border-radius: 0; height: 0; width: 18px; border-top: 2px dashed #7E1F16; }
.aec-dom__chip--resto i { background: #BF9377; }
.aec-dom__chip--park i { background: #E07B24; }
.aec-dom__chip--sommet i { background: #3D3A35; }
.aec-dom__chip--fond i { border-radius: 0; height: 0; width: 18px; border-top: 2px dashed #7A5FA6; }
.aec-dom__chip--raquette i { border-radius: 0; height: 0; width: 18px; border-top: 3px dotted #194750; }
.aec-dom__l--fond { background: none !important; border-top: 2px dashed #2B7CD3; height: 0 !important; }
.aec-dom__l--raq { background: none !important; border-top: 3px dotted #194750; height: 0 !important; }
.aec-dom__chip--lieu i { background: transparent; border: 1px solid #8A867E; }
.aec-dom__chip--ecole i { background: #D9001B; }
.aec-dom__chip:focus-visible, .aec-dom__fs:focus-visible { outline: 2px solid #BF9377; outline-offset: 2px; }

/* Le panneau se positionne dans la zone de carte, jamais sur la légende (retour du 04/10). */
.aec-dom__stage { position: relative; }
.aec-dom__map { position: relative; height: var(--dom-h); background: #EEEAE2; }
.aec-dom__wait { position: absolute; inset: 0; display: grid; place-items: center; margin: 0; color: #8A867E; font: .9rem 'Work Sans', system-ui, sans-serif; }
.aec-dom.is-ko .aec-dom__map { display: none; }
.aec-dom .maplibregl-ctrl-group button { width: 40px; height: 40px; }
.aec-dom .maplibregl-ctrl-scale { margin: 0 0 10px 10px; }
.aec-dom .maplibregl-cooperative-gesture-screen { font-family: 'Work Sans', system-ui, sans-serif; }

/* Panneau du bas : lisible au pouce, au-dessus de la barre de geste de l'iPhone. */
.aec-dom__sheet { position: absolute; left: 10px; right: 10px; bottom: calc(10px + env(safe-area-inset-bottom, 0px)); z-index: 3; padding: 14px 52px 14px 16px; background: #FFFFFF; border-radius: 14px; box-shadow: 0 8px 28px rgba(25, 71, 80, .18); animation: aec-dom-up .18s ease-out; }
.aec-dom__sheet[hidden] { display: none; }
.aec-dom__sheet-x { position: absolute; top: 4px; right: 4px; width: 44px; height: 44px; border: 0; background: transparent; color: #6E6A63; font-size: 1.6rem; line-height: 1; cursor: pointer; }
.aec-dom__sheet-t { margin: 0; font: 600 1rem/1.3 'Work Sans', system-ui, sans-serif; color: #194750; display: flex; align-items: center; gap: 8px; }
.aec-dom__sheet-s { margin: 4px 0 0; font: .88rem/1.35 'Work Sans', system-ui, sans-serif; color: #6E6A63; }
.aec-dom__sheet-d { margin: 3px 0 0; font: .84rem/1.4 'Work Sans', system-ui, sans-serif; color: #3D3A35; font-variant-numeric: tabular-nums; }
.aec-dom__dot { flex: none; width: 12px; height: 12px; border-radius: 50%; }
@keyframes aec-dom-up { from { transform: translateY(12px); opacity: 0; } to { transform: none; opacity: 1; } }

.aec-dom__leg { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 14px; padding: 10px 16px 12px; font: .8rem/1.4 'Work Sans', system-ui, sans-serif; color: #6E6A63; }
.aec-dom__leg span { display: inline-flex; align-items: center; gap: 6px; }
.aec-dom__l { width: 18px; height: 4px; border-radius: 2px; }
.aec-dom__l--v { background: #2E9E4F; } .aec-dom__l--b { background: #2B7CD3; } .aec-dom__l--r { background: #D0342C; } .aec-dom__l--n { background: #1B1B1B; }
.aec-dom__src { flex-basis: 100%; font-size: .74rem; color: #8A867E; }

/* Plein écran maison : Safari iPhone refuse le plein écran d'un élément de page. */
.aec-dom.is-fs { position: fixed; inset: 0; z-index: 100000; margin: 0; border: 0; border-radius: 0; display: flex; flex-direction: column; padding-top: env(safe-area-inset-top, 0px); }
.aec-dom.is-fs .aec-dom__stage { flex: 1; display: flex; flex-direction: column; min-height: 0; }
.aec-dom.is-fs .aec-dom__map { flex: 1; height: auto; }
.aec-dom.is-fs .aec-dom__leg { padding-bottom: calc(10px + env(safe-area-inset-bottom, 0px)); }
.aec-dom.is-fs .aec-dom__src { display: none; }
html.aec-dom-lock, html.aec-dom-lock body { overflow: hidden; }

@media (min-width: 900px) {
	.aec-dom { --dom-h: 600px; }
	.aec-dom__sheet { right: auto; left: 12px; bottom: 40px; max-width: 340px; }
}
@media (prefers-reduced-motion: reduce) { .aec-dom__sheet { animation: none; } }

/* Carte des Alpes (04/10) : chargement d'un lot, action du panneau, pastille « Nos stations ». */
.aec-dom__toast { position: absolute; top: 10px; left: 50%; transform: translateX(-50%); z-index: 2; margin: 0; padding: 7px 14px; background: rgba(25, 71, 80, .9); color: #FFFFFF; border-radius: 999px; font: 500 .8rem/1.2 'Work Sans', system-ui, sans-serif; pointer-events: none; }
.aec-dom__toast[hidden] { display: none; }
.aec-dom__sheet-a { display: inline-flex; align-items: center; gap: 6px; min-height: 44px; margin-top: 10px; padding: 0 16px; border: 0; border-radius: 999px; background: #194750; color: #FFFFFF; font: 500 .9rem/1 'Work Sans', system-ui, sans-serif; text-decoration: none; cursor: pointer; }
.aec-dom__sheet-a:hover, .aec-dom__sheet-a:focus-visible { background: #BF9377; color: #FFFFFF; }
/* Dans un article, la règle des liens du contenu (.cna-free a : teal souligné) repeignait le bouton
 * en teal sur teal, illisible (retour Sacha du 04/10). Sélecteur plus fort, flèche sur la même ligne. */
.aec-dom a.aec-dom__sheet-a, .cna-free .aec-dom a.aec-dom__sheet-a { color: #FFFFFF; text-decoration: none; white-space: nowrap; }
.aec-dom a.aec-dom__sheet-a:hover, .aec-dom a.aec-dom__sheet-a:focus-visible { color: #FFFFFF; }
.aec-dom__p { width: 12px; height: 12px; border-radius: 50%; }
.aec-dom__p--st { background: #194750; box-shadow: 0 0 0 2px #BF9377; }

/* Mobile : la carte passe bord à bord, sur toute la largeur de l'écran, plutôt que de rester
 * dans la colonne de texte (294px sur un téléphone de 390px, constaté le 04/10). Le plein écran
 * garde ses propres règles (position fixe). */
@media (max-width: 760px) {
	.aec-dom:not(.is-fs) { width: 100vw; max-width: 100vw; margin-left: calc(50% - 50vw); margin-right: 0; border-left: 0; border-right: 0; border-radius: 0; }
}

/* Hors ligne et image du plan (04/10). Boutons de 44px, pensés pour le pouce. */
.aec-dom__off { display: flex; gap: 14px; align-items: flex-start; padding: 4px 16px 16px; border-top: 1px solid #E6E1D8; }
.aec-dom__off svg.aec-dom__off-tel { flex: none; width: 64px; height: 112px; margin-top: 12px; }
.aec-dom__off-txt { flex: 1; min-width: 0; }
.aec-dom__off-etat { margin: 12px 0 10px; font: .86rem/1.45 'Work Sans', system-ui, sans-serif; color: #3D3A35; }
.aec-dom.is-offline-ok .aec-dom__off-etat::before { content: '✓ '; color: #2E9E4F; font-weight: 700; }
.aec-dom__off-btns { display: flex; flex-wrap: wrap; gap: 8px; }
.aec-dom__off-save, .aec-dom__off-img { display: inline-flex; align-items: center; gap: 8px; min-height: 44px; padding: 0 16px; border-radius: 999px; font: 500 .9rem/1 'Work Sans', system-ui, sans-serif; cursor: pointer; }
.aec-dom__off-save { border: 0; background: #194750; color: #FFFFFF; }
.aec-dom__off-save:disabled { opacity: .6; cursor: progress; }
.aec-dom__off-img { border: 1px solid #DCD5C8; background: #FFFFFF; color: #194750; }
.aec-dom__off button svg { width: 18px; height: 18px; fill: none; stroke: currentColor; stroke-width: 1.8; stroke-linecap: round; stroke-linejoin: round; }
.aec-dom__off-ios { margin: 10px 0 0; font: .8rem/1.45 'Work Sans', system-ui, sans-serif; color: #6E6A63; }
.aec-dom__off-ios[hidden] { display: none; }
.aec-dom.is-fs .aec-dom__off { display: none; }