/* =====================================================================
   SÉLECTEUR DE DATE ET D'HEURE DU DESK, VERSION 2 (09/11/2026)
   Avec dates_v2.js. Interrupteur : drapeau « dates_v2 » (Administration >
   Fonctionnalités, groupe Affichage) ; allumé, dates_v2.js pose html.dt2.
   Éteint : les champs et le sélecteur du navigateur d'avant, au rechargement.

   Le champ : icône du Desk à la place de celle du navigateur, segment tapé
   surligné aux couleurs du Desk, « jj/mm/aaaa » en gris tant que le champ est
   vide, anneau de focus marine. Aucune propriété display ni largeur : un champ
   caché ou dimensionné par son écran le reste.
   Le sélecteur (.dt2-pop) : posé à la racine de la page, au-dessus des fenêtres.
   ===================================================================== */

/* couleurs et police du sélecteur : celles du Desk par défaut (ses variables, mode sombre compris) */
html.dt2{
  --dt-card:var(--card,#fff);--dt-txt:var(--txt,#1a2b33);--dt-ink:var(--ink,#143240);--dt-mut:var(--mut,#6b7c86);
  --dt-line:var(--line,#e2e8ec);--dt-err:var(--red,#e63946);--dt-font:'Montserrat',system-ui,Arial,sans-serif;
  --dt-on:#143240;--dt-on-txt:#fff;--dt-hov:#e8eff4;--dt-ring:0 0 0 3px rgba(20,50,64,.16);--dt-fer:#d29922;
  --dt-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cg fill='none' stroke='%23143240' stroke-width='1.4' stroke-linecap='round'%3E%3Crect x='2.5' y='3.5' width='11' height='10' rx='2'/%3E%3Cpath d='M2.5 6.8h11M5.5 2v3M10.5 2v3'/%3E%3C/g%3E%3C/svg%3E");
  --dt-ico-h:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cg fill='none' stroke='%23143240' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='5.7'/%3E%3Cpath d='M8 4.9v3.3l2.2 1.4'/%3E%3C/g%3E%3C/svg%3E");
}
html.dt2.theme-dark{
  --dt-on:#8fc3df;--dt-on-txt:#0d1f29;--dt-hov:#22465a;--dt-ring:0 0 0 3px rgba(143,195,223,.28);--dt-fer:#e0b24a;
  --dt-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cg fill='none' stroke='%23b9d6e5' stroke-width='1.4' stroke-linecap='round'%3E%3Crect x='2.5' y='3.5' width='11' height='10' rx='2'/%3E%3Cpath d='M2.5 6.8h11M5.5 2v3M10.5 2v3'/%3E%3C/g%3E%3C/svg%3E");
  --dt-ico-h:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cg fill='none' stroke='%23b9d6e5' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='5.7'/%3E%3Cpath d='M8 4.9v3.3l2.2 1.4'/%3E%3C/g%3E%3C/svg%3E");
}


/* Espace client, outil des caisses et pages de la direction (thème « app », posé par le serveur :
   script data-theme="app") : leur indigo, leur police, leurs gris. Pas de mode sombre. */
html.dt2.dt2-app{
  --dt-card:#fff;--dt-txt:var(--ink,#0F172A);--dt-ink:var(--ink,#0F172A);--dt-mut:var(--muted,#64748B);--dt-line:var(--line,#E8EBF1);
  --dt-err:var(--red,#B91C1C);--dt-font:inherit;
  --dt-on:var(--accent,#4A5CF0);--dt-on-txt:#fff;--dt-hov:var(--accent-soft,#EEF0FE);--dt-ring:0 0 0 3px rgba(74,92,240,.18);--dt-fer:#C2410C;
  --dt-ico:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cg fill='none' stroke='%23334155' stroke-width='1.4' stroke-linecap='round'%3E%3Crect x='2.5' y='3.5' width='11' height='10' rx='2'/%3E%3Cpath d='M2.5 6.8h11M5.5 2v3M10.5 2v3'/%3E%3C/g%3E%3C/svg%3E");
  --dt-ico-h:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cg fill='none' stroke='%23334155' stroke-width='1.4' stroke-linecap='round' stroke-linejoin='round'%3E%3Ccircle cx='8' cy='8' r='5.7'/%3E%3Cpath d='M8 4.9v3.3l2.2 1.4'/%3E%3C/g%3E%3C/svg%3E");
}
html.dt2.dt2-app .dt2-pop{box-shadow:0 18px 44px -12px rgba(15,23,42,.28),0 2px 6px rgba(15,23,42,.06)}
/* focus et sélecteur ouvert : le trait intérieur indigo de ces pages, avec un halo léger (les champs de l'espace
   n'ont pas de bordure, seulement ce trait) */
html.dt2.dt2-app :is(input[type=date],input[type=datetime-local],input[type=time],input[type=month]):focus,
html.dt2.dt2-app input.dt2-ouvert{box-shadow:inset 0 0 0 2px var(--dt-on),0 0 0 3px rgba(74,92,240,.12)}

/* ---------- le champ ---------- */
html.dt2 :is(input[type=date],input[type=datetime-local],input[type=time],input[type=month]){
  font-family:inherit;cursor:pointer;color-scheme:light}
html.dt2.theme-dark :is(input[type=date],input[type=datetime-local],input[type=time],input[type=month]){color-scheme:dark}
/* champs écrits sans classe ni style par leur écran (dt2-nu, posée par dates_v2.js) : la boîte
   des champs du Desk, en spécificité nulle (:where) pour que toute règle de l'écran garde la main */
:where(html.dt2 input.dt2-nu){
  font-size:12.5px;padding:7px 9px;border:1px solid var(--dt-line);border-radius:8px;background-color:var(--dt-card);color:var(--dt-txt)}
html.dt2 :is(input[type=date],input[type=datetime-local],input[type=time],input[type=month]):focus,
html.dt2 input.dt2-ouvert{outline:none;border-color:var(--dt-on);box-shadow:var(--dt-ring)}
html.dt2 input.dt2-vide{color:var(--dt-mut)}
html.dt2 input::-webkit-calendar-picker-indicator{
  background:var(--dt-ico) center/14px 14px no-repeat;opacity:.72;cursor:pointer;
  width:14px;height:14px;padding:1px;margin:0 0 0 2px;border-radius:5px;color:transparent}
html.dt2 input[type=time]::-webkit-calendar-picker-indicator{background-image:var(--dt-ico-h)}
html.dt2 input::-webkit-calendar-picker-indicator:hover{opacity:1;background-color:var(--dt-hov)}
html.dt2 input::-webkit-datetime-edit-day-field:focus,
html.dt2 input::-webkit-datetime-edit-month-field:focus,
html.dt2 input::-webkit-datetime-edit-year-field:focus,
html.dt2 input::-webkit-datetime-edit-hour-field:focus,
html.dt2 input::-webkit-datetime-edit-minute-field:focus,
html.dt2 input::-webkit-datetime-edit-ampm-field:focus{background-color:var(--dt-hov);color:var(--dt-ink);border-radius:4px;outline:none}

/* ---------- le sélecteur ---------- */
.dt2-pop{position:fixed;z-index:2147483000;top:0;left:0;box-sizing:border-box;
  background:var(--dt-card);color:var(--dt-txt);border:1px solid var(--dt-line);border-radius:14px;
  box-shadow:0 16px 40px rgba(13,31,41,.20),0 2px 6px rgba(13,31,41,.08);padding:12px 12px 10px;
  font-family:var(--dt-font);font-size:13px;font-weight:500;line-height:1.2;
  -webkit-user-select:none;user-select:none;text-align:left;letter-spacing:0}
html.theme-dark .dt2-pop{box-shadow:0 16px 40px rgba(0,0,0,.45),0 2px 6px rgba(0,0,0,.3)}
.dt2-pop[hidden]{display:none}
.dt2-pop *{box-sizing:border-box}
.dt2-pop button{-webkit-appearance:none;appearance:none;margin:0;padding:0;border:0;background:none;box-shadow:none;
  font:inherit;color:inherit;letter-spacing:0;text-transform:none;line-height:1;min-width:0;min-height:0;width:auto;height:auto;
  cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:4px;white-space:nowrap;
  transition:background-color .1s,color .1s,box-shadow .1s}
.dt2-pop button:disabled{cursor:not-allowed}
.dt2-pop button:focus-visible{outline:none;box-shadow:var(--dt-ring)}

/* raccourcis */
.dt2-raccs{display:flex;gap:6px;margin:0 0 10px;padding-bottom:10px;border-bottom:1px solid var(--dt-line)}
.dt2-pop .dt2-racc{flex:1 1 auto;height:28px;padding:0 9px;border:1px solid var(--dt-line);border-radius:999px;
  font-size:12px;font-weight:600;color:var(--dt-ink);background:var(--dt-card)}
.dt2-pop .dt2-racc:hover:not(:disabled){background:var(--dt-hov);border-color:var(--dt-hov)}
.dt2-pop .dt2-racc.on{background:var(--dt-on);border-color:var(--dt-on);color:var(--dt-on-txt)}
.dt2-pop .dt2-racc:disabled{opacity:.4}

.dt2-corps{display:flex;align-items:stretch}

/* calendrier */
.dt2-cal{width:280px;flex:0 0 280px}
.dt2-tete{display:flex;align-items:center;justify-content:space-between;height:32px;margin:0 0 4px}
.dt2-pop .dt2-nav{width:32px;height:32px;border-radius:9px;color:var(--dt-ink)}
.dt2-pop .dt2-nav:hover{background:var(--dt-hov)}
.dt2-pop .dt2-titre{height:32px;padding:0 10px;border-radius:9px;font-size:14px;font-weight:700;color:var(--dt-ink)}
.dt2-pop .dt2-titre svg{opacity:.6;margin-top:1px}
.dt2-pop button.dt2-titre:hover{background:var(--dt-hov)}
.dt2-titre.fixe{display:inline-flex;align-items:center}
.dt2-tm{display:inline-block}
.dt2-tm::first-letter{text-transform:uppercase}
.dt2-grille{display:grid;grid-template-columns:repeat(7,40px);grid-auto-rows:36px;row-gap:2px}
.dt2-js{display:flex;align-items:center;justify-content:center;height:26px;align-self:center;
  font-size:11px;font-weight:700;color:var(--dt-mut)}
.dt2-pop .dt2-j{position:relative;width:36px;height:36px;margin:0 2px;border-radius:10px;
  font-size:13px;font-weight:500;color:var(--dt-txt);font-variant-numeric:tabular-nums}
.dt2-pop .dt2-j.we{color:var(--dt-mut)}
.dt2-pop .dt2-j.hors{color:var(--dt-mut);opacity:.45}
.dt2-pop .dt2-j:hover:not(:disabled):not(.on){background:var(--dt-hov)}
.dt2-pop .dt2-j.auj{box-shadow:inset 0 0 0 1.5px var(--dt-on);font-weight:700;color:var(--dt-ink)}
.dt2-pop .dt2-j.on{background:var(--dt-on);color:var(--dt-on-txt);font-weight:700;opacity:1}
.dt2-pop .dt2-j.fer::after{content:"";position:absolute;left:50%;bottom:4px;width:4px;height:4px;margin-left:-2px;
  border-radius:50%;background:var(--dt-fer)}
.dt2-pop .dt2-j.on.fer::after{background:var(--dt-on-txt)}
.dt2-pop .dt2-j:disabled{opacity:.25}
.dt2-legende{display:flex;align-items:center;gap:6px;height:20px;margin-top:4px;padding-left:4px;
  font-size:11px;font-weight:500;color:var(--dt-mut);white-space:nowrap}
.dt2-pt{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--dt-fer);flex:0 0 5px}

/* mois et années : même hauteur que les jours, rien ne saute */
.dt2-gmois{display:grid;grid-template-columns:repeat(3,1fr);grid-auto-rows:1fr;gap:6px;height:244px}
.dt2-pop .dt2-m{border-radius:10px;font-size:13px;font-weight:600;color:var(--dt-txt)}
.dt2-pop .dt2-m:hover:not(:disabled):not(.on){background:var(--dt-hov)}
.dt2-pop .dt2-m.auj{box-shadow:inset 0 0 0 1.5px var(--dt-on);color:var(--dt-ink)}
.dt2-pop .dt2-m.on{background:var(--dt-on);color:var(--dt-on-txt)}
.dt2-pop .dt2-m:disabled{opacity:.3}

/* heures */
.dt2-heures{display:flex;flex-direction:column;width:96px;flex:0 0 96px;margin-left:12px;padding-left:12px;
  border-left:1px solid var(--dt-line)}
.dt2-hlbl{display:flex;align-items:center;height:32px;margin:0 0 4px;padding-left:2px;
  font-size:11px;font-weight:700;color:var(--dt-mut);text-transform:uppercase;letter-spacing:.04em}
.dt2-pop .dt2-hsaisie{width:100%;height:32px;margin:0 0 6px;padding:0 10px;border:1px solid var(--dt-line);border-radius:9px;
  background:var(--dt-card);color:var(--dt-txt);font:inherit;font-size:13px;font-weight:600;
  font-variant-numeric:tabular-nums;-webkit-user-select:text;user-select:text;box-shadow:none;outline:none}
.dt2-pop .dt2-hsaisie:focus{border-color:var(--dt-on);box-shadow:var(--dt-ring)}
.dt2-pop .dt2-hsaisie.err{border-color:var(--dt-err)}
.dt2-pop .dt2-hsaisie::placeholder{color:var(--dt-mut);font-weight:500}
.dt2-hliste{position:relative;flex:1 1 0;height:0;min-height:0;overflow-y:auto;overscroll-behavior:contain;
  scrollbar-width:thin;padding-right:2px}
.dt2-pop .dt2-h{display:flex;width:100%;height:30px;margin:0 0 2px;border-radius:8px;
  font-size:13px;font-weight:500;color:var(--dt-mut);font-variant-numeric:tabular-nums}
.dt2-pop .dt2-h.ronde{color:var(--dt-txt);font-weight:600}
.dt2-pop .dt2-h:hover:not(:disabled):not(.on){background:var(--dt-hov);color:var(--dt-ink)}
.dt2-pop .dt2-h.on{background:var(--dt-on);color:var(--dt-on-txt);font-weight:700}
.dt2-pop .dt2-h:disabled{opacity:.3}
/* heure seule : pas de calendrier, la liste a sa hauteur */
.dt2-time .dt2-heures{margin:0;padding:0;border:0;width:120px;flex-basis:120px}
.dt2-time .dt2-hliste{flex:none;height:216px}

/* pied */
.dt2-pied{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-top:8px;padding-top:10px;
  border-top:1px solid var(--dt-line)}
.dt2-pied[hidden]{display:none}
.dt2-recap{flex:1 1 auto;min-width:0;font-size:12.5px;font-weight:600;color:var(--dt-ink);white-space:nowrap}
.dt2-recap em{font-style:normal;font-weight:600;color:var(--dt-fer);margin-left:6px}
.dt2-pop .dt2-btn{height:32px;padding:0 14px;border-radius:9px;font-size:12.5px;font-weight:700}
.dt2-pop .dt2-btn.sec{color:var(--dt-mut)}
.dt2-pop .dt2-btn.sec:hover{background:var(--dt-hov);color:var(--dt-ink)}
.dt2-pop .dt2-btn.ok{background:var(--dt-on);color:var(--dt-on-txt);min-width:88px}
.dt2-pop .dt2-btn.ok:hover:not(:disabled){filter:brightness(1.15)}
.dt2-pop .dt2-btn.ok:disabled{opacity:.4}
.dt2-date .dt2-pied,.dt2-month .dt2-pied,.dt2-time .dt2-pied{justify-content:flex-start}

/* thème « app » : un champ sans style de son écran prend celui des champs de l'espace (après la règle du Desk,
   même spécificité nulle) */
:where(html.dt2.dt2-app input.dt2-nu){width:100%;height:46px;border-radius:12px;border:0;box-shadow:inset 0 0 0 1.5px var(--dt-line);
  padding:0 13px;font-size:15px;background-color:#fff;color:var(--dt-ink)}
