/* ===== Code couleur standard =====
   rouge=grave · orange=alerte · jaune=attention · vert=en bonne voie · bleu=ok */
:root{
  --rouge:#c0392b; --orange:#e67e22; --jaune:#f1c40f; --vert:#27ae60; --bleu:#2980b9;
  --rouge-bg:#fbeae7; --orange-bg:#fdf0e3; --jaune-bg:#fef9e0; --vert-bg:#e9f7ef; --bleu-bg:#e8f1f8;
  --vert-fonce:#2E5E3A; --vert-clair:#eaf3ec; --gris:#7a828a; --bord:#e4e7e4; --fond:#f3f5f3;
}
*{box-sizing:border-box}
body{margin:0;font-family:Arial,Helvetica,sans-serif;color:#243;background:var(--fond);font-size:13px;line-height:1.4}
a{color:var(--bleu);text-decoration:none}
a:hover{text-decoration:underline}

/* Barre du haut */
.topbar{display:flex;align-items:center;gap:14px;background:var(--vert-fonce);color:#fff;padding:6px 14px;flex-wrap:wrap}
.topbar .brand{font-weight:bold;font-size:15px;letter-spacing:.3px}
.topbar nav{display:flex;gap:6px;flex:1;flex-wrap:wrap}
.topbar nav a{color:#dCeadf;padding:4px 9px;border-radius:5px;font-size:12.5px}
.topbar nav a.actif,.topbar nav a:hover{background:rgba(255,255,255,.16);color:#fff;text-decoration:none}
.topbar .user{font-size:12px;color:#cfe0d4}
.topbar .user a{color:#fff}

.container{max-width:1200px;margin:0 auto;padding:0 14px 28px}

/* Fil d'Ariane + actions (Retour toujours en haut à droite) */
.barre-actions{display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 0;margin-bottom:10px;border-bottom:1px solid var(--bord);position:sticky;top:0;background:var(--fond);z-index:5;flex-wrap:wrap}
.fil{font-size:12.5px;color:var(--gris)}
.fil a{color:var(--vert-fonce);font-weight:bold}
.fil .sep{margin:0 5px;color:#bbb}
.actions{display:flex;gap:6px;align-items:center;flex-wrap:wrap}

/* Sous-navigation (onglets d'ancrage dans une fiche) */
.sousnav{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 14px}
.sousnav a{background:#fff;border:1px solid var(--bord);border-radius:14px;padding:4px 12px;font-size:12px;color:var(--vert-fonce)}
.sousnav a:hover{background:var(--vert-clair);text-decoration:none}

/* Accordéon (fiche personnel) */
details.acc{background:#fff;border:1px solid var(--bord);border-radius:7px;margin-bottom:10px;overflow:hidden}
details.acc>summary{cursor:pointer;padding:13px 16px;font-size:15px;font-weight:bold;color:#fff;list-style:none;user-select:none}
details.acc-a>summary{background:var(--vert-fonce)}
details.acc-b>summary{background:var(--vert)}
details.acc>summary:hover{filter:brightness(1.06)}
details.acc>summary::-webkit-details-marker{display:none}
details.acc>summary::before{content:'▸';color:#fff;display:inline-block;width:18px}
details.acc[open]>summary::before{content:'▾'}
details.acc>.acc-corps{padding:12px 14px}
details.acc>.acc-corps h2:first-child{margin-top:4px}

h1{color:var(--vert-fonce);font-size:18px;margin:6px 0 12px;display:flex;align-items:center;gap:8px;flex-wrap:wrap}
h2{color:var(--vert-fonce);font-size:14px;margin:18px 0 8px;padding-left:8px;border-left:4px solid var(--vert)}
.pied{text-align:center;color:var(--gris);font-size:11px;padding:18px}

/* Cartes / tuiles */
.grille{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px;margin-bottom:14px}
.tuile{background:#fff;border:1px solid var(--bord);border-left:5px solid var(--gris);border-radius:7px;padding:10px 12px}
.tuile .chiffre{font-size:24px;font-weight:bold;line-height:1.1}
.tuile .libelle{color:var(--gris);font-size:11.5px;margin-top:2px}
.tuile.rouge{border-left-color:var(--rouge);background:linear-gradient(0deg,#fff,var(--rouge-bg))} .tuile.rouge .chiffre{color:var(--rouge)}
.tuile.orange{border-left-color:var(--orange);background:linear-gradient(0deg,#fff,var(--orange-bg))} .tuile.orange .chiffre{color:var(--orange)}
.tuile.jaune{border-left-color:var(--jaune);background:linear-gradient(0deg,#fff,var(--jaune-bg))} .tuile.jaune .chiffre{color:#b8930b}
.tuile.vert{border-left-color:var(--vert);background:linear-gradient(0deg,#fff,var(--vert-bg))} .tuile.vert .chiffre{color:var(--vert)}
.tuile.bleu{border-left-color:var(--bleu);background:linear-gradient(0deg,#fff,var(--bleu-bg))} .tuile.bleu .chiffre{color:var(--bleu)}

.carte{background:#fff;border:1px solid var(--bord);border-radius:7px;padding:12px;margin-bottom:12px}
.encart{background:var(--vert-clair);border:1px solid #d3e4d7;border-radius:7px;padding:10px 12px;margin-bottom:14px;font-size:12.5px;color:#33503b}
.encart strong{color:var(--vert-fonce)}

/* Badges */
.badge{display:inline-block;padding:1px 8px;border-radius:11px;font-size:11px;font-weight:bold;border:1px solid transparent}
.badge-rouge{background:var(--rouge-bg);color:var(--rouge);border-color:var(--rouge)}
.badge-orange{background:var(--orange-bg);color:#a85b12;border-color:var(--orange)}
.badge-jaune{background:var(--jaune-bg);color:#b8930b;border-color:var(--jaune)}
.badge-vert{background:var(--vert-bg);color:var(--vert);border-color:var(--vert)}
.badge-bleu{background:var(--bleu-bg);color:var(--bleu);border-color:var(--bleu)}

/* Tableaux compacts */
table{width:100%;border-collapse:collapse;background:#fff;border:1px solid var(--bord);border-radius:7px;overflow:hidden;font-size:12.5px;margin-bottom:6px}
th,td{padding:5px 9px;text-align:left;border-bottom:1px solid var(--bord);vertical-align:middle}
th{background:var(--vert-clair);color:var(--vert-fonce);font-size:11.5px;text-transform:uppercase;letter-spacing:.3px}
tr:last-child td{border-bottom:none}
tbody tr:nth-child(even) td, table tr:nth-child(even) td{background:#fafbfa}

/* Barres (graphes sans dépendance) */
.barre-ligne{display:flex;align-items:center;gap:8px;margin:4px 0}
.barre-libelle{width:180px;font-size:12px}
.barre-piste{flex:1;background:#eee;border-radius:5px;overflow:hidden;height:16px}
.barre-remplissage{height:100%}
.b-rouge{background:var(--rouge)} .b-orange{background:var(--orange)} .b-jaune{background:var(--jaune)}
.b-vert{background:var(--vert)} .b-bleu{background:var(--bleu)}
.barre-valeur{width:34px;text-align:right;font-size:12px;color:var(--gris)}

/* Formulaires compacts */
label{display:block;margin:6px 0;font-size:12.5px}
input[type=text],input[type=password],input[type=date],input[type=email],input[type=number],select,textarea{
  width:100%;padding:6px;border:1px solid #ccd2cc;border-radius:5px;font-size:12.5px;font-family:inherit;margin-top:2px;background:#fff}
textarea{min-height:58px}
button,.bouton{background:var(--vert-fonce);color:#fff;border:none;padding:6px 13px;border-radius:5px;font-size:12.5px;cursor:pointer;display:inline-block}
button:hover,.bouton:hover{opacity:.92;text-decoration:none;color:#fff}
.bouton-clair{background:#fff;color:var(--vert-fonce);border:1px solid var(--vert-fonce)}
.bouton-clair:hover{color:var(--vert-fonce)}
.bouton-gris{background:#5f6b76;color:#fff;border:1px solid #4b555e}
.bouton-gris:hover{background:#4b555e;color:#fff}
.cases{display:flex;gap:14px;flex-wrap:wrap;margin-top:4px}
.cases label{display:flex;align-items:center;gap:5px;width:auto;margin:0}
.cases input{width:auto}
.erreur{background:var(--rouge-bg);color:var(--rouge);padding:7px 10px;border-radius:5px;margin-bottom:8px}
.ok{background:var(--vert-bg);color:var(--vert);padding:7px 10px;border-radius:5px;margin-bottom:8px}
.muet{color:var(--gris);font-size:12px}

/* Connexion */
.page-login{display:flex;align-items:center;justify-content:center;min-height:100vh;background:var(--vert-fonce)}
.carte-login{background:#fff;padding:26px;border-radius:9px;width:320px}
.carte-login h1{justify-content:center}

/* Impression */
@media print{
  .topbar,.pied,.no-print,.barre-actions,.sousnav{display:none !important}
  body{background:#fff}
  .container{margin:0;max-width:100%;padding:0}
  .carte{border:none;padding:0}
  th{background:#eee !important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
}
