/* L'Observatoire, saisie.css : l'écran d'une étape (le rail des étapes à gauche, la feuille à droite, la barre qui
   suit), les champs et les tableaux de saisie, la liste de choix, le calendrier, la bulle d'aide, les tableaux larges.
   Les noms de classe v2-* sont ceux que lit le script de saisie (v2.js, v2-composants.js) : ils ne changent pas. */

/* ================================================================ la page d'une étape : rail et feuille */
.etape-p { display: grid; grid-template-columns: var(--rail) minmax(0, 1fr); gap: 24px; align-items: start; }
.rail { position: sticky; top: calc(var(--haut) + 16px); max-height: calc(100vh - var(--haut) - 32px); overflow: auto; scrollbar-width: none; padding-right: 2px; } .rail::-webkit-scrollbar { display: none; }
.rail-tete { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 4px 12px; align-items: center; padding: 14px 14px 14px 12px; margin-bottom: 8px; background: var(--surface); border: 1px solid var(--filet); border-radius: var(--r-g); }
.rail-tete .anneau { grid-row: span 2; } .rail-tete b { font-size: 13.5px; color: var(--encre); padding-right: 26px; } .rail-tete span { font-size: 12px; color: var(--encre-3); line-height: 1.35; }
.rail-tete .echeance { grid-column: 1 / -1; margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--filet-2); font-size: 12px; color: var(--encre-3); display: flex; align-items: center; gap: 6px; }
.rail-tete .echeance .lucide { width: 13px; height: 13px; } .rail-tete .echeance b { font-size: 12px; }
.rail-l { display: grid; gap: 2px; }
.rail-e { position: relative; display: grid; grid-template-columns: 26px minmax(0, 1fr) auto; gap: 10px; align-items: center; min-height: 40px; padding: 7px 10px 7px 8px; border-radius: var(--r); color: var(--encre-2); text-decoration: none !important; font-size: 13.5px; font-weight: 500; }
.rail-e:hover { background: var(--appuye); color: var(--encre); }
.rail-e .sa-n { width: 26px; height: 26px; border-radius: 8px; display: grid; place-items: center; background: var(--surface); border: 1px solid var(--filet-fort); font-size: 12px; font-weight: 600; color: var(--encre-2); }
.rail-e .sa-n .lucide { width: 14px; height: 14px; }
.rail-e.pret .sa-n { background: var(--ok-pale); border-color: var(--ok-filet); color: var(--ok); }
.rail-e .pts { min-width: 20px; height: 20px; padding: 0 6px; border-radius: 10px; background: var(--at-pale); color: var(--at); font-size: 11.5px; font-weight: 700; display: grid; place-items: center; }
.rail-e.on { background: var(--surface); border: 1px solid var(--filet); color: var(--encre); font-weight: 600; box-shadow: inset 3px 0 0 var(--produit); }
.rail-e.on .sa-n { background: var(--produit); border-color: var(--produit); color: #fff; }
.rail-e.envoi { margin-top: 8px; border-top: 1px solid var(--filet-2); padding-top: 12px; border-radius: 0 0 var(--r) var(--r); }
.rail-e.envoi .sa-n { background: var(--jaune); border-color: var(--jaune); color: var(--encre); }
/* dans l'étape ouverte : ses sections, suivies au défilement */
.rail-s { display: grid; gap: 1px; margin: 2px 0 6px 20px; padding-left: 14px; border-left: 1px solid var(--filet); }
.rail-s a { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 6px 8px; border-radius: var(--r-s); font-size: 12.5px; color: var(--encre-3); text-decoration: none !important; line-height: 1.3; }
.rail-s a:hover { color: var(--encre); background: var(--appuye); }
.rail-s a.on { color: var(--encre); font-weight: 600; background: var(--surface); box-shadow: inset 0 0 0 1px var(--filet); }
.rail-s small { font-size: 11px; color: var(--encre-4); font-variant-numeric: tabular-nums; white-space: nowrap; } .rail-s a.plein small { color: var(--ok); }
.rail-s small .lucide { width: 12px; height: 12px; vertical-align: -2px; }
.rail-aide { margin-top: 12px; border-radius: var(--r-g); background: var(--surface); border: 1px solid var(--filet); font-size: 12.5px; color: var(--encre-3); line-height: 1.5; }
.rail-aide summary { display: flex; align-items: center; gap: 8px; padding: 10px 12px; cursor: pointer; list-style: none; font-weight: 600; color: var(--encre-2); border-radius: var(--r-g); } .rail-aide summary::-webkit-details-marker { display: none; }
.rail-aide summary:hover { background: var(--surface-2); } .rail-aide summary .lucide { width: 15px; height: 15px; color: var(--encre-3); } .rail-aide summary .chev { margin-left: auto; transition: transform .15s; } .rail-aide[open] summary .chev { transform: rotate(180deg); }
.rail-aide .kbd { margin-right: 2px; }
.rail-aide dl { display: grid; grid-template-columns: auto minmax(0, 1fr); gap: 7px 10px; align-items: center; padding: 2px 12px 12px; } .rail-aide dd { margin: 0; }

/* la feuille */
.feuille { min-width: 0; }
.feuille .tete { margin-bottom: 14px; align-items: flex-start; }
.feuille .tete h1 { font-size: 26px; } .feuille .tete p { font-size: 14.5px; }
/* la barre fixe : où l'on est, ce qui est enregistré, ce qui reste à voir, et le pas suivant */
.v2-barre { position: sticky; top: var(--haut); z-index: 30; display: flex; align-items: center; gap: 14px; flex-wrap: wrap; margin: 0 0 16px; padding: 8px 10px 8px 14px; background: var(--surface); border: 1px solid var(--filet); border-radius: var(--r-g); }
.v2-barre.colle .ou { display: grid; }
.v2-barre.colle { border-radius: 0 0 var(--r-g) var(--r-g); box-shadow: 0 8px 16px -12px rgba(17, 17, 17, .3); }
.v2-barre .ou { display: none; line-height: 1.25; min-width: 150px; font-size: 12px; color: var(--encre-3); } .v2-barre .ou b { font-size: 14px; color: var(--encre); }
.v2-etat { display: inline-flex; align-items: center; gap: 7px; font-size: 13px; color: var(--encre-3); margin: 0; padding: 0 10px; height: 30px; border-radius: 15px; background: var(--surface-2); }
.v2-etat .lucide { width: 15px; height: 15px; }
.v2-etat.attente { color: var(--jaune-texte); background: var(--jaune-pale); } .v2-etat.attente::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: var(--jaune); animation: pouls 1s infinite; }
.v2-etat.ok { color: var(--ok); background: var(--ok-pale); } .v2-etat.erreur { color: var(--ko); background: var(--ko-pale); font-weight: 600; }
@keyframes pouls { 50% { opacity: .25; } }
.v2-bouton-alertes { display: inline-flex; align-items: center; gap: 7px; height: 30px; padding: 0 11px; border-radius: 15px; border: 1px solid var(--at-filet); background: var(--at-pale); color: var(--at); font-size: 13px; font-weight: 600; cursor: pointer; }
.v2-bouton-alertes .lucide { width: 15px; height: 15px; } .v2-bouton-alertes.vide { border-color: var(--ok-filet); background: var(--ok-pale); color: var(--ok); }
.v2-bouton-alertes[aria-expanded=true] { box-shadow: var(--anneau); }
.v2-barre-nav { margin-left: auto; display: flex; gap: 6px; align-items: center; }

/* les blocs d'une étape */
.v2-bloc { background: var(--surface); border: 1px solid var(--filet); border-radius: var(--r-g); margin-bottom: 16px; scroll-margin-top: calc(var(--haut) + 70px); }
.v2-bloc > header, .v2-bloc details > summary { display: flex; align-items: center; gap: 12px; padding: 14px 20px; flex-wrap: wrap; }
.v2-bloc > header { border-bottom: 1px solid var(--filet-2); }
.v2-bloc > header h2, .v2-bloc details > summary h2 { font-size: 17px; margin: 0; }
.v2-bloc > header .actions { margin-left: auto; display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }
.v2-bloc .intro { padding: 12px 20px; font-size: 13.5px; color: var(--encre-2); line-height: 1.6; border-bottom: 1px solid var(--filet-2); max-width: 1100px; }
.v2-bloc .corps { padding: 16px 20px 20px; }
.v2-bloc details > summary { cursor: pointer; list-style: none; border-radius: var(--r-g); } .v2-bloc details > summary::-webkit-details-marker { display: none; }
.v2-bloc details > summary:hover { background: var(--surface-2); }
.v2-bloc details > summary .chevron { width: 18px; height: 18px; color: var(--encre-3); transition: transform .15s; }
.v2-bloc details[open] > summary { border-bottom: 1px solid var(--filet-2); border-radius: var(--r-g) var(--r-g) 0 0; } .v2-bloc details[open] > summary .chevron { transform: rotate(90deg); }
.v2-bloc .facultatif { margin-left: auto; font-size: 11.5px; font-weight: 600; color: var(--encre-3); background: var(--survol); padding: 3px 10px; border-radius: 99px; }
.v2-bloc .avancement { font-size: 12px; color: var(--encre-3); font-variant-numeric: tabular-nums; display: inline-flex; align-items: center; gap: 6px; }
.v2-bloc .avancement .jauge { width: 64px; } .v2-bloc .avancement .lucide { display: none; width: 15px; height: 15px; }
.v2-bloc .avancement.plein { color: var(--ok); font-weight: 600; } .v2-bloc .avancement.plein .jauge i { background: var(--ok-point); } .v2-bloc .avancement.plein .lucide { display: block; }
.v2-alertes-zone { margin-bottom: 16px; }
.v2-alertes { border: 1px solid var(--at-filet); background: var(--at-pale); border-radius: var(--r-g); padding: 14px 18px; }
.v2-alertes h3 { display: flex; align-items: center; gap: 8px; font-size: 14px; color: var(--at); margin-bottom: 4px; } .v2-alertes h3 .lucide { width: 16px; height: 16px; }
.v2-alertes p { font-size: 12.5px; color: var(--encre-2); margin-bottom: 10px; }
.v2-alertes ul { display: grid; grid-template-columns: repeat(auto-fill, minmax(340px, 1fr)); gap: 6px 18px; }
.v2-alertes li { font-size: 13px; display: flex; flex-direction: column; padding: 6px 0 6px 12px; border-left: 3px solid var(--at-filet); } .v2-alertes li b { color: var(--encre); } .v2-alertes li span { color: var(--encre-2); }
.v2-nav-bas { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-top: 6px; padding: 14px 0 0; }
.v2-nav-bas .mention { font-size: 12.5px; }

/* ================================================================ champs */
.v2-champs { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 18px 24px; max-width: 1400px; }
.v2-champs.rappels { grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 14px 20px; }
.v2-champ { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.v2-champ.large { grid-column: 1 / -1; }
.v2-champ label { font-size: 13.5px; font-weight: 600; color: var(--encre); line-height: 1.35; }
.v2-champ label .req { color: var(--orange); margin-left: 3px; }
.v2-champ .saisie { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; }
.v2-champ .aide { display: flex; gap: 6px; align-items: flex-start; font-size: 12.5px; color: var(--encre-3); line-height: 1.45; }
.v2-champ .aide .lucide { width: 14px; height: 14px; flex: none; margin-top: 2px; } .v2-champ .aide.origine { color: var(--jaune-texte); }
.v2-champ.t-nombre .v2-in, .v2-champ.t-entier .v2-in, .v2-champ.t-euros .v2-in, .v2-champ.t-taux .v2-in, .v2-champ.t-pourcentage .v2-in { max-width: 220px; }
.v2-champ.t-date .v2-in { max-width: 190px; } .v2-champ.t-liste .v2-in { max-width: 420px; } .v2-champ .v2-unite { max-width: 220px; width: 100%; }
/* la case de saisie */
.v2-in { width: 100%; height: 40px; font: inherit; font-size: 14px; padding: 8px 12px; border: 1px solid var(--filet-fort); border-radius: var(--r); background: var(--surface); color: var(--encre); text-align: right; font-variant-numeric: tabular-nums; transition: border-color .12s, box-shadow .12s, background .12s; }
.v2-in.texte, .v2-in.date, textarea.v2-in, select.v2-in { text-align: left; }
textarea.v2-in { height: auto; min-height: 110px; resize: vertical; line-height: 1.55; } select.v2-in { padding-right: 28px; cursor: pointer; }
.v2-in:hover { border-color: var(--encre-4); } .v2-in:focus { outline: none; border-color: var(--case-focus); box-shadow: var(--anneau); }
.v2-in::placeholder { color: var(--encre-4); }
.v2-in.ajustable { background: var(--case-ajustable); border-color: var(--case-ajustable-filet); color: var(--vert-fort); }
.v2-in.ajustee { background: var(--case-ajustee); border-color: var(--case-ajustee-filet); }
.v2-in.erreur { border-color: var(--case-erreur); background: var(--case-erreur-fond); box-shadow: 0 0 0 3px rgba(155, 46, 26, .12); }
.v2-in.enregistre { border-color: var(--ok-point); box-shadow: 0 0 0 3px rgba(0, 160, 150, .18); }
.v2-in[readonly], .v2-in:disabled { background: var(--case-calc); color: var(--encre-3); cursor: default; box-shadow: none; }
.v2-unite { position: relative; display: inline-block; }
.v2-unite::after { content: attr(data-unite); position: absolute; right: 12px; top: 50%; transform: translateY(-50%); font-size: 13px; color: var(--encre-3); pointer-events: none; }
.v2-unite .v2-in { padding-right: 30px; }
.v2-calc { display: block; text-align: right; font-variant-numeric: tabular-nums; color: var(--encre); font-size: 13.5px; padding: 8px 10px; white-space: nowrap; }
.v2-calc.change { animation: eclat .9s ease; } @keyframes eclat { 0% { background: var(--jaune-pale); } 100% { background: transparent; } }
.v2-err { display: block; font-size: 12px; color: var(--ko); margin-top: 4px; text-align: left; font-weight: 500; line-height: 1.35; }
.v2-reset { display: inline-flex; align-items: center; gap: 5px; border: 0; background: none; color: var(--jaune-texte); cursor: pointer; font: inherit; font-size: 12px; font-weight: 600; padding: 4px 6px; border-radius: 6px; }
.v2-reset:hover { background: var(--jaune-pale); } .v2-reset .lucide { width: 14px; height: 14px; }
.v2-select-petit { height: 34px; font: inherit; font-size: 13px; border: 1px solid var(--filet-fort); border-radius: var(--r); padding: 0 8px; background: var(--surface); }
.v2-import { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.v2-fichier { position: relative; display: inline-flex; cursor: pointer; } .v2-fichier input[type=file] { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; }
.v2-fichier input[type=file]:focus-visible + .btn { outline: 2px solid var(--jaune-fort); outline-offset: 2px; }

/* ================================================================ tableaux de saisie */
.v2-legende { display: flex; gap: 6px 16px; flex-wrap: wrap; align-items: center; font-size: 12px; color: var(--encre-3); margin-bottom: 10px; }
.v2-legende li { display: inline-flex; align-items: center; gap: 6px; }
.v2-legende i { display: inline-block; width: 22px; height: 12px; border-radius: 3px; border: 1px solid var(--filet); background: var(--surface); }
.v2-legende i.saisie { border-color: var(--filet-fort); } .v2-legende i.ajustable { background: var(--case-ajustable); border-color: var(--case-ajustable-filet); }
.v2-legende i.ajustee { background: var(--case-ajustee); border-color: var(--case-ajustee-filet); } .v2-legende i.calcul { background: var(--case-calc); }
.v2-legende i.interdit { background: repeating-linear-gradient(135deg, #EFEFED, #EFEFED 3px, #E0E0DD 3px, #E0E0DD 6px); }
.v2-legende i.obligatoire { box-shadow: inset 3px 0 0 var(--ok-point); } .v2-legende i.possible { box-shadow: inset 3px 0 0 var(--jaune); }
.v2-legende .astuce { margin-left: auto; } .v2-legende .astuce .lucide { width: 15px; height: 15px; }
.v2-grille-zone { position: relative; }
.v2-grille-cadre { position: relative; overflow: auto; max-height: calc(100vh - var(--haut) - 120px); border: 1px solid var(--filet); border-radius: var(--r); background: var(--surface); scrollbar-width: thin; scrollbar-color: var(--filet-fort) transparent; scroll-padding-left: 280px; scroll-padding-top: 56px; }
.v2-grille-cadre:focus { outline: none; }
table.v2-grille { border-collapse: separate; border-spacing: 0; font-size: 13px; width: 100%; }
.v2-grille th, .v2-grille td { border-bottom: 1px solid var(--filet-2); border-right: 1px solid var(--filet-2); padding: 0; vertical-align: middle; }
.v2-grille thead th { position: sticky; top: 0; z-index: 3; background: var(--surface-2); font-size: 11.5px; font-weight: 600; letter-spacing: .02em; color: var(--encre-2); text-align: right; line-height: 1.3; padding: 9px 10px; white-space: normal; vertical-align: bottom; border-bottom: 1px solid var(--filet); }
.v2-grille thead th.focus { background: var(--jaune-pale); color: var(--encre); box-shadow: inset 0 -2px 0 var(--jaune); }
.v2-grille th.col-lib { position: sticky; left: 0; z-index: 2; background: var(--surface); text-align: left; font-weight: 500; color: var(--encre); min-width: 250px; max-width: 380px; padding: 7px 12px; line-height: 1.35; box-shadow: 1px 0 0 var(--filet); }
.v2-grille thead th.col-lib { z-index: 4; background: var(--surface-2); font-weight: 600; }
.v2-grille thead th.t-euros, .v2-grille thead th.t-nombre { min-width: 124px; } .v2-grille thead th.t-entier, .v2-grille thead th.t-taux, .v2-grille thead th.t-pourcentage { min-width: 96px; }
.v2-grille thead th.t-date { min-width: 140px; } .v2-grille thead th.t-liste { min-width: 210px; } .v2-grille thead th.t-texte { min-width: 200px; } .v2-grille thead th.large { min-width: 280px; } .v2-grille thead th.col-action { min-width: 44px; }
.v2-grille thead th.t-texte, .v2-grille thead th.t-date, .v2-grille thead th.t-liste { text-align: left; }
.v2-grille td { position: relative; } .v2-grille td .v2-in { height: 36px; border: 0; border-radius: 0; background: transparent; font-size: 13.5px; padding: 6px 10px; box-shadow: none; }
.v2-grille td .v2-in:hover { background: var(--surface-2); }
.v2-grille td .v2-in:focus { background: var(--surface); box-shadow: inset 0 0 0 2px var(--case-focus); position: relative; z-index: 1; }
.v2-grille td .v2-in.ajustable { background: var(--case-ajustable); color: var(--vert-fort); } .v2-grille td .v2-in.ajustee { background: var(--case-ajustee); padding-right: 28px; }
.v2-grille td .v2-in.erreur { background: var(--case-erreur-fond); box-shadow: inset 0 0 0 2px var(--case-erreur); } .v2-grille td .v2-in.enregistre { box-shadow: inset 0 0 0 2px var(--ok-point); }
.v2-grille td .v2-in[readonly] { background: transparent; color: var(--encre-2); }
.v2-grille td .v2-err { padding: 0 10px 6px; margin: 0; }
.v2-grille td .v2-reset { position: absolute; right: 2px; top: 50%; transform: translateY(-50%); padding: 3px; background: rgba(254, 247, 230, .9); }
.v2-grille td.calc { background: var(--case-calc); }
.v2-grille td.interdit { background: repeating-linear-gradient(135deg, #F3F3F1, #F3F3F1 6px, #E8E8E5 6px, #E8E8E5 12px); }
.v2-grille td.obligatoire { box-shadow: inset 3px 0 0 var(--ok-point); } .v2-grille td.possible { box-shadow: inset 3px 0 0 var(--jaune); }
.v2-grille tbody tr:hover th.col-lib, .v2-grille tbody tr:hover td:not(.calc):not(.interdit) { background-color: var(--surface-2); }
.v2-grille tbody tr:focus-within th.col-lib { background: var(--miel); color: var(--encre); box-shadow: inset 3px 0 0 var(--jaune), 1px 0 0 var(--filet); }
.v2-grille tbody tr:focus-within td:not(.calc):not(.interdit) { background-color: #FFFCF3; }
.v2-grille tbody td.col-on:not(.calc):not(.interdit) { background-color: #FFFCF3; } .v2-grille tbody td.col-on .v2-in:not(:focus):not(.ajustable):not(.ajustee):not(.erreur) { background: transparent; }
.v2-grille tr.total th, .v2-grille tr.total td { background: var(--surface-2); font-weight: 600; } .v2-grille tr.total .v2-calc { font-weight: 600; }
.v2-grille tr.niveau-2 th.col-lib { padding-left: 28px; font-weight: 400; } .v2-grille tr.niveau-3 th.col-lib { padding-left: 44px; font-weight: 400; color: var(--encre-3); font-style: italic; }
.v2-grille tr.rubrique th.col-lib { font-weight: 600; color: var(--vert-fort); } .v2-grille tr.rubrique td { background: var(--surface-2); }
.v2-grille td.col-action { text-align: center; }
.v2-interdit { display: block; height: 36px; }
.v2-personne-retirer { border: 0; background: none; color: var(--encre-3); cursor: pointer; padding: 6px; border-radius: 7px; display: inline-flex; }
.v2-personne-retirer:hover { color: var(--ko); background: var(--ko-pale); } .v2-personne-retirer .lucide { width: 16px; height: 16px; }
.v2-vide { display: flex; gap: 14px; align-items: center; padding: 18px; border: 1px dashed var(--filet-fort); border-radius: var(--r-g); color: var(--encre-3); }
.v2-vide .lucide { width: 26px; height: 26px; color: var(--produit); } .v2-vide b { color: var(--encre); }
.v2-grille .aide-col { border: 0; background: none; padding: 2px; margin-left: 3px; border-radius: 50%; cursor: pointer; color: var(--encre-3); display: inline-flex; vertical-align: -3px; }
.v2-grille .aide-col:hover, .v2-grille .aide-col:focus-visible, .v2-grille .aide-col[aria-describedby] { color: var(--vert-fort); background: var(--vert-pale); } .v2-grille .aide-col .lucide { width: 15px; height: 15px; }
.v2-grille td select.v2-in { appearance: none; -webkit-appearance: none; padding-right: 26px; cursor: pointer; background-image: none; }
.v2-grille tr:hover td select.v2-in, .v2-grille td select.v2-in:focus { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='%236E716E' stroke-width='2.5'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 9px center; }
.v2-grille td select.v2-in.ajustable { background-color: var(--case-ajustable); } .v2-grille td select.v2-in.ajustee { background-color: var(--case-ajustee); }
select.v2-in[aria-expanded=true] { box-shadow: inset 0 0 0 2px var(--case-focus); }
.v2-grille .v2-date input::placeholder { color: var(--filet-fort); } .v2-grille .v2-date input:focus::placeholder { color: var(--encre-4); }
.v2-grille .v2-date-btn { opacity: .4; transition: opacity .12s; } .v2-grille tr:hover .v2-date-btn, .v2-grille .v2-date:focus-within .v2-date-btn { opacity: 1; }
/* tableaux larges : repères et ombres de défilement */
.v2-defil { display: none; align-items: center; gap: 6px; justify-content: flex-end; margin: -4px 0 8px; }
.v2-grille-zone.deborde .v2-defil { display: flex; }
.v2-defil-repere { font-size: 12px; color: var(--encre-3); margin-right: 6px; font-variant-numeric: tabular-nums; }
.v2-defil button { border: 1px solid var(--filet-fort); background: var(--surface); border-radius: var(--r); width: 32px; height: 30px; cursor: pointer; display: flex; align-items: center; justify-content: center; color: var(--encre); }
.v2-defil button:hover:not(:disabled) { border-color: var(--encre-4); } .v2-defil button:disabled { opacity: .35; cursor: default; } .v2-defil button .lucide { width: 17px; height: 17px; }
.v2-grille-zone::after { content: ""; position: absolute; right: 1px; bottom: 1px; width: 36px; top: 38px; pointer-events: none; border-radius: 0 var(--r) var(--r) 0; background: linear-gradient(90deg, rgba(255, 255, 255, 0), rgba(17, 17, 17, .10)); opacity: 0; transition: opacity .15s; }
.v2-grille-zone.ombre-d::after { opacity: 1; }
.v2-grille-zone.ombre-g .v2-grille th.col-lib { box-shadow: 1px 0 0 var(--filet), 8px 0 12px -6px rgba(17, 17, 17, .22); }
.v2-grille-cadre::-webkit-scrollbar { height: 10px; width: 10px; } .v2-grille-cadre::-webkit-scrollbar-track { background: transparent; }
.v2-grille-cadre::-webkit-scrollbar-thumb { background: var(--filet-fort); border-radius: 8px; border: 2px solid var(--surface); } .v2-grille-cadre::-webkit-scrollbar-thumb:hover { background: var(--encre-4); }
/* la case où l'on s'était arrêté, retrouvée à l'ouverture */
.v2-in.repere { animation: repere 1.8s var(--doux); } @keyframes repere { 0%, 50% { box-shadow: 0 0 0 3px rgba(248, 179, 52, .6); } }

/* ================================================================ liste de choix, calendrier, bulle */
.v2-pop { position: fixed; z-index: 1000; background: var(--surface); border-radius: var(--r-g); box-shadow: var(--ombre-pop); overflow: hidden; animation: deroule .12s var(--doux); }
.v2-liste { display: flex; flex-direction: column; max-height: 340px; min-width: 260px; max-width: 460px; }
.v2-liste-cherche { display: flex; align-items: center; gap: 8px; padding: 9px 12px; border-bottom: 1px solid var(--filet-2); }
.v2-liste-cherche .lucide { width: 16px; height: 16px; color: var(--encre-3); } .v2-liste-cherche input { border: 0; outline: 0; font: inherit; font-size: 14px; width: 100%; background: transparent; padding: 2px 0; }
.v2-liste ul { overflow-y: auto; padding: 5px; margin: 0; scrollbar-width: thin; }
.v2-liste li { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: var(--r-s); cursor: pointer; font-size: 13.5px; line-height: 1.3; }
.v2-liste li .code { min-width: 30px; font-weight: 600; color: var(--vert-fort); font-variant-numeric: tabular-nums; } .v2-liste li .lib { flex: 1; } .v2-liste li .lucide { width: 16px; height: 16px; color: var(--vert); }
.v2-liste li.vide .lib { color: var(--encre-3); font-style: italic; } .v2-liste li.actif { background: var(--survol); } .v2-liste li[aria-selected=true] { font-weight: 600; }
.v2-liste-rien { padding: 14px; color: var(--encre-3); font-size: 13px; margin: 0; }
.v2-date { position: relative; display: block; width: 100%; } .v2-date .v2-in { padding-right: 36px; text-align: left; font-variant-numeric: tabular-nums; letter-spacing: .02em; }
.v2-date-btn { position: absolute; right: 4px; top: 50%; transform: translateY(-50%); z-index: 2; border: 0; background: none; color: var(--encre-3); padding: 5px; border-radius: 7px; cursor: pointer; display: flex; }
.v2-date-btn:hover { background: var(--jaune-pale); color: var(--encre); } .v2-date-btn .lucide { width: 17px; height: 17px; }
.v2-champ.t-date .v2-date { max-width: 190px; }
.v2-cal { padding: 12px; width: 292px; } .v2-cal-tete { display: flex; align-items: center; gap: 6px; margin-bottom: 8px; }
.v2-cal-tete .nav { border: 0; background: none; border-radius: var(--r); padding: 6px; cursor: pointer; color: var(--encre); display: flex; } .v2-cal-tete .nav:hover { background: var(--survol); } .v2-cal-tete .nav .lucide { width: 17px; height: 17px; }
.v2-cal-tete .mois { flex: 1; font: inherit; font-size: 13.5px; font-weight: 600; border: 1px solid var(--filet-fort); border-radius: var(--r); padding: 5px 6px; background: var(--surface); text-transform: capitalize; }
.v2-cal-tete .an { width: 70px; font: inherit; font-size: 13.5px; font-weight: 600; border: 1px solid var(--filet-fort); border-radius: var(--r); padding: 5px 6px; }
.v2-cal-jours, .v2-cal-grille { display: grid; grid-template-columns: repeat(7, 1fr); gap: 2px; }
.v2-cal-jours span { font-size: 11px; font-weight: 600; color: var(--encre-3); text-align: center; padding: 4px 0; }
.v2-cal-grille button { border: 0; background: none; height: 34px; border-radius: var(--r); font: inherit; font-size: 13px; cursor: pointer; color: var(--encre-2); font-variant-numeric: tabular-nums; }
.v2-cal-grille button:hover { background: var(--survol); } .v2-cal-grille button.weekend { color: var(--encre-4); }
.v2-cal-grille button.aujourdhui { box-shadow: inset 0 0 0 1px var(--jaune-fort); font-weight: 600; } .v2-cal-grille button.choisi { background: var(--encre); color: #fff; font-weight: 600; }
.v2-cal-pied { display: flex; gap: 6px; justify-content: space-between; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--filet-2); }
.v2-cal-pied button { border: 0; background: none; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--vert-fort); padding: 5px 8px; border-radius: 7px; cursor: pointer; } .v2-cal-pied button:hover { background: var(--survol); } .v2-cal-pied button[data-rac=effacer] { color: var(--encre-3); }
.v2-bulle { position: fixed; z-index: 1100; max-width: 320px; background: var(--encre); color: #fff; font-size: 12.5px; line-height: 1.5; padding: 9px 12px; border-radius: var(--r); pointer-events: none; animation: deroule .1s ease; }