/* ---------- OneOS · système de design shadcn/ui ----------
   Chargée en dernier, sur toutes les pages. Reprend le système de shadcn/ui (thème « neutral », style « new-york v4 ») :
   couleurs, rayons, ombres, typographie et recette de chaque composant (Button, Input, Select, Checkbox, Switch, Badge,
   Tabs, Table, Card, Alert, Dialog, Dropdown Menu, Command, Sonner, Sidebar, Kbd), transposés sur le HTML de OneOS.
   Les icônes restent celles de Fluent UI (choix de Paolo) : shadcn/ui fonctionne avec n'importe quel jeu d'icônes.
   shadcn/ui : licence MIT, https://ui.shadcn.com. */

/* ---------- jetons (shadcn « neutral ») ---------- */
:root {
  --sh-radius: 0.625rem;
  --sh-background: oklch(1 0 0);
  --sh-foreground: oklch(0.145 0 0);
  --sh-card: oklch(1 0 0);
  --sh-popover: oklch(1 0 0);
  --sh-primary: oklch(0.205 0 0);
  --sh-primary-foreground: oklch(0.985 0 0);
  --sh-secondary: oklch(0.97 0 0);
  --sh-muted: oklch(0.97 0 0);
  --sh-muted-foreground: oklch(0.556 0 0);
  --sh-accent: oklch(0.97 0 0);
  --sh-accent-foreground: oklch(0.205 0 0);
  --sh-destructive: oklch(0.577 0.245 27.325);
  --sh-border: oklch(0.922 0 0);
  --sh-input: oklch(0.922 0 0);
  --sh-ring: oklch(0.708 0 0);
  --sh-sidebar: oklch(0.985 0 0);
  --sh-sidebar-foreground: oklch(0.145 0 0);
  --sh-sidebar-accent: oklch(0.97 0 0);
  --sh-sidebar-border: oklch(0.922 0 0);
  --sh-success: oklch(0.596 0.145 163.225);
  --sh-warning: oklch(0.666 0.179 58.318);
  --sh-info: oklch(0.546 0.245 262.881);
  --sh-shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.05);
  --sh-shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.1), 0 1px 2px -1px rgb(0 0 0 / 0.1);
  --sh-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.1), 0 2px 4px -2px rgb(0 0 0 / 0.1);
  --sh-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.1), 0 4px 6px -4px rgb(0 0 0 / 0.1);
  --sh-font: "Geist", "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --sh-mono: "Geist Mono", ui-monospace, "SF Mono", SFMono-Regular, Menlo, Consolas, monospace;

  /* variables de OneOS, branchées sur shadcn */
  --bg: var(--sh-background);
  --bg-2: var(--sh-muted);
  --surface: var(--sh-card);
  --surface-2: var(--sh-muted);
  --ink: var(--sh-foreground);
  --ink-2: var(--sh-muted-foreground);
  --line: var(--sh-border);
  --accent: var(--sh-primary);
  --accent-ink: var(--sh-primary-foreground);
  --accent-soft: var(--sh-accent);
  --good: var(--sh-success);  --good-soft: oklch(0.979 0.021 166.113);
  --warn: var(--sh-warning);  --warn-soft: oklch(0.987 0.022 95.277);
  --bad: var(--sh-destructive); --bad-soft: oklch(0.971 0.013 17.38);
  --font-display: var(--sh-font);
  --font-body: var(--sh-font);
  --font-data: var(--sh-font);                     /* shadcn : une seule police, chiffres alignés */
  --r: calc(var(--sh-radius) - 2px);
  --shadow: var(--sh-shadow-lg);
  --side-bg: var(--sh-sidebar);
  --side-ink: var(--sh-sidebar-foreground);
  --side-mute: var(--sh-muted-foreground);
  --side-hover: var(--sh-sidebar-accent);
  --side-on: var(--sh-sidebar-accent);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --sh-background: oklch(0.145 0 0);
    --sh-foreground: oklch(0.985 0 0);
    --sh-card: oklch(0.205 0 0);
    --sh-popover: oklch(0.205 0 0);
    --sh-primary: oklch(0.922 0 0);
    --sh-primary-foreground: oklch(0.205 0 0);
    --sh-secondary: oklch(0.269 0 0);
    --sh-muted: oklch(0.269 0 0);
    --sh-muted-foreground: oklch(0.708 0 0);
    --sh-accent: oklch(0.269 0 0);
    --sh-accent-foreground: oklch(0.985 0 0);
    --sh-destructive: oklch(0.704 0.191 22.216);
    --sh-border: oklch(1 0 0 / 10%);
    --sh-input: oklch(1 0 0 / 15%);
    --sh-ring: oklch(0.556 0 0);
    --sh-sidebar: oklch(0.205 0 0);
    --sh-sidebar-foreground: oklch(0.985 0 0);
    --sh-sidebar-accent: oklch(0.269 0 0);
    --sh-sidebar-border: oklch(1 0 0 / 10%);
    --sh-success: oklch(0.765 0.177 163.223);
    --sh-warning: oklch(0.828 0.189 84.429);
    --sh-info: oklch(0.707 0.165 254.624);
    --sh-shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.3);
    --sh-shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.4), 0 1px 2px -1px rgb(0 0 0 / 0.4);
    --sh-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.4), 0 2px 4px -2px rgb(0 0 0 / 0.4);
    --sh-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.5), 0 4px 6px -4px rgb(0 0 0 / 0.5);
    --bg: var(--sh-background); --bg-2: var(--sh-muted); --surface: var(--sh-card); --surface-2: var(--sh-muted);
    --ink: var(--sh-foreground); --ink-2: var(--sh-muted-foreground); --line: var(--sh-border);
    --accent: var(--sh-primary); --accent-ink: var(--sh-primary-foreground); --accent-soft: var(--sh-accent);
    --good: var(--sh-success); --good-soft: color-mix(in oklab, var(--sh-success) 14%, transparent);
    --warn: var(--sh-warning); --warn-soft: color-mix(in oklab, var(--sh-warning) 14%, transparent);
    --bad: var(--sh-destructive); --bad-soft: color-mix(in oklab, var(--sh-destructive) 16%, transparent);
    --shadow: var(--sh-shadow-lg);
  }
}
:root[data-theme="dark"] {
  --sh-background: oklch(0.145 0 0); --sh-foreground: oklch(0.985 0 0); --sh-card: oklch(0.205 0 0); --sh-popover: oklch(0.205 0 0);
  --sh-primary: oklch(0.922 0 0); --sh-primary-foreground: oklch(0.205 0 0); --sh-secondary: oklch(0.269 0 0); --sh-muted: oklch(0.269 0 0);
  --sh-muted-foreground: oklch(0.708 0 0); --sh-accent: oklch(0.269 0 0); --sh-accent-foreground: oklch(0.985 0 0);
  --sh-destructive: oklch(0.704 0.191 22.216); --sh-border: oklch(1 0 0 / 10%); --sh-input: oklch(1 0 0 / 15%); --sh-ring: oklch(0.556 0 0);
  --sh-sidebar: oklch(0.205 0 0); --sh-sidebar-foreground: oklch(0.985 0 0); --sh-sidebar-accent: oklch(0.269 0 0); --sh-sidebar-border: oklch(1 0 0 / 10%);
  --sh-success: oklch(0.765 0.177 163.223); --sh-warning: oklch(0.828 0.189 84.429); --sh-info: oklch(0.707 0.165 254.624);
  --sh-shadow-xs: 0 1px 2px 0 rgb(0 0 0 / 0.3); --sh-shadow-sm: 0 1px 3px 0 rgb(0 0 0 / 0.4), 0 1px 2px -1px rgb(0 0 0 / 0.4);
  --sh-shadow-md: 0 4px 6px -1px rgb(0 0 0 / 0.4), 0 2px 4px -2px rgb(0 0 0 / 0.4); --sh-shadow-lg: 0 10px 15px -3px rgb(0 0 0 / 0.5), 0 4px 6px -4px rgb(0 0 0 / 0.5);
  --bg: var(--sh-background); --bg-2: var(--sh-muted); --surface: var(--sh-card); --surface-2: var(--sh-muted);
  --ink: var(--sh-foreground); --ink-2: var(--sh-muted-foreground); --line: var(--sh-border);
  --accent: var(--sh-primary); --accent-ink: var(--sh-primary-foreground); --accent-soft: var(--sh-accent);
  --good: var(--sh-success); --good-soft: color-mix(in oklab, var(--sh-success) 14%, transparent);
  --warn: var(--sh-warning); --warn-soft: color-mix(in oklab, var(--sh-warning) 14%, transparent);
  --bad: var(--sh-destructive); --bad-soft: color-mix(in oklab, var(--sh-destructive) 16%, transparent);
  --shadow: var(--sh-shadow-lg);
}

/* ---------- base ---------- */
html, body { margin: 0; font-family: var(--sh-font); font-size: 14px; font-variant-numeric: tabular-nums; color: var(--sh-foreground); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; }
body { background: var(--sh-background); letter-spacing: 0; }
::selection { background: var(--sh-primary); color: var(--sh-primary-foreground); }
h1, h2, h3, h4 { letter-spacing: -0.02em; }
.num, .mono, .tbl .mono { font-variant-numeric: tabular-nums; }
.mono, .tbl .mono, .num { font-family: var(--sh-font); }   /* shadcn : police normale, chiffres alignés */
code, pre { font-family: var(--sh-mono); }
* { scrollbar-width: thin; scrollbar-color: color-mix(in oklab, var(--sh-muted-foreground) 35%, transparent) transparent; }
:focus-visible { outline: none; }
a { color: inherit; text-underline-offset: 4px; }

/* ---------- Button ---------- */
.btn, a.btn, label.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 8px; height: 36px; padding: 0 16px; box-sizing: border-box;
  border-radius: calc(var(--sh-radius) - 2px); border: 1px solid var(--sh-border); background: var(--sh-background); color: var(--sh-foreground);
  font: 500 14px/1 var(--sh-font); white-space: nowrap; box-shadow: var(--sh-shadow-xs); cursor: pointer; text-decoration: none;
  transition: background-color .15s, color .15s, box-shadow .15s, border-color .15s; filter: none;
}
.btn:hover { background: var(--sh-accent); color: var(--sh-accent-foreground); border-color: var(--sh-border); }
.btn:has(> svg:first-child) { padding-left: 12px; }
.btn svg { width: 16px; height: 16px; flex: none; }
.btn.primary, a.btn.primary { background: var(--sh-primary); color: var(--sh-primary-foreground); border-color: transparent; box-shadow: var(--sh-shadow-xs); }
.btn.primary:hover { background: color-mix(in oklab, var(--sh-primary) 90%, transparent); color: var(--sh-primary-foreground); filter: none; }
.btn:disabled, .btn[aria-disabled="true"] { opacity: .5; pointer-events: none; box-shadow: none; }
.btn:focus-visible, .icon-btn:focus-visible, .tab:focus-visible, .filter:focus-visible, .nav-item:focus-visible, .search:focus-visible, .p-item:focus-visible, .row:focus-visible {
  border-color: var(--sh-ring); box-shadow: 0 0 0 3px color-mix(in oklab, var(--sh-ring) 50%, transparent); }
.btn.tr-big { height: 40px; padding: 0 24px; }
.btn.row-act, .check .btn, .todo-item .btn, .dash-todo .btn, .prow .btn, .tbl .btn { height: 32px; padding: 0 12px; font-size: 13px; gap: 6px; }
.dash-quick .btn { height: 32px; font-size: 13px; justify-content: flex-start; }
.icon-btn { width: 32px; height: 32px; border-radius: calc(var(--sh-radius) - 2px); border: 1px solid var(--sh-border); background: var(--sh-background);
  color: var(--sh-foreground); box-shadow: var(--sh-shadow-xs); transition: background-color .15s; }
.icon-btn:hover { background: var(--sh-accent); color: var(--sh-accent-foreground); border-color: var(--sh-border); }
.icon-btn svg { width: 16px; height: 16px; }
.linkbtn, .linklike { color: var(--sh-foreground); text-decoration: underline; text-underline-offset: 4px; font-weight: 500; }
.linkbtn:hover { text-decoration-thickness: 2px; }
.back { font: 500 14px var(--sh-font); color: var(--sh-muted-foreground); }

/* ---------- Input, Select, Textarea, Label ---------- */
.field { gap: 8px; }
.field label, .flabel { font: 500 13px/1.2 var(--sh-font); color: var(--sh-foreground); letter-spacing: 0; }
.field input:not([type="checkbox"]):not([type="radio"]):not([type="range"]), .field select, .field textarea,
.lines input, .lines select, .lines textarea, .bank-assign select, .emp-row select, .bk-act select, .mf-grid select, #ac-ai, .tbl.ts input, .tbl.ts select,
.invite-box input, .it-log input, .crm-act textarea, .ai-form input, .st-search, dialog input:not([type="checkbox"]):not([type="radio"]) {
  height: 36px; box-sizing: border-box; padding: 4px 12px; border-radius: calc(var(--sh-radius) - 2px); border: 1px solid var(--sh-input);
  background: transparent; color: var(--sh-foreground); font: 400 14px var(--sh-font); box-shadow: var(--sh-shadow-xs);
  transition: border-color .15s, box-shadow .15s; outline: none;
}
.field textarea, .lines textarea, .crm-act textarea { height: auto; min-height: 64px; padding: 8px 12px; line-height: 1.45; }
.lines textarea { min-height: 36px; }
.field input::placeholder, .field textarea::placeholder, .lines textarea::placeholder, input::placeholder, textarea::placeholder { color: var(--sh-muted-foreground); opacity: 1; }
.field input:focus, .field select:focus, .field textarea:focus, .lines input:focus, .lines select:focus, .lines textarea:focus, .bank-assign select:focus,
.tbl.ts input:focus, .tbl.ts select:focus, .invite-box input:focus, .it-log input:focus, .crm-act textarea:focus, .ai-form input:focus, .emp-row select:focus,
.bk-act select:focus, .mf-grid select:focus, #ac-ai:focus, .st-search:focus-within, dialog input:focus {
  outline: none; border-color: var(--sh-ring); box-shadow: 0 0 0 3px color-mix(in oklab, var(--sh-ring) 50%, transparent);
}
[aria-invalid="true"], .field input[aria-invalid], .tbl.ts input[aria-invalid] { border-color: var(--sh-destructive) !important;
  box-shadow: 0 0 0 3px color-mix(in oklab, var(--sh-destructive) 20%, transparent) !important; background: transparent !important; }
.field input:disabled, .field select:disabled, .field textarea:disabled { opacity: .5; cursor: not-allowed; }
.tbl.ts input:disabled { opacity: 1; border-color: transparent; box-shadow: none; background: transparent; }
select:not([multiple]):not(.switch) {
  -webkit-appearance: none; appearance: none; padding-right: 32px !important; cursor: pointer;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23737373' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m6 9 6 6 6-6'/%3E%3C/svg%3E");
  background-repeat: no-repeat; background-position: right 10px center; background-size: 16px;
}
.tbl.ts input { height: 32px; padding: 4px 8px; }
/* listes étroites des lignes de facture et des tableaux : flèche plus proche, la valeur reste lisible (« 8,1 % ») */
.lines select, .tbl.ts select, .tbl select { padding: 4px 22px 4px 8px !important; background-position: right 5px center; background-size: 14px; }
.lines input { padding-left: 8px; padding-right: 8px; }
.tbl.ts select { height: 32px; }
.st-search { display: inline-flex; align-items: center; gap: 8px; padding: 0 10px; }
.st-search input { border: 0; box-shadow: none; height: 100%; padding: 0; background: transparent; font: 400 14px var(--sh-font); }
.st-search svg { width: 16px; height: 16px; color: var(--sh-muted-foreground); }
.f-err, .field .hint-bad { color: var(--sh-destructive); font-size: 13px; font-weight: 400; }
.hint-info, .field .hint-info, .hint-text, .muted, small.muted { color: var(--sh-muted-foreground); }
.field .hint-ok { color: var(--sh-success); }

/* Checkbox, Radio, Switch */
input[type="checkbox"]:not(.switch), input[type="radio"] {
  -webkit-appearance: none; appearance: none; width: 16px; height: 16px; flex: none; margin: 0; display: inline-grid; place-content: center;
  border: 1px solid var(--sh-input); background: transparent; box-shadow: var(--sh-shadow-xs); cursor: pointer; vertical-align: middle;
  transition: background-color .15s, border-color .15s, box-shadow .15s;
}
:root:not([data-theme="light"]) input[type="checkbox"]:not(.switch), :root:not([data-theme="light"]) input[type="radio"] { background: transparent; }
input[type="checkbox"]:not(.switch) { border-radius: 4px; }
input[type="radio"] { border-radius: 50%; }
input[type="checkbox"]:not(.switch):checked { background: var(--sh-primary); border-color: var(--sh-primary);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M20 6 9 17l-5-5'/%3E%3C/svg%3E");
  background-size: 12px; background-position: center; background-repeat: no-repeat; }
input[type="radio"]:checked { border-color: var(--sh-primary); background: radial-gradient(circle, var(--sh-primary) 0 3.5px, transparent 4px); }
input[type="checkbox"]:focus-visible, input[type="radio"]:focus-visible { border-color: var(--sh-ring); box-shadow: 0 0 0 3px color-mix(in oklab, var(--sh-ring) 50%, transparent); }
input[type="checkbox"]:disabled, input[type="radio"]:disabled { opacity: .5; cursor: not-allowed; }
.switch { width: 32px; height: 18.4px; border-radius: 999px; border: 1px solid transparent; background: var(--sh-input); box-shadow: var(--sh-shadow-xs); box-sizing: border-box; }
.switch::after { top: 50%; left: 1px; width: 16px; height: 16px; transform: translateY(-50%); background: var(--sh-background); box-shadow: none; }
.switch:checked { background: var(--sh-primary); }
.switch:checked::after { transform: translate(14px, -50%); }
.opt-check, .check-line, .chk { color: var(--sh-foreground); font-size: 14px; gap: 8px; align-items: center; }
.opt-check { font-size: 13px; color: var(--sh-muted-foreground); }

/* ---------- Badge (étiquettes de statut) ---------- */
.chip {
  display: inline-flex; align-items: center; gap: 6px; height: 22px; padding: 0 8px; box-sizing: border-box; border-radius: calc(var(--sh-radius) - 2px);
  border: 1px solid var(--sh-border); background: transparent; color: var(--sh-foreground); font: 500 12px/1 var(--sh-font); white-space: nowrap;
}
.chip::before { content: ""; display: block !important; width: 6px; height: 6px; border-radius: 50%; background: var(--sh-muted-foreground); flex: none; }
.chip.good, .chip.warn, .chip.bad, .chip.info, .chip.mute { background: transparent; color: var(--sh-foreground); }
.chip.good::before { background: var(--sh-success); }
.chip.warn::before { background: var(--sh-warning); }
.chip.bad { color: var(--sh-destructive); border-color: color-mix(in oklab, var(--sh-destructive) 30%, var(--sh-border)); }
.chip.bad::before { background: var(--sh-destructive); }
.chip.info::before { background: var(--sh-info); }
.chip.mute { color: var(--sh-muted-foreground); }
.chip:has(> svg)::before { display: none !important; }
.chip svg { width: 12px; height: 12px; }
.role-chip, .preview-tag, .demo-tag { border-radius: calc(var(--sh-radius) - 2px); font-weight: 500; }
.tab .count, .nb { font: 500 11px/1 var(--sh-font); font-variant-numeric: tabular-nums; }

/* bouton « À configurer » : même gabarit que les boutons, couleurs d'alerte conservées (rouge = bloquant, orange = conseil) */
.setup-btn { height: 32px; box-sizing: border-box; padding: 0 10px; gap: 6px; border-radius: calc(var(--sh-radius) - 2px); font: 500 14px/1 var(--sh-font); box-shadow: var(--sh-shadow-xs); }
.setup-btn.warn { background: color-mix(in oklab, var(--sh-warning) 10%, var(--sh-background)); color: color-mix(in oklab, var(--sh-warning) 75%, var(--sh-foreground)); border-color: color-mix(in oklab, var(--sh-warning) 40%, var(--sh-border)); }
.setup-btn.bad { background: color-mix(in oklab, var(--sh-destructive) 8%, var(--sh-background)); color: var(--sh-destructive); border-color: color-mix(in oklab, var(--sh-destructive) 40%, var(--sh-border)); }
.setup-item { border-radius: calc(var(--sh-radius) - 2px); }

/* ---------- Kbd ---------- */
kbd { display: inline-flex; align-items: center; justify-content: center; height: 20px; min-width: 20px; box-sizing: border-box; padding: 0 4px;
  border-radius: 4px; border: 0; background: var(--sh-muted); color: var(--sh-muted-foreground); font: 500 12px/1 var(--sh-font); }

/* ---------- Tabs ---------- */
.tabs { display: inline-flex; align-items: center; gap: 0; height: 36px; padding: 3px; box-sizing: border-box; border-radius: var(--sh-radius); background: var(--sh-muted); }
.tab { height: 100%; padding: 0 10px; margin: 0; border: 1px solid transparent; border-radius: calc(var(--sh-radius) - 2px); background: transparent;
  color: var(--sh-foreground); font: 500 14px/1 var(--sh-font); box-shadow: none; gap: 6px; transition: color .15s, box-shadow .15s; }
:root:not([data-theme="light"]) .tab:not([aria-selected="true"]) { color: var(--sh-foreground); }
.tab[aria-selected="true"] { background: var(--sh-background); color: var(--sh-foreground); border-color: transparent; box-shadow: var(--sh-shadow-sm); border-bottom-color: transparent; }
.tab .count { min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px; display: inline-grid; place-items: center; line-height: 18px; background: var(--sh-destructive); color: #fff; }
.tab .count.info { background: var(--sh-primary); color: var(--sh-primary-foreground); }
.seg { background: var(--sh-muted); border-radius: var(--sh-radius); padding: 3px; gap: 0; }
.seg button { border-radius: calc(var(--sh-radius) - 2px); font: 500 14px var(--sh-font); color: var(--sh-foreground); padding: 7px 10px; }
.seg button[aria-selected="true"] { background: var(--sh-background); box-shadow: var(--sh-shadow-sm); }

/* Toggle group (filtres) */
.filters { gap: 6px; }
.filter { height: 32px; padding: 0 12px; box-sizing: border-box; border-radius: calc(var(--sh-radius) - 2px); border: 1px solid var(--sh-input); background: transparent;
  color: var(--sh-foreground); font: 500 13px var(--sh-font); box-shadow: var(--sh-shadow-xs); transition: background-color .15s; }
.filter:hover { background: var(--sh-accent); }
.filter[aria-pressed="true"] { background: var(--sh-accent); color: var(--sh-accent-foreground); border-color: color-mix(in oklab, var(--sh-foreground) 22%, var(--sh-input)); }

/* ---------- Table ---------- */
.tbl-wrap { border: 1px solid var(--sh-border); border-radius: var(--sh-radius); background: var(--sh-card); overflow: auto; box-shadow: none; }
.tbl { font: 400 14px var(--sh-font); color: var(--sh-foreground); border-collapse: separate; border-spacing: 0; }
.tbl th, .lines th, .invoice-lines th, .pay-tbl th {
  height: 40px; padding: 0 12px; background: var(--sh-muted); color: var(--sh-foreground); font: 500 13px var(--sh-font);
  text-transform: none; letter-spacing: 0; text-align: left; white-space: nowrap; border-bottom: 1px solid var(--sh-border);
}
.tbl th.r { text-align: right; }
.tbl td { height: 44px; padding: 6px 12px; border-top: 0; border-bottom: 1px solid var(--sh-border); vertical-align: middle; }
.tbl tbody tr:last-child td { border-bottom: 0; }
.tbl tbody tr:hover td, .tbl tr:hover td { background: color-mix(in oklab, var(--sh-muted) 50%, transparent); }
.tbl tbody tr[aria-selected="true"] td { background: var(--sh-muted); }
.tbl .sub { font-size: 13px; color: var(--sh-muted-foreground); }
.tbl tfoot td { background: color-mix(in oklab, var(--sh-muted) 50%, transparent); border-top: 1px solid var(--sh-border); border-bottom: 0; font-weight: 500; }
.tbl .del { border-radius: calc(var(--sh-radius) - 4px); }
.tbl.fs tr.fs-g td { background: color-mix(in oklab, var(--sh-muted) 60%, transparent); font-weight: 600; }
.tbl.fs tr.fs-t td { border-top: 1px solid var(--sh-foreground); }

/* ---------- Card ---------- */
.card, .cal-wrap, .pay-month, .ob-card, .pdf-card, .ed-card, .crm-card, .tpl-card {
  border: 1px solid var(--sh-border); border-radius: calc(var(--sh-radius) + 4px); background: var(--sh-card); color: var(--sh-foreground); box-shadow: var(--sh-shadow-sm);
}
.card { padding: 20px; gap: 16px; }
.card-head h3, .section-title h3, .fs-title { font: 600 15px/1.2 var(--sh-font); letter-spacing: -0.01em; color: var(--sh-foreground); text-transform: none; }
.section-title h3 { font-size: 14px; }
.eyebrow { font: 400 13px var(--sh-font); color: var(--sh-muted-foreground); letter-spacing: 0; text-transform: none; }
.crm-card { box-shadow: var(--sh-shadow-xs); border-radius: var(--sh-radius); }

/* chiffres clés (section-cards du tableau de bord shadcn) */
.st-kpi, .kpi, .stat, .dash-fig {
  border: 1px solid var(--sh-border); border-radius: calc(var(--sh-radius) + 4px); padding: 16px 18px; box-shadow: var(--sh-shadow-xs);
  background: linear-gradient(to top, color-mix(in oklab, var(--sh-primary) 5%, var(--sh-card)), var(--sh-card));
}
:root[data-theme="dark"] .st-kpi, :root[data-theme="dark"] .kpi, :root[data-theme="dark"] .stat, :root[data-theme="dark"] .dash-fig { background: var(--sh-card); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) :is(.st-kpi, .kpi, .stat, .dash-fig) { background: var(--sh-card); } }
.st-kpi small, .kpi small, .stat small, .dash-fig small { font: 400 13px var(--sh-font); color: var(--sh-muted-foreground); }
.st-kpi b, .kpi b, .stat b, .dash-fig b { font: 600 24px/1.25 var(--sh-font); letter-spacing: -0.025em; color: var(--sh-foreground); margin-top: 4px; }
.st-kpi em, .kpi em, .stat em, .dash-fig em { font: 400 13px var(--sh-font); color: var(--sh-muted-foreground); }
.st-kpis { gap: 12px; }

/* ---------- Alert ---------- */
.check, .scene-alert, .it-alert, .enroll-note {
  border: 1px solid var(--sh-border); border-radius: var(--sh-radius); background: var(--sh-card); color: var(--sh-foreground);
  padding: 12px 16px; font-size: 14px; gap: 2px 12px; box-shadow: none;
}
.check { grid-template-columns: 18px 1fr; align-items: start; }
.check .ci { width: 18px; height: 18px; margin-top: 1px; font-size: 11px; background: var(--sh-muted-foreground); color: var(--sh-background); }
.check.info { background: var(--sh-card); }
.check.info .ci { background: var(--sh-foreground); }
.check.good { background: var(--sh-card); border-color: color-mix(in oklab, var(--sh-success) 35%, var(--sh-border)); }
.check.good .ci { background: var(--sh-success); color: #fff; }
.check.warn { background: color-mix(in oklab, var(--sh-warning) 7%, var(--sh-card)); border-color: color-mix(in oklab, var(--sh-warning) 40%, var(--sh-border)); }
.check.warn .ci { background: var(--sh-warning); color: #fff; }
.check.bad { background: var(--sh-card); color: var(--sh-destructive); border-color: color-mix(in oklab, var(--sh-destructive) 40%, var(--sh-border)); }
.check.bad .ci { background: var(--sh-destructive); color: #fff; }
.check b { font-weight: 500; }

/* ---------- Dialog ---------- */
dialog.reauth, .rcpt-modal > *, dialog[open] { border: 1px solid var(--sh-border); border-radius: var(--sh-radius); background: var(--sh-background); color: var(--sh-foreground);
  box-shadow: var(--sh-shadow-lg); padding: 24px; }
dialog::backdrop, .rcpt-modal { background: rgb(0 0 0 / .5); }
dialog.reauth h3, dialog h3 { font: 600 18px/1.2 var(--sh-font); letter-spacing: -0.01em; }
dialog.reauth p { color: var(--sh-muted-foreground); font-size: 14px; }
dialog .btn-row { justify-content: flex-end; }

/* ---------- Dropdown Menu (menus du compte, « Nouveau », « À configurer ») ---------- */
.usermenu, .setup-menu, .rail-fly {
  background: var(--sh-popover); color: var(--sh-foreground); border: 1px solid var(--sh-border); border-radius: calc(var(--sh-radius) - 2px);
  box-shadow: var(--sh-shadow-md); padding: 4px; -webkit-backdrop-filter: none; backdrop-filter: none;
}
.usermenu h4, .setup-head h4 { margin: 0; padding: 6px 8px; font: 500 14px var(--sh-font); text-transform: none; letter-spacing: 0; color: var(--sh-foreground); }
.usermenu button, .usermenu .mi-link, .rail-fly button { grid-template-columns: 16px 1fr auto; gap: 8px; padding: 6px 8px; border-radius: calc(var(--sh-radius) - 4px); font-size: 14px; }
.usermenu button:hover, .usermenu .mi-link:hover, .usermenu button[aria-checked="true"], .rail-fly button:hover { background: var(--sh-accent); color: var(--sh-accent-foreground); }
.usermenu .mi, .rail-fly .fi { width: 16px; height: 16px; border-radius: 0; background: none; color: var(--sh-muted-foreground); }
.usermenu .mi svg { width: 16px; height: 16px; }
.usermenu button b, .usermenu .mi-link b { font-weight: 400; font-size: 14px; }
.usermenu button small, .usermenu .mi-link small { font-size: 12px; color: var(--sh-muted-foreground); }
.usermenu hr { border-top-color: var(--sh-border); margin: 4px -4px; }

/* ---------- Command (recherche ⌘K) ---------- */
.palette-wrap { background: rgb(0 0 0 / .5); padding-top: 12vh; }
.palette { max-width: 560px; border: 1px solid var(--sh-border); border-radius: var(--sh-radius); background: var(--sh-popover); box-shadow: var(--sh-shadow-lg);
  -webkit-backdrop-filter: none; backdrop-filter: none; }
.palette-input { height: 48px; padding: 0 12px; gap: 8px; border-bottom: 1px solid var(--sh-border); box-sizing: border-box; }
.palette-input svg { width: 16px; height: 16px; color: var(--sh-muted-foreground); opacity: .7; }
.palette-input input { font: 400 14px var(--sh-font); color: var(--sh-foreground); }
.palette-input input::placeholder { color: var(--sh-muted-foreground); }
.palette-list { padding: 4px; max-height: 360px; }
.palette-group { padding: 6px 8px; font: 500 12px var(--sh-font); color: var(--sh-muted-foreground); text-transform: none; letter-spacing: 0; }
.p-item { gap: 8px; padding: 6px 8px; border-radius: calc(var(--sh-radius) - 4px); font-size: 14px; color: var(--sh-foreground); }
.p-item[aria-selected="true"], .p-item:hover { background: var(--sh-accent); color: var(--sh-accent-foreground); }
.p-item .p-ic { width: 16px; height: 16px; background: none; color: var(--sh-muted-foreground); border-radius: 0; }
.p-item .p-ic svg { width: 16px; height: 16px; }
.p-item b { font-weight: 400; font-size: 14px; }
.p-item small { font-size: 12px; color: var(--sh-muted-foreground); }

/* ---------- Sonner (notifications) ---------- */
.toasts, #app .toasts { top: auto; bottom: 24px; left: auto; right: 24px; transform: none; align-items: flex-end; width: 356px; max-width: calc(100% - 32px); gap: 12px; }
.toast { background: var(--sh-popover); color: var(--sh-foreground); border: 1px solid var(--sh-border); border-radius: var(--sh-radius); box-shadow: var(--sh-shadow-lg);
  padding: 16px; gap: 8px; font: 500 13px/1.4 var(--sh-font); -webkit-backdrop-filter: none; backdrop-filter: none; box-sizing: border-box; }
body > .toasts { position: fixed; }                         /* pages qui défilent (terrain) : la notification reste en bas de l'écran */
.toast .t-ic { width: 16px; height: 16px; background: none !important; color: var(--sh-success); font-weight: 700; }
.toast.warn .t-ic { color: var(--sh-warning); }
.toast.bad .t-ic { color: var(--sh-destructive); }
.toast .t-ic svg { width: 16px; height: 16px; }

/* ---------- listes, avatars, divers ---------- */
.row { border-radius: calc(var(--sh-radius) - 2px); }
.row:hover { background: var(--sh-accent); }
.row + .row { box-shadow: inset 0 1px 0 var(--sh-border); }
.row .r-main b { font-weight: 500; font-size: 14px; }
.row .r-main small, .row .r-end small { font-size: 13px; color: var(--sh-muted-foreground); }
.row .p-ic { background: none; color: var(--sh-muted-foreground); }
.avatar, .dot-av { font: 500 12px var(--sh-font); }
.empty { color: var(--sh-muted-foreground); font-size: 14px; }
.bar, .track { background: color-mix(in oklab, var(--sh-primary) 20%, transparent); border-radius: 999px; }
hr { border: 0; border-top: 1px solid var(--sh-border); }
.glass { background: var(--sh-card); -webkit-backdrop-filter: none; backdrop-filter: none; border-color: var(--sh-border); }

/* ---------- application : barre latérale shadcn (variante « inset ») ---------- */
@media (min-width: 761px) {
  #app { --top-h: 56px; --side-w: 256px; --inset: 8px; background: var(--sh-sidebar); }
  #app.nav-collapsed { --side-w: 64px; }

  /* barre du haut posée sur le fond de la barre latérale */
  #app .topbar { background: var(--sh-sidebar); border: 0; box-shadow: none; padding: 0 var(--inset) 0 0; gap: 12px; }
  #app .topbar .brand { background: transparent; box-shadow: none; width: var(--side-w); box-sizing: border-box; padding: 0 16px; margin: 0; }
  #app .topbar .logo { width: 32px; height: 32px; border-radius: calc(var(--sh-radius) - 2px); margin-right: 10px; }
  #app .topbar .brand-name { color: var(--sh-sidebar-foreground); font: 600 14px/1.2 var(--sh-font); letter-spacing: -0.01em; }
  #app .topbar .brand-sub { color: var(--sh-muted-foreground); font-size: 12px; }
  #app .topbar .search { height: 36px; max-width: 420px; padding: 0 8px 0 12px; gap: 8px; border-radius: calc(var(--sh-radius) - 2px);
    border: 1px solid var(--sh-border); background: var(--sh-background); color: var(--sh-muted-foreground); font: 400 14px var(--sh-font); box-shadow: var(--sh-shadow-xs); }
  #app .topbar .search:hover { background: var(--sh-accent); border-color: var(--sh-border); }
  #app .topbar .search svg { width: 16px; height: 16px; }
  #app .topbar .search kbd { margin-left: auto; background: var(--sh-muted); border: 0; font-family: var(--sh-font); }
  #app .topbar .btn.new-btn { height: 32px; padding: 0 12px; }
  #app .topbar .live { background: transparent; border: 0; color: var(--sh-muted-foreground); font-size: 13px; }
  #app .topbar .user { border-radius: calc(var(--sh-radius) - 2px); padding: 4px 8px 4px 4px; }
  #app .topbar .user:hover { background: var(--sh-sidebar-accent); }
  #app .topbar .user-meta b { font: 500 14px var(--sh-font); color: var(--sh-foreground); }
  #app .topbar .user-meta small { font-size: 12px; color: var(--sh-muted-foreground); }

  /* barre latérale */
  #app .rail { background: var(--sh-sidebar); border: 0; padding: 4px 8px 8px; gap: 2px; width: var(--side-w); }
  #app .rail .nav-sec { height: 32px; display: flex; align-items: center; padding: 8px 8px 0; color: color-mix(in oklab, var(--sh-sidebar-foreground) 70%, transparent);
    font: 500 12px var(--sh-font); letter-spacing: 0; }
  #app .rail .nav-item { height: 32px; padding: 0 8px; gap: 8px; border-radius: calc(var(--sh-radius) - 2px); color: var(--sh-sidebar-foreground); font: 400 14px var(--sh-font); }
  #app .rail .nav-item svg { width: 16px; height: 16px; color: var(--sh-sidebar-foreground); }
  #app .rail .nav-item:hover { background: var(--sh-sidebar-accent); color: var(--sh-sidebar-foreground); }
  #app .rail .nav-item[aria-current="page"] { background: var(--sh-sidebar-accent); color: var(--sh-sidebar-foreground); font-weight: 500; }
  #app .rail .nav-item[aria-current="page"] svg { color: var(--sh-sidebar-foreground); }
  #app .rail .nav-item .nb { min-width: 20px; height: 20px; padding: 0 4px; border-radius: calc(var(--sh-radius) - 4px); background: transparent; color: var(--sh-sidebar-foreground);
    font: 500 12px var(--sh-font); font-variant-numeric: tabular-nums; }
  #app .rail .nav-item .nb.bad { background: var(--sh-destructive); color: #fff; }
  #app .rail .nav-item .nb.warn { background: color-mix(in oklab, var(--sh-warning) 22%, transparent); color: var(--sh-foreground); }
  #app .rail .nav-item.alert::after { border-color: var(--sh-sidebar); background: var(--sh-destructive); }
  #app .rail .nav-foot { border-top: 0; }
  #app.nav-collapsed .rail .nav-sec { border-top-color: var(--sh-sidebar-border); }

  /* zone de contenu : carte posée sur le fond (SidebarInset) */
  #app .studio, #app #page { top: var(--top-h); left: var(--side-w); right: var(--inset); bottom: var(--inset); border: 1px solid var(--sh-border);
    border-radius: calc(var(--sh-radius) + 4px); background: var(--sh-background); box-shadow: var(--sh-shadow-sm); }
  #app .studio .st-head { background: transparent; border-bottom: 1px solid var(--sh-border); min-height: 56px; padding: 8px 20px; gap: 12px; }
  #app .studio .st-body { padding: 24px; }
  #app .panel { top: var(--top-h); right: var(--inset); bottom: var(--inset); border: 1px solid var(--sh-border); border-radius: calc(var(--sh-radius) + 4px);
    background: var(--sh-background); box-shadow: var(--sh-shadow-sm); overflow: hidden; }
  #app:has(> #emptyOffice:not([hidden])) #panel[data-view="overview"] { left: var(--side-w); width: auto; border-left: 1px solid var(--sh-border); }
  /* plan 3D : carte arrondie entre la barre latérale et le panneau de droite (même écart que le reste) */
  #app #scene, #app #labels, #app .empty-office, #app .plan-fallback { top: var(--top-h); left: var(--side-w); right: calc(var(--dash-w) + var(--inset)); bottom: var(--inset);
    border-radius: calc(var(--sh-radius) + 4px); }
  #app #scene { width: calc(100% - var(--side-w) - var(--dash-w) - var(--inset)); height: calc(100% - var(--top-h) - var(--inset));
    background: var(--sh-background); box-shadow: 0 0 0 1px var(--sh-border), var(--sh-shadow-sm); }
  #app .panel { width: calc(var(--dash-w) - var(--inset)); }
  #app .hint { left: calc(var(--side-w) + 12px); bottom: calc(var(--inset) + 12px); }
  #app .demo-tag { right: calc(var(--dash-w) + var(--inset) + 12px); bottom: calc(var(--inset) + 12px); }
  #app .toasts { bottom: calc(var(--inset) + 16px); right: calc(var(--inset) + 16px); }
}

/* ---------- téléphone ---------- */
@media (max-width: 760px) {
  #app .topbar { background: var(--sh-background); border-bottom: 1px solid var(--sh-border); }
  #app .topbar .brand { background: transparent; box-shadow: none; padding: 0 4px; }
  #app .topbar .brand-name { color: var(--sh-foreground); }
  #app .topbar .brand { flex: 1 1 auto; min-width: 0; }
  #app .topbar .brand-text { min-width: 0; }
  #app .topbar .brand-sub { display: none; }
  #app .topbar .setup-btn { height: 36px; padding: 0 9px; }
  #app .topbar .logo { border-radius: calc(var(--sh-radius) - 2px); }
  #app .topbar .search { width: 36px; height: 36px; padding: 0; justify-content: center; border: 1px solid var(--sh-border); background: var(--sh-background);
    border-radius: calc(var(--sh-radius) - 2px); box-shadow: var(--sh-shadow-xs); flex: none; }
  #app .topbar .search span, #app .topbar .search kbd { display: none; }
  #app .rail { background: var(--sh-sidebar); border-right: 1px solid var(--sh-border); }
  #app .rail .nav-item { color: var(--sh-sidebar-foreground); border-radius: calc(var(--sh-radius) - 2px); }
  #app .rail .nav-item[aria-current="page"], #app .rail .nav-item:hover { background: var(--sh-sidebar-accent); color: var(--sh-sidebar-foreground); }
  #app .rail .nav-sec { color: var(--sh-muted-foreground); font: 500 12px var(--sh-font); }
  .nav-shade { background: rgb(0 0 0 / .5); }
  /* Accueil sans plan des bureaux : le tableau de bord occupe l'écran, sur une colonne */
  #app:has(> #emptyOffice:not([hidden])) #panel[data-view="overview"] { top: var(--top-h); left: 0; right: 0; border: 0; }
  #app:has(> #emptyOffice:not([hidden])) #panel[data-view="overview"] .panel-head { padding: 16px; }
  #app:has(> #emptyOffice:not([hidden])) #panel[data-view="overview"] .panel-body { display: flex; flex-direction: column; gap: 20px; padding: 16px 16px 24px; }
  #app:has(> #emptyOffice:not([hidden])) #panel[data-view="overview"] .dash-figs { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .st-kpi b, .kpi b, .stat b, .dash-fig b { font-size: 20px; }
  .toasts, #app .toasts { left: 16px; right: 16px; bottom: max(16px, env(safe-area-inset-bottom)); width: auto; max-width: none; }
}

/* en-tête de page (SiteHeader) */
.st-title { gap: 8px; }
.st-title .ph-icon, .ph-icon { width: 28px; height: 28px; border-radius: calc(var(--sh-radius) - 2px); background: transparent !important; color: var(--sh-muted-foreground) !important; }
.st-title .ph-icon svg { width: 18px; height: 18px; }
.st-title h2, .st-head h2, .studio h2 { font: 600 16px/1.2 var(--sh-font); letter-spacing: -0.01em; color: var(--sh-foreground); }
.panel-title { font: 600 18px/1.2 var(--sh-font); letter-spacing: -0.02em; }
.panel-head { border-bottom: 1px solid var(--sh-border); }
.panel-foot { border-top: 1px solid var(--sh-border); }

/* tableau de bord : listes « À faire » */
.dash-todo, .todo-item { border-radius: calc(var(--sh-radius) - 2px); }
.dash-todo:hover { background: var(--sh-accent); }

/* ---------- pages publiques (connexion, invitation, offre, documents) ---------- */
.auth-hero { background: var(--sh-primary) !important; color: var(--sh-primary-foreground); }
.auth-side .card, .auth .card { box-shadow: var(--sh-shadow-sm); }
.legal-head { background: var(--sh-background); border-bottom: 1px solid var(--sh-border); }
.legal th { background: var(--sh-muted); font-weight: 500; }
.legal th, .legal td { border-color: var(--sh-border); }

/* ---------- page terrain (téléphone de l'intervenant) ---------- */
body.tr-page { background: var(--sh-background); font-size: 15px; }
.tr-top { background: color-mix(in oklab, var(--sh-background) 92%, transparent); color: var(--sh-foreground); border-bottom: 1px solid var(--sh-border);
  -webkit-backdrop-filter: saturate(1.4) blur(10px); backdrop-filter: saturate(1.4) blur(10px); }
.tr-brand b { font: 600 16px/1.2 var(--sh-font); letter-spacing: -0.01em; }
.tr-brand small { color: var(--sh-muted-foreground); }
.tr-user { border: 1px solid var(--sh-border); background: var(--sh-muted); color: var(--sh-foreground); box-shadow: var(--sh-shadow-xs); }
.tr-user:hover { background: var(--sh-accent); }
.tr-hello { color: var(--sh-muted-foreground); }
.tr-sec { font: 500 13px var(--sh-font); text-transform: none; letter-spacing: 0; color: var(--sh-muted-foreground); }
.tr-card, .tr-box { border-radius: calc(var(--sh-radius) + 4px); border-color: var(--sh-border); background: var(--sh-card); box-shadow: var(--sh-shadow-sm); }
.tr-card:active { background: var(--sh-accent); }
.tr-head h1 { font: 600 20px/1.2 var(--sh-font); letter-spacing: -0.02em; }
.tr-back, .tr-link, .tr-row a[href^="tel:"] { color: var(--sh-foreground); font-weight: 500; }
.tr-link, .tr-row a[href^="tel:"] { text-decoration: underline; text-underline-offset: 3px; }
.tr-ic { color: var(--sh-muted-foreground); }
.tr-note { border-radius: var(--sh-radius); }
.tr-mat input, .tr-mat select { border-color: var(--sh-input); border-radius: calc(var(--sh-radius) - 2px); background: transparent; box-shadow: var(--sh-shadow-xs); }
.tr-pad { border-radius: var(--sh-radius); border-color: var(--sh-border); }
.tr-big { min-height: 44px; font-weight: 500; }

/* listes libellé / valeur : un libellé long passe à la ligne au lieu d'écraser le montant */
.kv { grid-template-columns: fit-content(60%) minmax(0, 1fr); }
.kv dt { overflow-wrap: anywhere; }
.kv dd { font-variant-numeric: tabular-nums; }