/* staff.css — styles de l'espace staff (dashboard, fiche, connexion).
   Chargé après site.css, dont il réutilise les variables de charte (--violet…).
   Extrait le 01/09/2026 des <style> inline des 3 gabarits (aucun changement
   visuel voulu). Classes déjà préfixées .staff- / .fiche- / .bloc… → pas de
   collision avec les pages publiques. */

/* --- base commune ------------------------------------------------------- */
body{
  background:var(--violet-tint);
  padding:32px 20px;
  font-family:'Montserrat',sans-serif;
  color:var(--ink);
}
body.page-connexion{
  display:flex; align-items:center; justify-content:center; min-height:100vh;
}

/* --- bandeau de session (dashboard + fiche) --------------------------- */
.staff-session{display:flex; align-items:center; gap:14px; flex-wrap:wrap; font-size:13px;}
.staff-session-user{color:var(--ink-soft);}
.staff-session-link{color:var(--violet); font-weight:600; text-decoration:none;}
.staff-session-link:hover{text-decoration:underline;}
.staff-session form{margin:0;}
.staff-logout{
  color:var(--violet); font-weight:600; font-size:13px; font-family:inherit; cursor:pointer;
  border:1px solid var(--violet-line); border-radius:999px; padding:7px 14px; background:var(--white);
}
.staff-logout:hover{background:var(--violet-tint-2);}

/* --- messages + badges (partagés) ----------------------------------- */
.messages{background:#dff3d8; color:var(--green-dark); font-weight:600; font-size:14px; padding:10px 14px; border-radius:var(--radius-sm); margin-bottom:18px;}

.badge{display:inline-block; padding:4px 11px; border-radius:999px; font-size:15px; font-weight:700; white-space:nowrap;}
.badge-a_traiter{background:#fdecc8; color:#7a5b00;}
.badge-ok{background:#dff3d8; color:var(--green-dark);}
.badge-a_verifier{background:#fbdada; color:#b3261e;}
.badge-archive{background:#e9e4ee; color:#5b4a68;}

/* ====================================================================
   Dashboard
   ==================================================================== */
.staff-wrap{max-width:1120px; margin:0 auto;}
.retour-site{display:inline-block; margin-bottom:12px; font-size:13px; font-weight:600; color:var(--violet); text-decoration:none;}
.retour-site:hover{text-decoration:underline;}
.staff-header{display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap; margin-bottom:8px;}
.staff-header h1{color:var(--violet-dark); font-size:22px; margin:0;}
.staff-intro{color:var(--ink-soft); font-size:13px; margin:0 0 8px;}
.staff-liens{display:flex; flex-wrap:wrap; align-items:center; gap:8px 16px; margin:0 0 18px;}
.staff-liens-groupe{display:flex; flex-wrap:wrap; align-items:center; gap:8px;}
.lien-bouton{
  display:inline-block; text-decoration:none; white-space:nowrap;
  font-size:12px; font-weight:600; color:var(--violet-dark);
  border:1px solid var(--violet-line); border-radius:999px;
  padding:6px 14px; background:var(--white);
}
.lien-bouton:hover{background:var(--violet-tint-2);}

.recherche{display:flex; gap:8px; margin-bottom:18px; flex-wrap:wrap;}
.recherche input[type=search]{
  flex:1; min-width:220px; font-family:inherit; font-size:14px; padding:9px 13px;
  border:1px solid var(--violet-line); border-radius:999px; background:var(--white);
}
.recherche button{
  font-family:inherit; font-size:13px; font-weight:600; padding:9px 16px; border-radius:999px;
  border:1px solid var(--violet); background:var(--violet); color:#fff; cursor:pointer;
}
.recherche a.reset{align-self:center; font-size:12px; color:var(--ink-soft);}

.onglets{display:flex; flex-wrap:wrap; gap:6px; margin-bottom:14px;}
.onglets a{
  text-decoration:none; font-size:13px; font-weight:600; padding:8px 14px; border-radius:var(--radius-sm) var(--radius-sm) 0 0;
  color:var(--violet-dark); background:var(--white); border:1px solid var(--violet-line); border-bottom:none;
}
.onglets a.actif{background:var(--violet); color:#fff; border-color:var(--violet);}
.onglets .compteur{
  display:inline-block; margin-left:6px; min-width:18px; text-align:center; font-size:11px;
  background:#fdecc8; color:#7a5b00; border-radius:999px; padding:1px 6px;
}
.onglets a.actif .compteur{background:rgba(255,255,255,.25); color:#fff;}

.pilules{display:flex; flex-wrap:wrap; gap:8px; margin-bottom:22px;}
.pilules a{
  text-decoration:none; font-size:12.5px; font-weight:600; padding:6px 13px; border-radius:999px;
  border:1px solid var(--violet-line); color:var(--violet-dark); background:var(--white);
}
.pilules a.actif{background:var(--violet-dark); color:#fff; border-color:var(--violet-dark);}
.pilules .compteur{
  display:inline-block; margin-left:5px; min-width:16px; text-align:center; font-size:11px;
  background:var(--violet-tint-2); color:var(--violet-dark); border-radius:999px; padding:0 5px;
}
.pilules a.actif .compteur{background:rgba(255,255,255,.25); color:#fff;}
.pilules-axe{margin-top:-14px;}
.pilules-axe a{font-size:11.5px; padding:5px 12px; border-style:dashed;}
.pilules-axe a.actif{border-style:solid;}

.invite{
  background:var(--white); border-radius:var(--radius-md); box-shadow:var(--shadow-sm);
  padding:40px 24px; text-align:center; color:var(--ink-soft); font-size:14px;
}

.staff-section{margin-bottom:36px;}
.staff-section-head{display:flex; align-items:baseline; justify-content:space-between; gap:12px; flex-wrap:wrap; margin:0 0 12px;}
.staff-section h2{color:var(--violet-dark); font-size:16px; margin:0;}
.staff-section h2 .count{color:var(--ink-soft); font-weight:400;}
.export-lien{
  font-size:12px; font-weight:600; text-decoration:none; white-space:nowrap;
  color:var(--violet-dark); border:1px solid var(--violet-line);
  border-radius:999px; padding:5px 12px; background:var(--white);
}
.export-lien:hover{background:var(--violet-tint-2);}

.staff-desktop{overflow-x:auto; border-radius:var(--radius-md); box-shadow:var(--shadow-sm);}
table{width:100%; min-width:760px; border-collapse:collapse; background:var(--white);}
th, td{text-align:left; padding:11px 14px; font-size:13px; border-bottom:1px solid var(--violet-line); vertical-align:middle;}
th{background:var(--violet-tint-2); color:var(--violet-dark); position:sticky; top:0; font-weight:700;}
tr:last-child td{border-bottom:none;}
tbody tr:hover{background:var(--violet-tint);}
td .sub{color:var(--ink-soft); font-size:12px;}
.nom{font-weight:700; color:var(--violet-dark);}
.coche{font-size:28px; line-height:1; color:var(--green); text-align:center; padding:0;}
.coche.non{color:#c9bcd2;}
.coche form{display:block; height:100%;}
.coche-bouton{
  display:flex; align-items:center; justify-content:center;
  width:100%; height:100%; min-height:48px; box-sizing:border-box;
  background:none; border:none; padding:11px 14px; margin:0; font:inherit; color:inherit;
  cursor:pointer; line-height:1;
}
.coche-bouton:hover, .coche-bouton:focus-visible{opacity:.65; background:rgba(0,0,0,.04);}
.actions-groupe{display:flex; flex-direction:column; gap:6px; align-items:flex-start;}
.ouvrir{
  display:inline-block; text-decoration:none; white-space:nowrap;
  background:var(--violet); color:#fff; font-weight:700; font-size:12px;
  padding:7px 13px; border-radius:999px;
}
.ouvrir-secondaire{
  background:var(--white); color:var(--violet-dark); font-weight:600;
  border:1px solid var(--violet-line);
}

.pagination{display:flex; align-items:center; gap:12px; margin-top:12px; font-size:13px; color:var(--ink-soft);}
.pagination a{
  text-decoration:none; font-weight:600; color:var(--violet-dark);
  border:1px solid var(--violet-line); border-radius:999px; padding:6px 13px; background:var(--white);
}

.staff-cards{display:none;}
@media (max-width:720px){
  body{padding:20px 14px;}
  .staff-desktop{display:none;}
  .staff-cards{display:flex; flex-direction:column; gap:12px;}
}
.staff-card{background:var(--white); border-radius:var(--radius-md); box-shadow:var(--shadow-sm); padding:16px;}
.staff-card-meta{font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em; color:var(--ink-faint);}
.staff-card-nom{font-size:16px; font-weight:700; color:var(--violet-dark); margin:2px 0 1px;}
.staff-card-formule{font-size:13px; color:var(--ink-soft);}
.staff-card-badges{display:flex; flex-wrap:wrap; gap:6px; margin:12px 0;}
.staff-card-badges form{display:contents;}
.badge-bouton{border:none; cursor:pointer;}
.badge-bouton:hover, .badge-bouton:focus-visible{opacity:.8;}
.staff-card-cta{
  display:block; text-align:center; text-decoration:none;
  background:var(--violet); color:#fff; font-weight:700; font-size:13px;
  padding:11px; border-radius:var(--radius-sm);
}

/* ====================================================================
   Fiche de traitement
   ==================================================================== */
.fiche{max-width:720px; margin:0 auto;}
.fiche-topbar{display:flex; align-items:center; justify-content:space-between; gap:14px; flex-wrap:wrap; margin-bottom:6px;}
.fiche-back{color:var(--violet); font-weight:600; text-decoration:none; font-size:13px;}
.fiche-back:hover{text-decoration:underline;}
.fiche-head{display:flex; align-items:center; gap:12px; flex-wrap:wrap; margin:14px 0 4px;}
.fiche-head h1{font-size:22px; color:var(--violet-dark); margin:0;}
.fiche-type{color:var(--ink-soft); font-size:13px; margin:0 0 22px;}

.bloc{background:var(--white); border-radius:var(--radius-md); box-shadow:var(--shadow-sm); padding:20px 22px; margin-bottom:16px;}
.bloc h2{font-size:13px; text-transform:uppercase; letter-spacing:0.05em; color:var(--ink-faint); margin:0 0 16px;}
.grille{display:grid; grid-template-columns:1fr 1fr; gap:14px 18px;}
.grille .plein{grid-column:1 / -1;}
@media (max-width:520px){ .grille{grid-template-columns:1fr;} }

.champ label{display:block; font-size:12px; font-weight:600; color:var(--ink-soft); margin-bottom:4px;}
.champ input, .champ select, .champ textarea{
  width:100%; font-family:inherit; font-size:14px; padding:8px 10px;
  border:1px solid var(--violet-line); border-radius:var(--radius-sm); background:#fff; color:var(--ink);
}
.champ .aide, .case .aide{display:block; font-weight:400; font-size:11.5px; color:var(--ink-soft); margin-top:3px;}
.champ.en-erreur input, .champ.en-erreur select, .champ.en-erreur textarea, .case.en-erreur{border-color:#b3261e;}
.erreurs{display:block; color:#b3261e; font-size:12.5px; font-weight:600; margin-top:4px;}

.case{display:flex; gap:10px; align-items:flex-start; padding:9px 0; border-bottom:1px solid var(--violet-line);}
.case:last-of-type{border-bottom:none;}
.case input[type=checkbox]{margin-top:2px; width:17px; height:17px; flex:none;}
.case label{font-size:14px; font-weight:600; color:var(--violet-dark);}

/* Cases « à part » de la fiche traitement : forcer OK / signaler à vérifier.
   Encadré ambré = ce ne sont pas des étapes normales du dossier. */
.cases-speciales{
  margin-top:14px; padding:2px 14px 8px;
  background:#fdf6e8; border:1px solid #f0dfb8; border-radius:var(--radius-sm);
}
.cases-speciales-titre{
  font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:0.04em;
  color:#7a5b00; margin:10px 0 0;
}
.cases-speciales .case{border-bottom-color:#f0dfb8;}
.cases-speciales .case:last-of-type{border-bottom:none;}
.cases-speciales .case label{color:#7a5b00;}

.lecture{font-size:14px; font-weight:600; color:var(--violet-dark);}
.lecture .k{display:block; font-size:12px; font-weight:600; color:var(--ink-soft); margin-bottom:2px;}
ul.jours{list-style:none; margin:0; padding:0; display:flex; flex-wrap:wrap; gap:10px;}
ul.jours li{display:flex; align-items:center; gap:5px; font-size:14px;}

.meta{font-size:12px; color:var(--ink-soft); margin:14px 0 0;}
.fiche-actions{display:flex; gap:10px; flex-wrap:wrap; margin-top:20px;}
.actions-page{display:flex; gap:10px; flex-wrap:wrap; margin:14px 0;}
.btn-primaire{background:var(--violet); color:#fff; border:none; border-radius:999px; padding:11px 22px; font-family:inherit; font-size:14px; font-weight:700; cursor:pointer; display:inline-block; text-decoration:none;}
.btn-secondaire{background:#fff; color:var(--violet-dark); border:1px solid var(--violet-line); border-radius:999px; padding:11px 22px; font-family:inherit; font-size:14px; font-weight:600; text-decoration:none; display:inline-block;}

/* ====================================================================
   Connexion
   ==================================================================== */
.staff-login{background:var(--white); border-radius:var(--radius-lg); box-shadow:var(--shadow); padding:40px; width:100%; max-width:360px;}
.staff-login h1{font-size:20px; margin:0 0 24px; color:var(--violet-dark);}
.staff-login label{display:block; font-weight:600; margin:14px 0 6px; font-size:14px;}
.staff-login input{width:100%; padding:10px 12px; border:1px solid var(--violet-line); border-radius:var(--radius-sm); font:inherit;}
.staff-login button{margin-top:22px; width:100%; padding:12px; border:none; border-radius:var(--radius-sm); background:var(--violet); color:#fff; font-weight:700; cursor:pointer;}
.staff-login .erreur{color:#b3261e; font-size:14px; margin-top:12px;}
.staff-login .note{color:var(--ink-soft); font-size:12.5px; margin-top:20px; line-height:1.5;}
.staff-login .note a{color:var(--violet); font-weight:600;}
