/* ============================================================
   VIGIE BDA — interface réelle, même charte que maquette.html
   ============================================================ */
/* Thème sombre imposé — pas un mode parmi d'autres, cf. demande Davy 2026-09-02.
   Anciennes valeurs claires supprimées plutôt que gardées mortes derrière un
   data-theme jamais posé (personne ne bascule ce back-office en clair). */
:root {
  --ground:#0B1017; --surface:#141C27; --surface-2:#1A2430;
  --ink:#EDF1F6; --ink-2:#C9D2DE; --muted:#93A1B3; --faint:#6B7A8C;
  --line:#26313F; --line-2:#374555;
  --lapis:#7BA5EA; --lapis-ink:#9CBDF3; --lapis-soft:#182740; --on-accent:#0B1017;
  --crit:#F0928A; --crit-soft:#2E1A19;
  --warn:#DCA55E; --warn-soft:#2B2116;
  --ok:#6DBE97;   --ok-soft:#16281F;
  --bar-track:#222E3C;
  --shadow:0 1px 2px rgba(0,0,0,.35), 0 10px 28px -14px rgba(0,0,0,.65);
}

* { box-sizing: border-box; }
body {
  margin:0; background:var(--ground); color:var(--ink);
  font-family:"IBM Plex Sans",-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  font-size:15.5px; line-height:1.55; -webkit-font-smoothing:antialiased;
}
.wrap { max-width:1240px; margin:0 auto; padding:0 22px 72px; }

.masthead { border-bottom:1px solid var(--line); background:var(--surface); }
.masthead-in { max-width:1240px; margin:0 auto; padding:18px 22px 16px;
  display:flex; align-items:flex-end; justify-content:space-between; gap:24px; flex-wrap:wrap; }
.brand { display:flex; align-items:center; gap:13px; }
.brand-logo { width:44px; height:44px; border-radius:8px; object-fit:cover; align-self:center; }
.brand-name { font-family:Spectral,Georgia,serif; font-size:27px; font-weight:600; letter-spacing:-.005em; text-decoration:none; color:inherit; }
.brand-sub { font-size:13px; color:var(--muted); border-left:1px solid var(--line-2); padding-left:11px; margin-left:2px; }
.masthead-right { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.stamp { font-family:"IBM Plex Mono",monospace; font-size:11.5px; letter-spacing:.03em; color:var(--muted); text-transform:uppercase; }
.demo-chip { font-size:11.5px; font-weight:500; letter-spacing:.05em; text-transform:uppercase;
  color:var(--warn); background:var(--warn-soft);
  border:1px solid color-mix(in oklab, var(--warn) 30%, transparent); padding:4px 9px; border-radius:3px; }
.link-btn { font:inherit; font-size:12.5px; color:var(--muted); background:var(--surface-2);
  border:1px solid var(--line); border-radius:4px; padding:5px 10px; cursor:pointer; text-decoration:none; }
.link-btn:hover { color:var(--ink); border-color:var(--line-2); }

.tabs { background:var(--surface); border-bottom:1px solid var(--line); }
.tabs-in { max-width:1240px; margin:0 auto; padding:0 22px; display:flex; gap:2px; overflow-x:auto; }
.tab { font:inherit; font-size:14.5px; font-weight:450; color:var(--muted); background:none; border:0;
  border-bottom:2px solid transparent; padding:13px 15px 11px; cursor:pointer; white-space:nowrap;
  display:flex; align-items:center; gap:8px; text-decoration:none; }
.tab:hover { color:var(--ink); }
.tab[aria-current="page"] { color:var(--ink); font-weight:600; border-bottom-color:var(--lapis); }
.tab .n { font-family:"IBM Plex Mono",monospace; font-size:11.5px; font-variant-numeric:tabular-nums;
  color:var(--muted); background:var(--surface-2); border:1px solid var(--line); border-radius:9px; padding:1px 6px; }
.tab[aria-current="page"] .n { color:var(--lapis); background:var(--lapis-soft); border-color:transparent; }

.view-head { padding:26px 0 18px; display:flex; align-items:flex-end; justify-content:space-between; gap:20px; flex-wrap:wrap; }
h2 { font-family:Spectral,Georgia,serif; font-size:23px; font-weight:600; margin:0 0 4px; letter-spacing:-.005em; text-wrap:balance; }
.view-head p { margin:0; color:var(--muted); font-size:14px; max-width:64ch; }
.eyebrow { font-family:"IBM Plex Mono",monospace; font-size:11px; letter-spacing:.09em; text-transform:uppercase; color:var(--lapis); margin-bottom:6px; }
h3 { font-size:11.5px; font-weight:600; letter-spacing:.085em; text-transform:uppercase; color:var(--muted); margin:0 0 12px; }
.card { background:var(--surface); border:1px solid var(--line); border-radius:5px; box-shadow:var(--shadow); }
.pad { padding:18px 20px; }
.stack { display:flex; flex-direction:column; gap:24px; }

.btn { font:inherit; font-size:14px; font-weight:500; color:var(--on-accent); background:var(--lapis);
  border:1px solid var(--lapis); border-radius:4px; padding:7px 14px; cursor:pointer; white-space:nowrap; text-decoration:none; display:inline-block; }
.btn:hover { background:var(--lapis-ink); border-color:var(--lapis-ink); }
.btn-quiet { color:var(--ink-2); background:var(--surface); border-color:var(--line-2); }
.btn-quiet:hover { background:var(--surface-2); border-color:var(--lapis); color:var(--ink); }
.btn-warn { color:var(--on-accent); background:var(--warn); border-color:var(--warn); }
.btn-warn:hover { opacity:.85; }
.btn-crit { color:var(--on-accent); background:var(--crit); border-color:var(--crit); }
.btn-crit:hover { opacity:.85; }

.tiles { display:grid; grid-template-columns:repeat(auto-fit,minmax(176px,1fr)); gap:1px;
  background:var(--line); border:1px solid var(--line); border-radius:5px; overflow:hidden; }
.tile { background:var(--surface); padding:15px 17px 16px; }
.tile .k { font-size:11.5px; letter-spacing:.05em; text-transform:uppercase; color:var(--muted); margin-bottom:7px; }
.tile .v { font-family:Spectral,Georgia,serif; font-size:29px; font-weight:600; line-height:1; font-variant-numeric:tabular-nums; }
.tile .note { font-size:12px; color:var(--faint); margin-top:7px; }
.tile.flag .v { color:var(--warn); }
.tile.act .v { color:var(--lapis); }
.tile.done .v { color:var(--ok); }

.tw { overflow-x:auto; border:1px solid var(--line); border-radius:5px; background:var(--surface); box-shadow:var(--shadow); }
table { width:100%; border-collapse:collapse; min-width:860px; }
thead th { text-align:left; font-size:11px; font-weight:600; letter-spacing:.075em; text-transform:uppercase;
  color:var(--muted); padding:11px 14px; background:var(--surface-2); border-bottom:1px solid var(--line); }
thead th .sub { display:block; font-size:10.5px; font-weight:400; letter-spacing:.02em; text-transform:none; color:var(--faint); margin-top:2px; }
tbody td { padding:13px 14px; border-bottom:1px solid var(--line); vertical-align:top; }
tbody tr:last-child td { border-bottom:0; }
tbody tr:hover { background:var(--surface-2); }
.num { text-align:right; font-variant-numeric:tabular-nums; white-space:nowrap; }
.obj { font-weight:500; color:var(--ink); max-width:42ch; }
.buyer { font-size:13px; color:var(--muted); margin-top:3px; }
.mono { font-family:"IBM Plex Mono",monospace; font-size:12.5px; font-variant-numeric:tabular-nums; color:var(--ink-2); }
.sub2 { display:block; font-size:12px; color:var(--faint); margin-top:3px; }
.rowlink { font:inherit; font-weight:500; color:var(--ink); background:none; border:0; padding:0;
  cursor:pointer; text-align:left; border-bottom:1px solid transparent; text-decoration:none; }
.rowlink:hover { border-bottom-color:var(--lapis); color:var(--lapis); }

.dl { min-width:106px; }
.dl-top { display:flex; align-items:baseline; gap:6px; white-space:nowrap; }
.dl-days { font-family:"IBM Plex Mono",monospace; font-size:15px; font-weight:500; font-variant-numeric:tabular-nums; }
.dl-date { font-size:12px; color:var(--faint); font-variant-numeric:tabular-nums; }
.meter { height:4px; border-radius:2px; background:var(--bar-track); margin-top:6px; overflow:hidden; }
.meter i { display:block; height:100%; border-radius:2px; }
.s-crit .dl-days { color:var(--crit); } .s-crit .meter i { background:var(--crit); }
.s-warn .dl-days { color:var(--warn); } .s-warn .meter i { background:var(--warn); }
.s-ok   .dl-days { color:var(--ink-2); } .s-ok   .meter i { background:var(--lapis); }

.badges { display:flex; flex-wrap:wrap; gap:5px; }
.bdg { font-size:11px; font-weight:500; letter-spacing:.04em; padding:2px 7px; border-radius:3px;
  white-space:nowrap; border:1px solid var(--line-2); color:var(--muted); background:var(--surface-2); }
.bdg-ac { color:var(--lapis); background:var(--lapis-soft); border-color:transparent; font-weight:600; }
.bdg-src { font-family:"IBM Plex Mono",monospace; letter-spacing:0; }
.bdg-ted { border-style:dashed; }
.bdg-warn { color:var(--warn); background:var(--warn-soft); border-color:transparent; font-weight:600; }
.bdg-ok { color:var(--ok); background:var(--ok-soft); border-color:transparent; font-weight:600; }
.bdg-part { border-style:dashed; }
.bdg-pause { color:var(--faint); }

.kw { display:inline-flex; align-items:stretch; border:1px solid var(--line-2); border-radius:4px; overflow:hidden; font-size:13px; }
.kw b { font-weight:500; padding:3px 8px; background:var(--surface); color:var(--ink); }
.kw i { font-style:normal; padding:3px 8px; background:var(--surface-2); color:var(--muted);
  border-left:1px solid var(--line); font-family:"IBM Plex Mono",monospace; font-size:11.5px; }
.kw.miss i { color:var(--crit); background:var(--crit-soft); border-left-color:color-mix(in oklab, var(--crit) 30%, transparent); }
.kw button { font:inherit; font-size:11.5px; border:0; border-left:1px solid var(--line); background:var(--surface-2);
  color:var(--faint); cursor:pointer; padding:0 7px; }
.kw button:hover { color:var(--crit); background:var(--crit-soft); }
.kwrow { display:flex; flex-wrap:wrap; gap:6px; }

.picked { display:flex; flex-direction:column; gap:6px; }
.pick { display:flex; align-items:baseline; gap:9px; border:1px solid var(--line-2); border-radius:4px;
  padding:5px 8px 5px 9px; background:var(--surface); }
.pick .code { font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--lapis); font-variant-numeric:tabular-nums; }
.pick .lab { font-size:13px; flex:1; }
.pick button { font:inherit; font-size:12.5px; border:0; background:none; color:var(--faint); cursor:pointer; padding:0 2px; }
.pick button:hover { color:var(--crit); }
.results { border:1px solid var(--line-2); border-radius:4px; margin-top:6px; max-height:196px; overflow-y:auto; background:var(--surface); }
.results:empty { display:none; }
.res { display:flex; align-items:baseline; gap:9px; width:100%; text-align:left; font:inherit;
  background:none; border:0; border-bottom:1px solid var(--line); padding:7px 10px; cursor:pointer; }
.res:last-child { border-bottom:0; }
.res:hover, .res:focus-visible { background:var(--lapis-soft); outline:none; }
.res .code { font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--lapis); }
.res .lab { font-size:13px; color:var(--ink); }
.res .why { font-size:11.5px; color:var(--faint); margin-left:auto; white-space:nowrap; }

.zones { display:grid; grid-template-columns:repeat(auto-fit,minmax(186px,1fr)); gap:14px 20px; }
.zgrp { border:1px solid var(--line); border-radius:4px; padding:10px 12px; background:var(--surface); }
.zgrp > label { display:flex; gap:8px; align-items:center; font-size:13px; font-weight:600; padding-bottom:7px;
  margin-bottom:7px; border-bottom:1px solid var(--line); cursor:pointer; }
.zgrp ul { list-style:none; margin:0; padding:0; display:flex; flex-direction:column; gap:5px; }
.zgrp li label { display:flex; gap:8px; align-items:center; font-size:13px; color:var(--ink-2); cursor:pointer; }
.zgrp li .nuts { font-family:"IBM Plex Mono",monospace; font-size:11px; color:var(--faint); margin-left:auto; }

.form-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(230px,1fr)); gap:16px 20px; }
.fld { display:flex; flex-direction:column; gap:5px; }
.fld > label { font-size:11.5px; font-weight:600; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); }
.fld .hint { font-size:12px; color:var(--faint); }
input[type="text"], input[type="email"], input[type="password"], select { font:inherit; font-size:14px; color:var(--ink); background:var(--surface);
  border:1px solid var(--line-2); border-radius:4px; padding:7px 9px; width:100%; }
input:focus, select:focus { outline:2px solid var(--lapis); outline-offset:-1px; border-color:var(--lapis); }
input[readonly] { background:var(--surface-2); color:var(--muted); }
.radios { display:flex; flex-direction:column; gap:6px; font-size:14px; }
.radios label { display:flex; gap:8px; align-items:flex-start; cursor:pointer; }
.radios span { color:var(--muted); font-size:12.5px; }
.full { grid-column:1/-1; }
.form-foot { display:flex; align-items:center; gap:12px; margin-top:20px; padding-top:16px;
  border-top:1px solid var(--line); flex-wrap:wrap; }
.form-foot .sp { flex:1; }

.acts { display:flex; gap:6px; }
.act-btn { font:inherit; font-size:12.5px; font-weight:500; cursor:pointer; border-radius:4px; padding:5px 10px;
  white-space:nowrap; border:1px solid var(--line-2); background:var(--surface); color:var(--ink-2); }
.act-send:hover { border-color:var(--ok); color:var(--ok); background:var(--ok-soft); }
.act-drop:hover { border-color:var(--crit); color:var(--crit); background:var(--crit-soft); }
.done { font-size:12.5px; font-weight:500; }
.done-send { color:var(--ok); } .done-drop { color:var(--faint); }
tr.settled td { opacity:.62; }

.facts { display:grid; grid-template-columns:auto 1fr; gap:9px 16px; font-size:14px; margin:0; }
.facts dt { color:var(--muted); font-size:13px; }
.facts dd { margin:0; }
.cl-name { font-family:Spectral,Georgia,serif; font-size:19px; font-weight:600; margin-bottom:2px; }
.cl-form { font-size:12.5px; color:var(--faint); font-family:"IBM Plex Mono",monospace; }

.note-line { font-size:13px; color:var(--muted); margin:11px 0 0; padding-left:11px; border-left:2px solid var(--line-2); }
.note-line b { color:var(--ink); font-weight:600; }
.note-crit { border-left-color:var(--crit); }
.note-crit b { color:var(--crit); }

.split { display:grid; grid-template-columns:1.6fr 1fr; gap:20px; align-items:start; }
@media (max-width:960px) { .split { grid-template-columns:1fr; } }

.limits { display:grid; grid-template-columns:repeat(auto-fit,minmax(250px,1fr)); gap:20px; }
.lim h4 { font-family:Spectral,Georgia,serif; font-size:16px; font-weight:600; margin:0 0 5px; }
.lim p { margin:0; font-size:13px; color:var(--muted); }
.lim p code { font-family:"IBM Plex Mono",monospace; font-size:12px; color:var(--ink-2); }

footer { margin-top:46px; padding-top:20px; border-top:1px solid var(--line); font-size:12.5px; color:var(--faint);
  display:flex; justify-content:space-between; gap:18px; flex-wrap:wrap; }

.login-wrap { max-width:380px; margin:96px auto; padding:0 20px; }
.login-wrap .card { padding:28px; }
.login-wrap .fld { margin-bottom:14px; }
.error-box { background:var(--crit-soft); color:var(--crit); border:1px solid color-mix(in oklab, var(--crit) 30%, transparent);
  border-radius:4px; padding:9px 12px; font-size:13px; margin-bottom:14px; }
.empty { padding:30px 20px; text-align:center; color:var(--muted); font-size:14px; }

/* Fiche client — bloc "Ce que cette veille surveille" en lecture seule.
   Classes dédiées (chip/watch-section) plutôt que .kw/.pick, qui restent
   celles du form-builder interactif de nouvelle_veille.html. */
.watch-id { padding-bottom:14px; margin-bottom:2px; border-bottom:1px solid var(--line); }
.watch-section { padding:15px 0; border-top:1px solid var(--line); }
.watch-section:first-of-type { border-top:0; padding-top:14px; }
.watch-section h4 { font-size:11.5px; font-weight:600; letter-spacing:.07em; text-transform:uppercase;
  color:var(--muted); margin:0 0 10px; }
.chip-row { display:flex; flex-wrap:wrap; gap:8px; }
.chip { display:inline-flex; align-items:center; gap:7px; font-size:13px; color:var(--ink-2);
  background:var(--surface-2); border:1px solid var(--line-2); border-radius:999px; padding:5px 13px 5px 11px; }
.chip .code { font-family:"IBM Plex Mono",monospace; font-size:11px; color:var(--lapis); }
.chip-kw .nl { color:var(--faint); }
.chip-kw .nl::before { content:"→ "; }
.chip-kw.miss { border-color:color-mix(in oklab, var(--crit) 35%, transparent); }
.chip-kw.miss .nl { color:var(--crit); }
.chip-kw.miss .nl::before { content:"⚠ "; }

@media (prefers-reduced-motion:reduce) { * { transition:none !important; animation:none !important; } }
