/* Portail agents — styles SPÉCIFIQUES (tuiles, encarts, recherche, guides).
   La base (tokens, bandeau, cartes, boutons, formulaires, thème sombre) vient de
   socle/ui/charte.css. */
:root{
  /* Correspondances vers les tokens de la charte : les règles historiques
     (tuiles, encarts, guides) continuent de fonctionner sans être réécrites. */
  --bleu:var(--marque); --bleu-fonce:var(--marque-fonce);
  --bg:var(--fond); --carte:var(--surface); --bord:var(--ligne);
  --texte:var(--encre); --muted:var(--encre-douce); --rouge:var(--erreur);
  --radius:var(--r);   /* --ombre vient déjà de la charte : ne pas le redéfinir (référence circulaire) */
  --primary:var(--marque); --border:var(--ligne); --text:var(--encre);
}
/* Le portail exploite toute la largeur (grille de tuiles). */
.sc-main{max-width:1800px}
.tuile{text-decoration:none}
.tuile:hover{text-decoration:none}
.onglets{display:flex;flex-wrap:wrap;gap:.3rem;margin:0 0 1.2rem;align-items:center}
.onglets a{padding:.45rem .9rem;border-radius:var(--r-s);text-decoration:none;color:var(--encre-douce);font-size:.9rem}
.onglets a:hover{background:var(--marque-clair)}
.onglets a.actif{background:var(--marque);color:#fff;font-weight:600}
.onglets .select-entite{margin-left:auto;width:auto;font-size:.88rem;padding:.4rem .6rem}
/* Intranet — portail de tuiles */
  --bleu:#1d4ed8; --bleu-fonce:#1e3a8a; --bg:#f1f5f9; --carte:#fff; --bord:#e2e8f0;
  --texte:#1e293b; --muted:#64748b; --rouge:#dc2626; --radius:12px; --ombre:0 1px 3px rgba(0,0,0,.08);
}
a{color:var(--bleu);text-decoration:none}
a:hover{text-decoration:underline}
code{background:#e2e8f0;padding:.1em .4em;border-radius:4px;font-size:.9em}
h1,h2,h3{line-height:1.25}
.muted{color:var(--muted)} .petit{font-size:13px} .droite{text-align:right} .sans-marge{margin:0}
.vide{color:var(--muted);font-style:italic;padding:12px 0}
hr{border:none;border-top:1px solid var(--bord);margin:24px 0}

/* En-tête (couleur = entité courante) */
.entete-titre:hover{text-decoration:none}
.entete-titre strong{font-size:19px}
.entete-titre span{font-size:12px;opacity:.85}
.entete-nav a{color:#fff;opacity:.85;padding:6px 12px;border-radius:6px;font-size:14px}
.entete-nav a:hover{background:rgba(255,255,255,.15);opacity:1;text-decoration:none}
.entete-nav a.actif{background:rgba(255,255,255,.22);opacity:1;font-weight:600}
.entete-user span{opacity:.9}
.select-entite{width:auto;padding:5px 8px;border-radius:6px;border:1px solid rgba(255,255,255,.4);background:rgba(255,255,255,.12);color:#fff;font-size:13px}
.select-entite option{color:#1e293b}
.bouton.clair{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.5);color:#fff}
.bouton.clair:hover{background:rgba(255,255,255,.28)}

.contenu.contenu-large{max-width:1800px}

/* Accueil / tuiles */
.accueil-tete{margin-bottom:20px}
.accueil-tete h1{margin:0 0 4px;font-size:26px;color:var(--marque-texte)}
.cat-titre{font-size:16px;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;margin:26px 0 12px;border-bottom:1px solid var(--bord);padding-bottom:6px}
.grille-tuiles{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:14px}
.tuile{position:relative;background:var(--carte);border:1px solid var(--bord);border-left:5px solid var(--c,var(--bleu));border-radius:var(--radius);padding:18px;box-shadow:var(--ombre);display:flex;flex-direction:column;gap:6px;color:var(--texte);transition:transform .12s,box-shadow .12s}
.tuile:hover{text-decoration:none;transform:translateY(-2px);box-shadow:0 6px 18px rgba(0,0,0,.12)}
.tuile-icone{font-size:30px;line-height:1}
.tuile-titre{font-weight:700;font-size:16px}
.tuile-desc{font-size:13px;color:var(--muted)}

/* Sections (catégories) en boîtes côte à côte, remplissant la largeur.
   La largeur de chaque boîte découle de son nombre de tuiles : classes w1/w2/w3
   posées par index.php, puis bornées au nombre réel de colonnes par masonry.js,
   qui cale aussi les hauteurs (row-span) pour tasser les boîtes sans trou. */
.sections{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:18px;align-items:start;grid-auto-flow:row dense}
.sections.js-rows{grid-auto-rows:2px}
.cat-box{background:var(--carte);border:1px solid var(--bord);border-radius:var(--radius);box-shadow:var(--ombre);padding:14px 16px 18px;margin:0;grid-column:span 1}
.cat-box.w2{grid-column:span 2}
.cat-box.w3{grid-column:span 3}
@media(max-width:1100px){.cat-box.w3{grid-column:span 2}}
@media(max-width:660px){.sections{grid-template-columns:1fr}.cat-box.w2,.cat-box.w3{grid-column:span 1}}
.cat-box .cat-titre{margin:2px 0 12px}
.cat-box .grille-tuiles{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.tuile-cadenas{position:absolute;top:12px;right:12px;font-size:13px;opacity:.6}
.tuile-statut{align-self:flex-start;margin-top:7px;font-size:10.5px;font-weight:700;padding:3px 9px;border-radius:999px;letter-spacing:.01em}
.st-test{background:#fef9c3;color:#854d0e}
.st-bientot{background:#e0e7ff;color:#3730a3}
.tuile-inactive{opacity:.62;cursor:not-allowed;filter:grayscale(.35)}
.tuile-inactive:hover{transform:none;box-shadow:var(--ombre)}
.aide{display:block;font-size:11px;color:var(--muted);margin-top:3px;font-weight:400}

/* Cartes / colonnes */
.carte{background:var(--carte);border:1px solid var(--bord);border-radius:var(--radius);padding:18px 20px;box-shadow:var(--ombre);margin-bottom:20px}
.carte h2{margin-top:0;font-size:18px} .carte h3{font-size:15px;margin:16px 0 8px}
.deux-colonnes{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:start}
@media(max-width:860px){.deux-colonnes{grid-template-columns:1fr}}

/* Barre d'actions */
.barre-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:16px;flex-wrap:wrap}
.barre-actions>div{display:flex;gap:8px;flex-wrap:wrap}

/* Tableaux */
.tableau{width:100%;border-collapse:collapse}
.tableau th,.tableau td{text-align:left;padding:9px 10px;border-bottom:1px solid var(--bord)}
.tableau thead th{font-size:12px;text-transform:uppercase;letter-spacing:.03em;color:var(--muted)}
.tableau tbody tr:hover{background:#f8fafc}
tr.inactif{opacity:.55}
.actions-cell{text-align:right;white-space:nowrap}
.mini-icone{font-size:16px}

/* Boutons */
.bouton{display:inline-block;padding:8px 14px;border-radius:8px;border:1px solid var(--bord);background:#fff;color:var(--texte);cursor:pointer;font-size:14px;line-height:1.2}
.bouton:hover{background:#f1f5f9;text-decoration:none}
.bouton.primaire{background:var(--bleu);border-color:var(--bleu);color:#fff}
.bouton.primaire:hover{background:var(--bleu-fonce)}
.bouton.petit{padding:5px 10px;font-size:13px}
.bouton.bloc{width:100%;text-align:center}
.lien-danger{background:none;border:none;color:var(--rouge);cursor:pointer;font-size:14px;padding:0}
.lien-danger:hover{text-decoration:underline}

/* Formulaires */
input,select,textarea{font:inherit;padding:8px 10px;border:1px solid #cbd5e1;border-radius:8px;background:#fff;width:100%;color:var(--texte)}
input[type=color]{padding:2px;height:40px}
input:focus,select:focus,textarea:focus{outline:2px solid #bfdbfe;border-color:var(--bleu)}
label{display:block;margin-bottom:12px;font-size:14px;font-weight:500}
label input,label select,label textarea{margin-top:4px;font-weight:400}
.case{display:flex;align-items:center;gap:8px} .case input{width:auto;margin:0}
.formulaire{background:var(--carte);border:1px solid var(--bord);border-radius:var(--radius);padding:20px;box-shadow:var(--ombre)}
.grille-form{display:grid;grid-template-columns:1fr 1fr;gap:0 18px}
@media(max-width:640px){.grille-form{grid-template-columns:1fr}}
.form-boutons{display:flex;gap:10px;margin-top:8px}
.bloc-restreint{background:#f8fafc;border:1px dashed var(--bord);border-radius:10px;padding:12px 16px;margin:4px 0 12px}
.ligne-inline{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-bottom:6px}
.ligne-inline input{width:auto;flex:1;min-width:120px}
.ligne-inline select{width:auto}

/* Flash */
.flash{padding:11px 14px;border-radius:8px;margin-bottom:14px;font-size:14px}
.flash-ok{background:#dcfce7;color:#166534}
.flash-erreur{background:#fee2e2;color:#991b1b}
.flash-info,.info{background:#dbeafe;color:#1e40af;padding:10px 12px;border-radius:8px;font-size:14px}

/* Tri glisser-déposer */
.poignee{cursor:grab;color:var(--muted);font-size:18px;text-align:center;width:34px;user-select:none}
.poignee:active{cursor:grabbing}
.sortable-ghost{opacity:.4;background:#eff6ff}
.sortable-chosen{background:#eff6ff}

/* Liste de cases (entités) */
.liste-cases{display:flex;flex-wrap:wrap;gap:8px 18px;margin-top:6px}
.liste-cases .case{margin:0}
fieldset.bloc-restreint{border:1px dashed var(--bord);border-radius:10px;padding:10px 14px;margin:4px 0 12px}
fieldset.bloc-restreint legend{font-weight:600;padding:0 6px;font-size:14px}

/* Sélecteur d'icônes */
.choix-icones{display:flex;flex-wrap:wrap;gap:6px;margin:-6px 0 14px}
.ico-btn{width:40px;height:40px;font-size:20px;padding:0;border:1px solid var(--bord);border-radius:8px;background:#fff;cursor:pointer}
.ico-btn:hover{background:#eff6ff;border-color:var(--bleu)}
/* Divers admin */
.deux-colonnes.inverse{grid-template-columns:2fr 1fr}
@media(max-width:860px){.deux-colonnes.inverse{grid-template-columns:1fr}}
.form-laterale label{margin-bottom:10px}
.form-supprimer{margin-top:14px;padding-top:12px;border-top:1px solid var(--bord)}
.pastille{display:inline-block;width:12px;height:12px;border-radius:50%;vertical-align:middle;border:1px solid rgba(0,0,0,.15)}

/* Connexion */
.page-login{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--ent,var(--marque))}
.login-carte{background:var(--surface);border-radius:14px;padding:32px;width:100%;max-width:380px;box-shadow:0 10px 40px rgba(0,0,0,.25)}
.login-carte h1{margin:0 0 4px;font-size:22px;color:var(--marque)}
.login-carte .bouton,.login-carte button[type=submit]{width:100%;margin-top:14px}
.login-sous{margin:0 0 18px;color:var(--muted);font-size:14px}
.login-aide{margin-top:16px;font-size:13px;color:var(--muted)}
.login-retour{margin-top:14px;font-size:13px;text-align:center}

/* Résultats de recherche annuaire (écran des droits, édition de tuile) */
.ad-res{display:flex;flex-direction:column;gap:2px;max-height:210px;overflow-y:auto;margin-top:4px}
.ad-item{text-align:left;background:var(--surface);border:1px solid var(--ligne);border-radius:var(--r-s);
  padding:.35rem .6rem;font-size:.85rem;cursor:pointer;color:var(--encre)}
.ad-item:hover{background:var(--marque-clair);border-color:var(--marque)}
.ad-err{color:var(--erreur);font-size:.82rem;padding:.3rem 0}

/* Bandeau historique (classes .entete*) — restauré : la migration socle les avait
   retirées alors que ce template les utilise encore (header cassé sinon). */
.entete{background:var(--ent,var(--bleu-fonce,#123c5a));color:#fff}
.entete-inner{max-width:1800px;margin:0 auto;padding:12px 32px;display:flex;align-items:center;gap:20px;flex-wrap:wrap}
.entete-titre{color:#fff;display:flex;align-items:center;gap:12px;line-height:1.1}
.entete-logo{height:38px;width:auto;background:#fff;border-radius:6px;padding:3px}
.entete-textes{display:flex;flex-direction:column}
.entete-titre strong{font-size:19px}
.entete-titre span{font-size:12px;opacity:.85}
.entete-nav{display:flex;gap:4px;flex:1;flex-wrap:wrap}
.entete-user{font-size:13px;color:#fff;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.contenu{max-width:1200px;margin:0 auto;padding:24px 32px 60px}
.pied{text-align:center;color:var(--muted);font-size:13px;padding:24px}
