:root{
  --sidebar:#015326; --sidebar-2:#014420; --sidebar-ink:#eaf4ee; --sidebar-muted:#9fc4b0;
  --surface:#ffffff; --surface-2:#f8faf9; --bg:#f2f5f4; --border:#e6ebe8;
  --text:#0f1b16; --muted:#5f7268; --row-hover:#f4faf6;
  --brand1:#0a7c46; --brand2:#12a05a; --brand-ink:#0a7c46; --ring:rgba(10,124,70,.30);
  --shadow:0 1px 2px rgba(16,24,40,.04), 0 12px 30px -14px rgba(16,24,40,.16);
}
[data-bs-theme="dark"]{
  --surface:#121a17; --surface-2:#0f1613; --bg:#0b110e; --border:#20302a;
  --text:#e6efe9; --muted:#8fa89a; --row-hover:#15211c; --brand-ink:#3ecb83;
  --shadow:0 1px 2px rgba(0,0,0,.3), 0 14px 34px -16px rgba(0,0,0,.6);
}
*{ -webkit-font-smoothing:antialiased }
body{ background:var(--bg); color:var(--text); font-family:'Inter',system-ui,-apple-system,"Segoe UI",Roboto,sans-serif; letter-spacing:-.01em }
a{ text-decoration:none }

/* Layout shell */
.app{ display:flex; min-height:100vh }
.sidebar{ width:220px; flex:0 0 220px; background:var(--sidebar); color:var(--sidebar-ink);
  display:flex; flex-direction:column; position:sticky; top:0; height:100vh }
.sidebar .brand{ display:flex; align-items:center; gap:.6rem; padding:1rem 1.1rem; }
.sidebar .brand img{ width:50px; height:50px; border-radius:9px; object-fit:contain; padding: 5px; }
.sidebar .brand .badge-name{ background:#ffffff1a; color:#fff; font-weight:700; font-size:.74rem; letter-spacing:.02em;
  padding:.35rem .6rem; border-radius:8px; border:1px solid #ffffff26 }
.sidebar .nav-section{ color:var(--sidebar-muted); font-size:.66rem; text-transform:uppercase; letter-spacing:.08em;
  font-weight:700; padding:1rem 1.2rem .35rem }
.sidebar a.nav-link{ display:flex; align-items:center; gap:.7rem; color:var(--sidebar-ink); opacity:.85;
  padding:.55rem 1.1rem; margin:.1rem .5rem; border-radius:9px; font-size:.9rem; font-weight:500 }
.sidebar a.nav-link:hover{ background:#ffffff14; opacity:1 }
.sidebar a.nav-link.active{ background:#ffffff26; opacity:1; font-weight:600 }
.sidebar a.nav-link i{ font-size:1.05rem; width:1.2rem; text-align:center }
.sidebar .side-foot{ margin-top:auto; padding:.8rem; border-top:1px solid #ffffff1f }
.sidebar .user{ display:flex; align-items:center; gap:.6rem; padding:.4rem .5rem; border-radius:9px }
.sidebar .user:hover{ background:#ffffff14 }
.sidebar .avatar{ width:34px;height:34px;border-radius:50%;background:#ffffff26;display:grid;place-items:center;font-weight:700;font-size:.8rem;color:#fff }
.sidebar .user small{ color:var(--sidebar-muted) }

.main{ flex:1 1 auto; min-width:0; display:flex; flex-direction:column }
.topbar{ background:color-mix(in srgb,var(--surface) 82%, transparent); backdrop-filter:saturate(160%) blur(12px);
  border-bottom:1px solid var(--border); padding:.7rem 1.3rem; position:sticky; top:0; z-index:20;
  display:flex; align-items:center; gap:1rem }
.topbar .crumb{ font-size:.72rem; color:var(--muted); text-transform:uppercase; letter-spacing:.06em; font-weight:700 }
.topbar h1{ font-size:1.15rem; font-weight:800; margin:0; letter-spacing:-.02em }
.content{ padding:1.4rem 1.3rem 2.5rem }

/* Composants */
.card{ border:1px solid var(--border); border-radius:16px; background:var(--surface) }
.shadow-soft{ box-shadow:var(--shadow) }
.btn{ border-radius:11px; font-weight:600 }
.btn-brand{ background:linear-gradient(135deg,var(--brand1),var(--brand2)); border:0; color:#fff; box-shadow:0 8px 18px -8px var(--ring) }
.btn-brand:hover{ color:#fff; filter:brightness(1.06) }
.btn-soft{ background:color-mix(in srgb,var(--brand1) 10%, transparent); color:var(--brand-ink); border:1px solid color-mix(in srgb,var(--brand1) 22%, transparent) }
.btn-soft:hover{ background:color-mix(in srgb,var(--brand1) 16%, transparent); color:var(--brand-ink) }
.btn-icon{ width:38px;height:38px;display:inline-grid;place-items:center;padding:0 }
.form-control,.form-select{ border-radius:11px; border-color:var(--border) }
.form-control:focus,.form-select:focus{ border-color:var(--brand1); box-shadow:0 0 0 .2rem var(--ring) }
.form-label{ font-size:.72rem;text-transform:uppercase;letter-spacing:.04em;color:var(--muted);font-weight:600;margin-bottom:.28rem }
.form-switch .form-check-input:checked{ background-color:var(--brand1); border-color:var(--brand1) }

/* Account switcher */
.acct-switch .dropdown-toggle{ display:flex;align-items:center;gap:.6rem;background:var(--surface);border:1px solid var(--border);
  border-radius:11px;padding:.4rem .7rem;color:var(--text);font-weight:600 }
.acct-switch .dropdown-toggle::after{ margin-left:.4rem }
.acct-dot{ width:9px;height:9px;border-radius:50%;background:var(--brand1) }

/* Login */
.login-wrap{ min-height:100vh; display:grid; place-items:center; padding:1.5rem;
  background:radial-gradient(1200px 500px at 50% -10%, #01532633, transparent), var(--bg) }
.login-card{ width:100%; max-width:400px }
.login-logo{ width:56px;height:56px;border-radius:14px;background:var(--sidebar);display:grid;place-items:center;color:#fff;font-size:1.6rem;margin:0 auto 1rem }

@media (max-width: 820px){
  .sidebar{ position:fixed; left:-260px; z-index:1050; transition:left .2s }
  .sidebar.open{ left:0 }
  .app.has-mobile .main{ width:100% }
}
::-webkit-scrollbar{ height:10px;width:10px } ::-webkit-scrollbar-thumb{ background:var(--border);border-radius:10px }

/* helper */
.min-w-0{min-width:0}

/* ===== Module Enrichissement : tableau & composants ===== */
.hint{ font-size:.78rem;color:var(--muted) }
.cell-empty{ color:var(--muted);opacity:.6 }
.stat .card-body{ padding:.9rem 1.1rem }
.stat-ic{ width:44px;height:44px;border-radius:13px;display:grid;place-items:center;font-size:1.2rem;flex:0 0 auto }
.stat-num{ font-size:1.6rem;font-weight:800;line-height:1 }
.stat-lbl{ font-size:.7rem;color:var(--muted);text-transform:uppercase;letter-spacing:.04em;font-weight:600;margin-top:3px }
.ic-secondary{ background:rgba(100,116,139,.14);color:#64748b } .ic-success{ background:rgba(16,185,129,.14);color:#10b981 }
.ic-warning{ background:rgba(245,158,11,.16);color:#f59e0b } .ic-danger{ background:rgba(239,68,68,.14);color:#ef4444 }
.ic-brand{ background:color-mix(in srgb,var(--brand1) 16%,transparent);color:var(--brand-ink) }

.tbl-wrap{ overflow:auto; border-radius:16px; max-height:calc(100vh - 360px) }
table.grid{ margin:0; font-size:.85rem; border-collapse:separate; border-spacing:0; width:100%; color:var(--text) }
table.grid thead th{ position:sticky; top:0; z-index:3; background:var(--surface-2); color:var(--muted); font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; font-weight:700; white-space:nowrap; padding:.7rem .9rem; border-bottom:1px solid var(--border) }
table.grid tbody td{ padding:.72rem .9rem; border-bottom:1px solid var(--border); white-space:nowrap; vertical-align:middle }
table.grid tbody tr:hover td{ background:var(--row-hover) }
.col-exp{ width:42px;min-width:42px;max-width:42px;text-align:center;padding-left:.4rem!important;padding-right:.4rem!important }
.col-org{ min-width:300px; max-width:320px; white-space:normal }
.col-status{ min-width:150px }
td.frozen, th.frozen{ position:sticky; z-index:2; background:var(--surface) }
thead th.frozen{ z-index:5; background:var(--surface-2) }
tbody tr:hover td.frozen{ background:var(--row-hover) }
.frozen-last{ box-shadow:10px 0 16px -12px rgba(15,23,42,.30) }
.th-inner{ display:flex; align-items:center; gap:.4rem }
.map-dot{ font-size:.5rem;line-height:1 } .map-dot.on{ color:#10b981 } .map-dot.off{ color:#ef4444 }
.pin-btn{ margin-left:auto;border:0;background:transparent;color:var(--muted);padding:.1rem .2rem;border-radius:6px;cursor:pointer;opacity:.55 }
.pin-btn:hover{ opacity:1;color:var(--brand-ink) } th.pin-on .pin-btn{ opacity:1;color:var(--brand-ink) }
.exp-btn{ border:0;background:transparent;color:var(--muted);cursor:pointer;padding:.15rem .3rem;border-radius:6px }
.exp-btn:hover,.exp-btn.open{ color:var(--brand-ink) }
tr.cand-row td{ background:color-mix(in srgb,var(--brand1) 5%, var(--surface)) }
tr.cand-row:hover td,tr.cand-row:hover td.frozen{ background:color-mix(in srgb,var(--brand1) 9%, var(--surface)) }
tr.cand-row td.frozen{ background:color-mix(in srgb,var(--brand1) 5%, var(--surface)) }
.cand-tag{ font-size:.7rem;font-weight:700;color:var(--brand-ink) }
.org-name{ font-weight:700;line-height:1.2 } .org-addr{ font-size:.76rem;color:var(--muted);margin-top:.28rem;line-height:1.3;white-space:normal }
.org-id{ display:inline-flex;align-items:center;gap:.3em;font-size:.7rem;font-weight:600;color:var(--brand-ink);background:color-mix(in srgb,var(--brand1) 10%,transparent);padding:.1em .5em;border-radius:6px;margin-top:.28rem }
.pill{ display:inline-flex;align-items:center;gap:.45em;padding:.32em .7em;border-radius:999px;font-weight:600;font-size:.72rem;line-height:1;white-space:nowrap }
.pill .dot{ width:7px;height:7px;border-radius:50% }
.pill-success{ background:rgba(16,185,129,.13);color:#059669 } .pill-success .dot{ background:#10b981 }
.pill-warning{ background:rgba(245,158,11,.15);color:#b45309 } .pill-warning .dot{ background:#f59e0b }
.pill-danger{ background:rgba(239,68,68,.13);color:#dc2626 } .pill-danger .dot{ background:#ef4444 }
.pill-secondary{ background:rgba(100,116,139,.14);color:#475569 } .pill-secondary .dot{ background:#94a3b8 }
.scorechip{ display:inline-flex;flex-direction:column;gap:4px;min-width:56px }
.scorechip .v{ font-weight:800;font-size:.82rem } .scorechip .m{ font-weight:500;color:var(--muted);font-size:.66rem }
.scorechip .bar{ height:5px;border-radius:5px;background:var(--border);overflow:hidden } .scorechip .bar>span{ display:block;height:100%;border-radius:5px }
.sc-ok .v{ color:#059669 } .sc-ok .bar>span{ background:linear-gradient(90deg,#10b981,#34d399) }
.sc-warn .v{ color:#b45309 } .sc-warn .bar>span{ background:linear-gradient(90deg,#f59e0b,#fbbf24) }
.sc-bad .v{ color:#dc2626 } .sc-bad .bar>span{ background:linear-gradient(90deg,#ef4444,#f87171) }
.rowmsg{ font-size:.7rem;color:var(--muted);margin-top:.3rem }
.dirig-found{ background:rgba(16,185,129,.15);color:#059669;font-size:.68rem;padding:.12em .5em;border-radius:6px;margin:1px;display:inline-block }
.chipmini{ display:inline-block;font-size:.68rem;padding:.12em .5em;border-radius:6px;margin:1px;background:color-mix(in srgb,var(--brand1) 10%,transparent);color:var(--brand-ink) }
.empty-state{ padding:3.5rem 1rem;text-align:center;color:var(--muted) } .empty-state i{ font-size:2.2rem;opacity:.5 }
