/* Utilisateurs : fiche, embauche, dossiers des salariés (organigramme.js). Sortie de portail.css (L9) ; chargée au démarrage, juste après elle, car organigramme.js est une zone de démarrage. Mêmes règles, même ordre. */
/* Fiche du salarié (écrite par validations.js, ouverte depuis cet écran) : avant les règles de l’écran, comme dans l’ordre d’origine. */
.jsaGrille{display:flex;gap:var(--e-3);flex-wrap:wrap;padding-top:var(--e-1)}
.jsaGrille label{display:flex;gap:var(--e-1);align-items:center;font-size:var(--t-s);color:var(--encre2);
    text-transform:none;letter-spacing:0;cursor:pointer}
.jsaGrille input{width:auto}
/* ---------- répartition hebdomadaire ---------- */
.rythmeGrille{display:grid;grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:var(--e-2)}
.rythmeGrille .rj{background:var(--surf);border:1px solid var(--filet);border-radius:var(--r);padding:var(--e-2) var(--e-2);display:flex;flex-direction:column;gap:var(--e-1)}
.rythmeGrille .rj b{font-size:var(--t-s);color:var(--encre2)}
.rythmeGrille .rj input,.rythmeGrille .rj select{font-size:var(--t-s);padding:var(--e-1) var(--e-2);min-height:var(--h-ctrl)}
.eqEdit.fFiche{display:flex;flex-direction:column;gap:var(--e-3);background:none;border-top:0;padding:0}
.fIdent{margin:0;color:var(--encre2)}
/* le titre de rubrique est un vrai titre, hors du summary (qui ne porte que « Modifier ») : titre et
     <details> partagent la première ligne d'une grille, le clic sur toute la ligne continue d'ouvrir */
.fRub{border-top:1px solid var(--filet);padding:var(--e-1) 0 var(--e-3);display:grid;grid-template-columns:minmax(0,1fr)}
.fRub>h4,.fRub>details{grid-area:1/1}
.fRub>h4{display:flex;align-items:center;align-self:start;min-height:var(--h-ctrl);padding-right:calc(var(--h-ctrl) * 2 + var(--e-3));pointer-events:none}
.fRub summary{display:flex;align-items:center;justify-content:flex-end;gap:var(--e-3);min-height:var(--h-ctrl);list-style:none;border-radius:var(--r);cursor:pointer}
.fRub summary::-webkit-details-marker{display:none}
.fRub summary:focus-visible{outline:2px solid transparent;outline-offset:2px;box-shadow:var(--anneau)}
.fRub h4{flex:1;margin:0;font:var(--g-fort) var(--t-l)/var(--i-l) var(--f-titre);color:var(--encre)}
.fRub details[open] .fOuv,.fRub details:not([open]) .fFer{display:none}
.fRub details[open]+.fLect{display:none}
.fChamps{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:var(--e-3);padding:var(--e-2) 0 var(--e-1)}
.fLect{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:var(--e-3) var(--e-6);margin:0;padding:var(--e-1) 0 0}
.fLect dt{font-size:var(--t-s);line-height:var(--i-s);color:var(--encre3)}
.fLect dd{margin:0;overflow-wrap:anywhere}
.fLect dd.fVide{color:var(--encre3);font-style:italic}
/* R8 : colonne « Pièces du dossier » (fichePiecesHtml, droits.js). À partir de 1100 px elle se tient à
     droite des rubriques, avec la zone de l'assistant dessous ; en deçà, elle passe sous les rubriques.
     Une pièce par ligne à filet, son état en mots dans une étiquette (.chip ok, att, no). */
.fCorps{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--e-4)}
.fCote{display:flex;flex-direction:column;gap:var(--e-4);min-width:0}
@media(min-width:1100px){
.fCorps{grid-template-columns:minmax(0,1fr) 372px;gap:var(--e-5);align-items:start}
}
@media screen and (prefers-color-scheme:light){
.fRub{border-top:0}
.fRub{padding-top:var(--e-2)}
.fRub>h4{padding-left:var(--e-3);border-radius:var(--r);background:var(--surf2)}
.fLect{padding-top:var(--e-3)}
.fLect dt{color:var(--encre2)}
}
/* V-169 : section « Pré-embauche » de la fiche (formulaire en libre-service) —
     carte du module Utilisateurs (teinte bleue dans le puits), liste à filets */
.embSection{grid-column:1/-1;background:var(--surf);border:1px solid var(--filet);border-radius:var(--r-l);padding:var(--e-4) var(--e-4)}
.embSection .embTete{display:flex;align-items:flex-start;gap:var(--e-3);margin-bottom:var(--e-3)}
.embSection .embTete .puits{flex:none;width:30px;height:30px;border-radius:var(--r);background:var(--info-d);color:var(--info);display:grid;place-items:center}
.embSection .embTete .embTitre{display:flex;flex-direction:column;gap:var(--e-1);min-width:0}
.embSection .embTete b{font-family:var(--f-ui);font-weight:var(--g-fort);font-size:var(--t-m);line-height:1.25}
.embSection .embTete .sub{margin:0}
.embSection .embStatut{display:flex;flex-wrap:wrap;gap:var(--e-2) var(--e-4);align-items:center;font-size:var(--t-s);color:var(--encre2);margin:0 0 var(--e-3)}
.embSection .embActions{display:flex;gap:var(--e-2);flex-wrap:wrap;align-items:center}
.embSection .embLien{display:flex;gap:var(--e-2);align-items:center;margin-top:var(--e-2);flex-wrap:wrap}
/* V-185 (m3) : confirmation EN LIGNE avant de remplacer un lien — jamais de
     `confirm()` natif, même motif que le retrait d'une pièce de Mon dossier. */
.embSection .embConf{display:flex;align-items:center;gap:var(--e-2);flex-wrap:wrap;flex-basis:100%;
    background:var(--att-d);color:var(--att);border-radius:var(--r);padding:var(--e-2) var(--e-3)}
.embSection .embConf .question{flex:1 1 auto;font-weight:var(--g-fort);font-size:var(--t-s)}
.embSection .embLien input{flex:1;min-width:200px;font-family:var(--f-code);font-size:var(--t-m)}
.embSection .embNotice{display:flex;flex-direction:column;gap:var(--e-2);margin-top:var(--e-3);padding-top:var(--e-3);border-top:1px solid var(--filet);font-size:var(--t-s);color:var(--encre2)}
/* notices de la mutuelle (5 au plus) : cases à cocher sur les documents du module Informations, libellé court à côté */
.embSection ul.embNotices{margin:0;padding:0;list-style:none;border:1px solid var(--filet);border-radius:var(--r);max-height:280px;overflow:auto;background:var(--surf)}
.embSection ul.embNotices li{display:flex;align-items:center;gap:var(--e-3);padding:var(--e-2) var(--e-3);border-top:1px solid var(--filet);min-height:44px;flex-wrap:wrap}
.embSection ul.embNotices li:first-child{border-top:0}
.embSection ul.embNotices li.coche{background:var(--marque-d)}
.embSection ul.embNotices li label{display:flex;align-items:center;gap:var(--e-2);flex:1;min-width:200px;min-height:var(--h-ctrl);margin:0;font-size:var(--t-s);font-weight:var(--g-moyen);color:var(--encre);cursor:pointer}
.embSection ul.embNotices li input[type=checkbox]{width:18px;height:18px;margin:0;flex:none}
.embSection ul.embNotices li .cat{color:var(--encre3);font-size:var(--t-s);font-weight:var(--g-normal)}
.embSection ul.embNotices li input[type=text]{flex:1;min-width:180px;max-width:320px;font-size:var(--t-s);padding:var(--e-2) var(--e-2);min-height:var(--h-ctrl)}
.embSection ul.embPieces{margin:var(--e-2) 0 0;padding:0;list-style:none;font-size:var(--t-s);color:var(--encre2)}
.embSection ul.embPieces li{padding:var(--e-1) 0;border-top:1px dashed var(--filet)}
.embSection ul.embPieces li:first-child{border-top:0}
#dossTable table{width:100%;border-collapse:collapse}
#dossTable th,#dossTable td{text-align:left;vertical-align:top;padding:var(--e-2) var(--e-3);border-top:1px solid var(--filet)}
#dossTable tbody tr:hover{background:var(--surf2)}
#dossTable table{min-width:860px}
/* position:relative : les en-têtes masqués (.u-sr) restent dans le cadre défilant */
#dossTable th{white-space:nowrap;position:relative}
#dossTable td.coche{width:44px;padding:0 0 0 var(--e-1)}
/* la case fait 20 px, sa cible 44 px : l'étiquette porte le clic */
.dossCoche{display:grid;place-items:center;width:44px;height:44px;cursor:pointer}
.dossCoche:has(input:disabled){cursor:default}
#dossTable input[type=checkbox]{width:20px;height:20px;min-height:20px;margin:0;padding:0}
#dossTable td.sal{min-width:160px}
#dossTable td:nth-child(4){min-width:200px}
#dossTable td.rel{white-space:nowrap}
.dossOutils{display:flex;gap:var(--e-2);margin:var(--e-3) 0;flex-wrap:wrap;align-items:center}
.dossOutils select{width:auto;max-width:220px}
.dossOutils .sub{margin:0}
.dossNom{font-weight:var(--g-fort)}
.dossAg{color:var(--encre3);font-size:var(--t-s)}
/* V-185 : la voie, en un mot et sans jugement — pastille neutre, icône discrète */
.dossVoie .ic{width:13px;height:13px;vertical-align:-2px;margin-right:var(--e-1)}
.dossActs{display:flex;flex-wrap:wrap;gap:var(--e-2)}
.dossActs .btn{white-space:nowrap}
/* V-186 : la confirmation en ligne de « Forcer un lien », même forme que
     celle de la fiche (`.embSection .embConf`) */
.dossActs .embConf{display:flex;align-items:center;gap:var(--e-2);flex-wrap:wrap;flex-basis:100%}
.dossActs .embConf .question{flex:1 1 auto;font-weight:var(--g-fort);font-size:var(--t-s);color:var(--encre2)}
.dossActs .embConf .btn{white-space:normal}
.dossIgn{list-style:none;margin:var(--e-2) 0 0;padding:0 var(--e-3);border:1px solid var(--filet);border-radius:var(--r);max-height:240px;overflow:auto}
.dossIgn li{display:flex;flex-wrap:wrap;gap:var(--e-1) var(--e-3);justify-content:space-between;padding:var(--e-2) 0;border-top:1px solid var(--filet);font-size:var(--t-s)}
.dossIgn li:first-child{border-top:0}
.dossIgn li span:first-child{font-weight:var(--g-fort)}
.dossIgn .pq{color:var(--encre3)}
@media(max-width:700px){
/* une carte par salarié : case, nom et anneau sur la première ligne,
       le reste dessous, chaque information avec son intitulé */
#dossTable table{min-width:0}
#dossTable thead{display:none}
#dossTable tbody,#dossTable tr{display:grid}
#dossTable tr{grid-template-columns:44px minmax(0,1fr) auto;column-gap:var(--e-2);align-items:center;border-top:1px solid var(--filet);padding:var(--e-3) 0}
#dossTable tbody tr:hover{background:transparent}
#dossTable td{display:block;border:0;padding:var(--e-1) 0;grid-column:2/-1;min-width:0}
#dossTable td.coche{grid-column:1;padding:0}
#dossTable td.sal{grid-column:2;min-width:0}
#dossTable td:nth-child(4){min-width:0}
#dossTable td.ann{grid-column:3}
#dossTable td[data-lbl]::before{content:attr(data-lbl) " : ";font-size:var(--t-s);color:var(--encre3)}
#dossTable td.rel br{display:none}
#dossTable td.rel .dossAg{margin-left:var(--e-2)}
#dossTable td.acts{padding-top:var(--e-2)}
.dossOutils select{flex:1 1 150px;max-width:none}
.dossOutils .btn{flex:1 1 100%;justify-content:center}
.dossOutils .sub{flex-basis:100%}
}
#ecListe .ecCoche{display:grid;place-items:center;width:44px;height:44px;cursor:pointer}
.ecActuel{font-weight:var(--g-fort);color:var(--encre)}
.ecAv{font-size:var(--t-xs);border-radius:var(--r-rond);padding:var(--e-1) var(--e-2);background:var(--att-d);color:var(--att)}
/* le texte qui suit commence sous le tampon */
dialog.hubFiche:has(>#bulleChat) .ndTitre{margin-right:calc(var(--h-ctrl)*2 + var(--e-6))}
/* confirmation en ligne (annulation, refus) : phrase pleine largeur, champ souple, boutons */
.note.noteAct{display:flex;flex-wrap:wrap;align-items:center;gap:var(--e-2);margin:var(--e-3) 0 0}
.noteAct>.pleine{flex:1 0 100%}
.noteAct>.champ{flex:1 1 220px;width:auto}
.noteAct>span.champ{display:flex;flex-direction:column;gap:var(--e-1)}
/* date sans objet (fiche créée par erreur, compte désactivé par erreur) : grisée comme un champ en lecture seule */
.noteAct input:disabled{background:var(--surf2);color:var(--encre2);cursor:not-allowed}
.hubFiche .ndTitre{display:flex;align-items:center;gap:var(--e-2);flex-wrap:wrap;margin-right:var(--e-6)}
/* R7 : fiche salarié en lecture (ficheEditHtml). En-tête d'identité : le titre de la fenêtre passe en
     Spectral, initiales en carré arrondi. Plus de panneau gris : la fenêtre porte la fiche, les rubriques se
     séparent par un filet. Rubrique = <details> (titre + « Modifier ») suivi des valeurs en lecture, qui
     s'effacent quand les champs sont ouverts. */
.hubFiche .ndTitre{font:var(--g-fort) var(--t-xl)/var(--i-xl) var(--f-titre);letter-spacing:-.01em;gap:var(--e-2) var(--e-4)}
.hubFiche .ndTitre .avOrg{width:56px;height:56px;border-radius:var(--r-l);font:var(--g-fort) var(--t-l)/1 var(--f-titre)}
.hubFiche .ndTitre .sub{font:var(--g-normal) var(--t-m)/var(--i-m) var(--f-ui);letter-spacing:0;color:var(--encre2)}
