/* Pilotage financier — feuille de style */
:root{
  --ink:#1c2b36;        /* texte */
  --muted:#5f7280;
  --line:#dde3e7;
  --bg:#f3f5f6;
  --paper:#ffffff;
  --nav:#17324a;        /* bleu pétrole */
  --nav-ink:#c9d7e2;
  --accent:#1f6f8b;     /* actions */
  --pos:#23744f; --neg:#b3261e; --warn:#a76a00;
  --pos-bg:#e7f3ec; --neg-bg:#fbeceb; --warn-bg:#fdf3df;
  --radius:6px;
}
*{box-sizing:border-box}
html,body{margin:0}
body{font:14px/1.45 "Segoe UI",system-ui,-apple-system,Roboto,Arial,sans-serif;color:var(--ink);background:var(--bg);display:flex;min-height:100vh}
a{color:var(--accent)}
nav{width:232px;flex:none;background:var(--nav);color:var(--nav-ink);padding:18px 0;position:sticky;top:0;height:100vh;overflow-y:auto}
nav .brand{display:block;color:#fff;font-weight:700;font-size:16px;padding:0 20px 14px;text-decoration:none;letter-spacing:.2px}
nav .group{font-size:12px;color:#7f9bb1;padding:14px 20px 4px}
nav a.item{display:block;color:var(--nav-ink);text-decoration:none;padding:6px 20px;border-left:3px solid transparent}
nav a.item:hover{background:rgba(255,255,255,.06);color:#fff}
nav a.item.on{border-left-color:#6fc2dc;color:#fff;background:rgba(255,255,255,.08)}
nav .foot{margin-top:16px;border-top:1px solid rgba(255,255,255,.1);padding-top:8px}
main{flex:1;min-width:0;padding:26px 32px 60px;max-width:1500px}
h1{font-size:24px;margin:0 0 6px;font-weight:650}
h2{font-size:17px;margin:28px 0 10px;font-weight:650}
.muted{color:var(--muted)}
.topline{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:10px}
.topline form{display:flex;gap:8px;align-items:center}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:16px 18px;margin:14px 0}
.panel>h2:first-child{margin-top:0}
details.panel>summary{cursor:pointer;font-weight:650;font-size:15px}
details.panel[open]>summary{margin-bottom:12px}

/* formulaires */
input,select,button{font:inherit}
input,select{border:1px solid #c6d0d6;border-radius:4px;padding:6px 8px;background:#fff;color:var(--ink);min-width:0}
input:focus,select:focus,button:focus-visible{outline:2px solid #6fc2dc;outline-offset:1px}
button,.btn{background:var(--accent);color:#fff;border:0;border-radius:4px;padding:7px 14px;cursor:pointer;text-decoration:none;display:inline-block;white-space:nowrap}
button:hover,.btn:hover{filter:brightness(1.08)}
button.ghost,.btn.ghost{background:transparent;color:var(--accent);border:1px solid #b9cbd4}
button.danger{background:transparent;color:var(--neg);border:1px solid #e3b6b2;padding:4px 9px}
button.danger:hover{background:var(--neg-bg)}
button.small,.btn.small{padding:4px 10px;font-size:13px}
.formgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px 14px;align-items:end}
.formgrid label{display:flex;flex-direction:column;gap:3px;font-size:12.5px;color:var(--muted)}
.formgrid label.check{flex-direction:row;align-items:center;gap:6px;color:var(--ink);font-size:14px;padding-bottom:6px}
.formgrid .wide{grid-column:1/-1}
.formgrid .actions{grid-column:1/-1;display:flex;gap:10px;align-items:center}
.formgrid fieldset{grid-column:1/-1;border:1px solid var(--line);border-radius:var(--radius);padding:10px 12px 12px;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:10px 14px;margin:4px 0}
.formgrid legend{font-size:13px;font-weight:600;padding:0 4px}
form.inline{display:inline-flex;gap:6px;align-items:center;margin:0}
.filters{display:flex;gap:10px;align-items:end;flex-wrap:wrap;margin:8px 0 4px}
.filters label{display:flex;flex-direction:column;font-size:12.5px;color:var(--muted);gap:3px}
input.mini{width:82px;text-align:right;padding:5px 6px}
table.grid td,table.grid th{padding:6px 6px}
table.grid td:first-child{white-space:nowrap}
input[type=number]{text-align:right}

/* tableaux */
.tablewrap{overflow-x:auto;background:var(--paper);border:1px solid var(--line);border-radius:var(--radius)}
table{border-collapse:collapse;width:100%}
th,td{padding:7px 10px;border-bottom:1px solid var(--line);text-align:left;vertical-align:middle}
th{background:#eef2f4;font-weight:600;font-size:12.5px;color:#3a4d5a;white-space:nowrap;position:sticky;top:0}
tr:last-child td{border-bottom:0}
tbody tr:hover td{background:#f8fafb}
td.n,th.n{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}
td.actions{white-space:nowrap}
td.actions>*{margin-right:4px}
tr.total td{font-weight:650;background:#f3f6f7;border-top:2px solid var(--line)}
tr.inactive td{color:#96a3ab}
.pos{color:var(--pos)} .neg{color:var(--neg)}
.empty{padding:18px;color:var(--muted);text-align:center}

/* badges & échéances */
.badge{display:inline-block;padding:1px 8px;border-radius:10px;font-size:12px;background:#e9eef1;color:#40525e}
.badge.ok{background:var(--pos-bg);color:var(--pos)}
.badge.warn{background:var(--warn-bg);color:var(--warn)}
.badge.bad{background:var(--neg-bg);color:var(--neg)}
td.late,span.late{color:var(--neg);font-weight:600}
td.soon,span.soon{color:var(--warn);font-weight:600}

/* messages */
.flash{padding:10px 14px;border-radius:var(--radius);margin:0 0 12px;border:1px solid}
.flash.success{background:var(--pos-bg);border-color:#b9dcc7;color:#1b5a3d}
.flash.error,.flash.danger{background:var(--neg-bg);border-color:#ecc3bf;color:#8a1f18}
.flash.info{background:#e8f2f6;border-color:#bcd8e3;color:#1b4f63}

/* tableau de bord */
.kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:12px;margin:16px 0}
.kpi{background:var(--paper);border:1px solid var(--line);border-radius:var(--radius);padding:14px 16px}
.kpi .label{font-size:13px;color:var(--muted)}
.kpi .value{font-size:24px;font-weight:650;font-variant-numeric:tabular-nums;margin-top:2px}
.kpi.result{border-left:4px solid var(--accent)}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(340px,1fr));gap:16px}
.alerts li{margin:4px 0}
.alerts{padding-left:18px;margin:6px 0}

/* connexion */
body.login{justify-content:center;align-items:center;background:var(--nav)}
.loginbox{background:#fff;border-radius:8px;padding:28px 30px;width:340px}
.loginbox h1{margin-bottom:16px}
.loginbox label{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;font-size:13px;color:var(--muted)}
.loginbox button{width:100%;padding:9px}

@media (max-width:860px){
  body{display:block}
  nav{width:auto;height:auto;position:static;display:flex;flex-wrap:wrap;padding:8px}
  nav .group,nav .foot{display:none}
  nav a.item{padding:4px 10px;border-left:0}
  main{padding:16px}
}
@media print{nav,.noprint,form button{display:none!important} main{padding:0} body{background:#fff}}
nav .ico{display:inline-block;width:24px;text-align:center;margin-right:6px}
input.suggested{color:#8a6d1f;background:#fffaf0;border-style:dashed}
.treso{background:var(--paper);border:1px solid var(--line);border-left:4px solid var(--accent);border-radius:var(--radius);padding:14px 18px;margin:14px 0}
.treso .big{font-size:26px;font-weight:650;font-variant-numeric:tabular-nums}
.treso summary{cursor:pointer;list-style:none;display:flex;justify-content:space-between;align-items:center;gap:12px}
.treso summary::-webkit-details-marker{display:none}
.treso .toggle{display:inline-block;width:22px;height:22px;line-height:20px;text-align:center;border:1px solid #b9cbd4;border-radius:4px;color:var(--accent);font-weight:700;margin-right:8px}
.treso details[open]>summary .toggle.plus{display:none}
.treso details:not([open])>summary .toggle.minus{display:none}
.treso .co{margin:8px 0 0 30px}
.treso .co summary{justify-content:flex-start;font-weight:600;padding:4px 0}
.treso .co summary .amt{margin-left:auto;font-variant-numeric:tabular-nums}
.treso .acc{display:flex;justify-content:space-between;padding:3px 0 3px 30px;color:#3a4d5a;border-bottom:1px dotted var(--line);max-width:560px}
.treso .acc span:last-child{font-variant-numeric:tabular-nums}
.treso .co{max-width:560px}
tr.proposed input,tr.proposed select{border-style:dashed;background:#fffaf0}
details.lines summary{cursor:pointer}
details.lines .sub{display:flex;justify-content:space-between;gap:16px;font-size:13px;padding:2px 0 2px 14px;color:#3a4d5a}
details.lines .sub span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
table.grid select{max-width:165px}

.csv-example{overflow:auto;background:#f6f8f9;border:1px solid var(--line);padding:12px;border-radius:4px;font:12px/1.5 Consolas,monospace;white-space:pre-wrap}

.csv-example{overflow:auto;background:#f6f8f9;border:1px solid var(--line);padding:12px;border-radius:4px;font:12px/1.5 Consolas,monospace;white-space:pre-wrap}
