/* QELI : fenêtres de confirmation, listes déroulantes, calendrier et heures aux couleurs de QELI
   (remplacent les fenêtres natives du navigateur, voir js/qeli-champs.js). */

/* ---------- Fenêtres ---------- */
dialog.dialogue{width:min(440px,calc(100vw - 32px));max-height:calc(100dvh - 32px);margin:auto;padding:0;border:0;border-radius:var(--r-carte);background:var(--surface);color:var(--texte);box-shadow:0 24px 64px rgba(15,21,33,.28);overflow:auto}
dialog.dialogue::backdrop{background:rgba(15,21,33,.55);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}
dialog.dialogue[open]{animation:qeli-dialogue .18s ease-out}
@keyframes qeli-dialogue{from{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}
.dialogue-corps{display:flex;flex-direction:column;gap:14px;padding:24px 22px 20px}
.dialogue-corps h2{margin:0;font:700 1.1875rem/1.35 var(--police-titre);color:var(--texte)}
.dialogue-corps p{margin:0;color:var(--texte-2)}
.dialogue-icone{display:inline-flex;align-items:center;justify-content:center;width:48px;height:48px;border-radius:50%;background:var(--accent-fond);color:var(--primaire)}
.dialogue-icone.alerte{background:var(--erreur-fond);color:var(--erreur)}
.dialogue .champ{margin:0}
.dialogue-actions{display:flex;flex-wrap:wrap;justify-content:flex-end;gap:10px;margin-top:6px}
.dialogue-actions .bouton{flex:1 1 140px}
@media (min-width:560px){.dialogue-actions .bouton{flex:0 0 auto}}
@media (prefers-reduced-motion:reduce){dialog.dialogue[open]{animation:none}}

/* ---------- Champ d'origine masqué (il garde la valeur envoyée) ---------- */
.qeli-cache{position:absolute!important;width:1px!important;height:1px!important;min-height:0!important;padding:0!important;margin:-1px!important;border:0!important;overflow:hidden;clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;opacity:0;pointer-events:none}

/* ---------- Bouton qui remplace le champ ---------- */
.qeli-champ{display:flex;align-items:center;width:100%;min-height:48px;padding:0 44px 0 14px;border:2px solid var(--bord-champ);border-radius:var(--r-champ);background:var(--surface) no-repeat right 12px center;color:var(--texte);font:400 var(--t-texte)/1.4 var(--police-texte);text-align:left;cursor:pointer;-webkit-appearance:none;appearance:none;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.champ .qeli-champ{min-height:46px;border-width:1px;font-size:.9375rem}
.qeli-champ.qeli-vide{color:var(--texte-2)}
.qeli-champ:hover{border-color:var(--primaire)}
.qeli-champ:focus-visible,.qeli-champ[aria-expanded="true"]{outline:none;border-color:var(--primaire);box-shadow:0 0 0 3px var(--accent)}
.qeli-champ.invalide{border-color:var(--erreur);box-shadow:0 0 0 3px var(--erreur-fond)}
.qeli-champ:disabled{background-color:var(--desactive-fond);border-color:var(--desactive-fond);color:var(--desactive-texte);cursor:not-allowed}
.qeli-liste{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' viewBox='0 0 24 24' fill='none' stroke='%23525A6A' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E")}
.qeli-date{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23525A6A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Crect x='3' y='5' width='18' height='16' rx='2'/%3E%3Cpath d='M3 10h18M8 3v4M16 3v4'/%3E%3C/svg%3E")}
input[type=time]+.qeli-date{background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23525A6A' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='12' cy='12' r='9'/%3E%3Cpath d='M12 7v5l3 2'/%3E%3C/svg%3E")}

/* ---------- Panneau flottant ---------- */
.qeli-panneau.flottant{position:fixed;z-index:1000;max-width:calc(100vw - 16px);padding:6px;border:1px solid var(--bord);border-radius:12px;background:var(--surface);color:var(--texte);box-shadow:0 16px 40px rgba(15,21,33,.22);animation:qeli-panneau .12s ease-out}
@keyframes qeli-panneau{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@media (prefers-reduced-motion:reduce){.qeli-panneau.flottant{animation:none}}
.qeli-options,.qeli-heures{max-height:min(320px,50vh);overflow-y:auto;overscroll-behavior:contain}
.qeli-option{display:flex;align-items:center;min-height:44px;padding:8px 12px;border-radius:8px;font:400 .9375rem/1.35 var(--police-texte);cursor:pointer;outline:none}
.qeli-option:hover,.qeli-option:focus{background:var(--secondaire-survol)}
.qeli-option:focus-visible{box-shadow:inset 0 0 0 2px var(--primaire)}
.qeli-option[aria-selected="true"]{background:var(--primaire);color:var(--sur-primaire);font-weight:700}
.qeli-option[aria-disabled="true"]{color:var(--desactive-texte);cursor:not-allowed;background:none}
.qeli-heures{min-width:180px}
.qeli-heures-titre{position:sticky;top:-6px;margin:-6px -6px 4px;padding:10px 14px;background:var(--surface);border-bottom:1px solid var(--bord);font:700 .875rem/1.3 var(--police-titre);color:var(--texte-2)}

/* ---------- Calendrier ---------- */
.qeli-calendrier{width:296px;padding:12px}
.qeli-cal-tete{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px}
.qeli-cal-titre{font:700 1rem/1.2 var(--police-titre);text-transform:capitalize}
.qeli-cal-nav{width:40px;height:40px;border:0;border-radius:50%;background:none;color:var(--primaire);font:700 1.5rem/1 var(--police-texte);cursor:pointer}
.qeli-cal-nav:hover{background:var(--secondaire-survol)}
.qeli-cal-grille{display:grid;grid-template-columns:repeat(7,1fr);gap:2px}
.qeli-cal-jsem{display:flex;align-items:center;justify-content:center;height:28px;font:700 .75rem/1 var(--police-texte);color:var(--texte-2)}
.qeli-cal-jour{display:flex;align-items:center;justify-content:center;aspect-ratio:1;min-height:36px;border:0;border-radius:50%;background:none;color:var(--texte);font:500 .9375rem/1 var(--police-texte);cursor:pointer}
.qeli-cal-jour:hover:not(:disabled){background:var(--secondaire-survol)}
.qeli-cal-jour:focus-visible{outline:none;box-shadow:0 0 0 2px var(--primaire)}
.qeli-cal-jour.autre{color:var(--texte-2);opacity:.55}
.qeli-cal-jour.auj{box-shadow:inset 0 0 0 2px var(--accent);font-weight:700}
.qeli-cal-jour.choisi{background:var(--primaire);color:var(--sur-primaire);font-weight:700}
.qeli-cal-jour:disabled{color:var(--desactive-texte);opacity:.4;cursor:not-allowed;text-decoration:line-through}
.qeli-cal-pied{display:flex;justify-content:flex-end;margin-top:8px;padding-top:8px;border-top:1px solid var(--bord)}
.qeli-cal-lien{min-height:36px;padding:0 12px;border:0;border-radius:8px;background:var(--accent-fond);color:var(--primaire);font:700 .875rem/1 var(--police-texte);cursor:pointer}

/* ---------- Thème sombre ---------- */
[data-theme="sombre"] .qeli-option[aria-selected="true"],[data-theme="sombre"] .qeli-cal-jour.choisi{background:var(--accent);color:#141A26}
[data-theme="sombre"] .qeli-cal-lien,[data-theme="sombre"] .qeli-cal-nav{color:var(--accent)}
[data-theme="sombre"] .qeli-cal-lien{background:rgba(245,195,67,.14)}
[data-theme="sombre"] .dialogue-icone{background:rgba(245,195,67,.14);color:var(--accent)}
[data-theme="sombre"] dialog.dialogue,[data-theme="sombre"] .qeli-panneau.flottant{box-shadow:0 0 0 1px var(--bord),0 24px 64px rgba(0,0,0,.6)}
@media (prefers-color-scheme:dark){
  [data-theme="auto"] .qeli-option[aria-selected="true"],[data-theme="auto"] .qeli-cal-jour.choisi{background:var(--accent);color:#141A26}
  [data-theme="auto"] .qeli-cal-lien,[data-theme="auto"] .qeli-cal-nav{color:var(--accent)}
  [data-theme="auto"] .dialogue-icone{background:rgba(245,195,67,.14);color:var(--accent)}
}
