/* Listes déroulantes maison (voir assets/js/listes.js). Le calque est en position fixe au niveau du <body>, z-index 1000 :
   il passe au-dessus de l'en-tête collant (50), des tiroirs (70) et n'est rogné par aucun conteneur. */
.liste-natif { position: absolute !important; width: 1px !important; height: 1px !important; min-height: 0 !important; padding: 0 !important; border: 0 !important; opacity: 0; pointer-events: none; clip-path: inset(50%); }
.a-liste { position: relative; }
.liste-btn { display: flex; align-items: center; justify-content: space-between; gap: 12px; width: 100%; min-height: 54px; padding: 12px 16px; border: 1.5px solid #B5C6D2; border-radius: var(--r-outil); background: var(--blanc); color: var(--marine); font-size: 1.0625rem; font-weight: 600; text-align: left; cursor: pointer; transition: border-color .15s, box-shadow .2s, background .2s; }
.liste-btn:hover { border-color: var(--marine); }
.liste-btn.est-ouvert { border-color: var(--marine); box-shadow: 0 0 0 3px var(--ambre); }
.liste-btn.est-vide .liste-btn__txt { font-weight: 500; }
.liste-btn__txt { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.liste-btn svg { flex: none; width: 12px; height: 8px; fill: none; stroke: currentColor; stroke-width: 1.9; stroke-linecap: round; stroke-linejoin: round; transition: transform .28s var(--ease); }
.liste-btn.est-ouvert svg { transform: rotate(180deg); }

.liste-pop { position: fixed; z-index: 1000; background: var(--blanc); border-radius: 18px; padding: 8px; overflow-y: auto; overscroll-behavior: contain;
  box-shadow: 0 28px 70px -20px rgba(8, 56, 89, .5), 0 0 0 1px rgba(8, 56, 89, .08);
  opacity: 0; transform: translateY(-8px) scale(.98); transform-origin: top center; transition: opacity .18s var(--ease), transform .22s var(--ease);
  scrollbar-width: thin; scrollbar-color: var(--brume) transparent; outline: none; }
.liste-pop.vers-haut { transform-origin: bottom center; transform: translateY(8px) scale(.98); }
.liste-pop.visible { opacity: 1; transform: none; }
.liste-pop[hidden] { display: none; }
.liste-pop__groupe { padding: 14px 14px 6px; font-size: .8438rem; font-weight: 700; color: var(--gris); position: sticky; top: -8px; background: var(--blanc); z-index: 1; }
.liste-pop__opt { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 46px; padding: 8px 14px; border-radius: 12px; cursor: pointer; font-weight: 500; line-height: 1.3; color: var(--marine); }
.liste-pop__opt.est-actif { background: var(--peche-pale); }
.liste-pop__opt[aria-selected="true"] { font-weight: 700; background: var(--peche); }
.liste-pop__opt[aria-selected="true"]::after { content: ""; flex: none; width: 18px; height: 18px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M5 12.5l4.5 4.5L19 7.5' fill='none' stroke='%23083859' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/contain no-repeat; }

/* Moteur de l'accueil : le bouton reprend la forme de la case, libellé au-dessus */
.hero { z-index: 5; }
.moteur__champ .liste-btn { min-height: 64px; padding: 28px 18px 8px; border: 0; background: transparent; font-weight: 700; box-shadow: none; }
.moteur__champ .liste-btn.est-ouvert { box-shadow: none; }
.moteur__champ:has(.est-ouvert) { background: var(--blanc); box-shadow: 0 0 0 3px var(--ambre-fonce); }
.moteur__champ .liste-btn svg { margin-top: -18px; }
.moteur__champ label { cursor: pointer; pointer-events: auto; }

/* Tri de la liste : version compacte */
.barre__tri .liste-btn { min-height: 44px; border: 0; background: transparent; padding: 0 10px 0 14px; font-size: .9688rem; font-weight: 700; width: auto; gap: 8px; box-shadow: none; border-radius: var(--r-pilule); }
.barre__tri .liste-btn:hover, .barre__tri .liste-btn.est-ouvert { background: var(--menthe-pale); box-shadow: none; }

.liste-pop__sep { height: 1px; margin: 6px 12px; background: currentColor; opacity: .15; }