/* =============================================================================
   Consigest — design system
   Principes : un seul accent (Cobalt), Safran réservé à l'attention, vert/rouge réservés
   aux statuts. Chiffres tabulaires partout. Pas d'ombre sauf sur les menus flottants.
   Aucune dépendance externe (ni framework CSS, ni bibliothèque d'icônes).
   ========================================================================== */

:root {
  --nuit: #121a3b;
  --nuit-2: #1b2552;
  --cobalt: #3446d4;
  --cobalt-600: #2a39b8;
  --cobalt-100: #e8ebfc;
  --on-cobalt: #ffffff;
  --safran: #e8a317;
  --safran-100: #fff3d6;
  --safran-ink: #7a5200;
  --ok: #0f8a5f;
  --ok-100: #e0f5ec;
  --bad: #c93a3a;
  --bad-100: #fce8e8;

  --bg: #f5f6fa;
  --surface: #ffffff;
  --surface-2: #fafbfd;
  --line: #e3e6ef;
  --line-strong: #cdd2e0;
  --ink: #151b33;
  --ink-2: #4b5370;
  --ink-3: #6b7390;

  --sidebar-bg: var(--nuit);
  --sidebar-ink: #c9cfe8;
  --sidebar-ink-strong: #ffffff;
  --sidebar-line: rgba(255, 255, 255, 0.08);
  --sidebar-accent: #8e9bff;

  --r-field: 6px;
  --r-panel: 10px;
  --r-chip: 999px;

  --sidebar-w: 15.5rem;
  --topbar-h: 3.5rem;
  --page-max: 80rem;

  --font: "IBM Plex Sans", "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  --fs-sm: 0.8125rem;
  --fs: 0.9375rem;
  --fs-lg: 1.0625rem;
  --fs-h1: 1.625rem;
  --fs-fig: 1.875rem;
}

:root[data-theme="dark"] {
  --cobalt: #7c8bff;
  --cobalt-600: #94a0ff;
  --cobalt-100: #1e2757;
  --on-cobalt: #0c1127;
  --safran: #f0b43a;
  --safran-100: #3a2d0e;
  --safran-ink: #f3c766;
  --ok: #37c58e;
  --ok-100: #0f2f26;
  --bad: #f27272;
  --bad-100: #3a1717;

  --bg: #0c1127;
  --surface: #141b38;
  --surface-2: #101733;
  --line: #252e55;
  --line-strong: #33407a;
  --ink: #e9ecf8;
  --ink-2: #b4bbd6;
  --ink-3: #8791b8;

  --sidebar-bg: #0a0f24;
  --sidebar-line: rgba(255, 255, 255, 0.07);
}

/* ---------- Base ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--font);
  font-size: var(--fs);
  line-height: 1.5;
  font-variant-numeric: tabular-nums;
  -webkit-font-smoothing: antialiased;
}
h1, h2, h3, p, ul { margin: 0; padding: 0; }
ul { list-style: none; }
a { color: var(--cobalt); text-decoration: none; }
a:hover { text-decoration: underline; text-underline-offset: 3px; }
button { font: inherit; color: inherit; }
:focus-visible { outline: 2px solid var(--cobalt); outline-offset: 2px; border-radius: 4px; }
.sidebar :focus-visible { outline-color: var(--sidebar-accent); }
.ico { width: 1.25rem; height: 1.25rem; flex: none; fill: none; stroke: currentColor; stroke-width: 1.75; stroke-linecap: round; stroke-linejoin: round; }
.ico--sm { width: 1rem; height: 1rem; }
.sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.muted { color: var(--ink-3); }

/* ---------- Layout ---------- */
.app { min-height: 100vh; }
.app-main { min-width: 0; }
.page { max-width: var(--page-max); margin: 0 auto; padding: 1.5rem 1.25rem 4rem; }

.sidebar {
  position: fixed; inset: 0 auto 0 0; z-index: 40;
  width: var(--sidebar-w);
  display: flex; flex-direction: column;
  background: var(--sidebar-bg); color: var(--sidebar-ink);
  transform: translateX(-100%);
  transition: transform 0.2s ease;
}
.sidebar.is-open { transform: none; }
.scrim { position: fixed; inset: 0; z-index: 30; background: rgba(10, 15, 36, 0.5); opacity: 0; pointer-events: none; transition: opacity 0.2s ease; }
.scrim.is-open { opacity: 1; pointer-events: auto; }

@media (min-width: 62rem) {
  .sidebar { transform: none; }
  .scrim { display: none; }
  .app-main { margin-left: var(--sidebar-w); }
  .page { padding: 2rem 2.25rem 4rem; }
  .only-mobile { display: none !important; }
}

/* ---------- Sidebar ---------- */
.sidebar__brand { display: flex; align-items: center; justify-content: space-between; height: var(--topbar-h); padding: 0 1rem 0 1.25rem; border-bottom: 1px solid var(--sidebar-line); }
.brand { display: inline-flex; align-items: center; gap: 0.625rem; color: var(--sidebar-ink-strong); font-weight: 600; font-size: 1.125rem; letter-spacing: -0.01em; }
.brand:hover { text-decoration: none; }
.brand__mark { width: 1.75rem; height: 1.75rem; border-radius: 7px; background: var(--cobalt); display: grid; place-items: center; }
.brand__mark svg { width: 1.125rem; height: 1.125rem; }
:root[data-theme="dark"] .brand__mark { background: #3446d4; }

.nav { flex: 1; overflow-y: auto; padding: 0.75rem 0.75rem 1rem; }
.nav__group + .nav__group { margin-top: 1.125rem; }
.nav__label { padding: 0 0.75rem 0.375rem; font-size: var(--fs-sm); color: #8c94b8; }
.nav__item {
  position: relative; display: flex; align-items: center; gap: 0.75rem;
  padding: 0.5rem 0.75rem; border-radius: var(--r-field);
  color: var(--sidebar-ink); font-weight: 450; line-height: 1.3;
}
.nav__item:hover { background: rgba(255, 255, 255, 0.06); color: var(--sidebar-ink-strong); text-decoration: none; }
.nav__item.is-active { background: rgba(255, 255, 255, 0.09); color: var(--sidebar-ink-strong); font-weight: 600; }
.nav__item.is-active::before { content: ""; position: absolute; left: -0.75rem; top: 0.375rem; bottom: 0.375rem; width: 3px; border-radius: 0 3px 3px 0; background: var(--sidebar-accent); }
.nav__item.is-soon { opacity: 0.42; cursor: default; }
.nav__item.is-soon:hover { background: none; color: var(--sidebar-ink); }

.sidebar__foot { padding: 0.875rem 1.25rem; border-top: 1px solid var(--sidebar-line); font-size: var(--fs-sm); color: #8c94b8; }

/* ---------- Topbar ---------- */
.topbar {
  position: sticky; top: 0; z-index: 20;
  display: flex; align-items: center; gap: 0.5rem;
  height: var(--topbar-h); padding: 0 0.75rem;
  background: color-mix(in srgb, var(--surface) 92%, transparent);
  backdrop-filter: saturate(1.4) blur(8px);
  border-bottom: 1px solid var(--line);
}
@media (min-width: 62rem) { .topbar { padding: 0 2.25rem; } }
.topbar__spacer { flex: 1; }

.icon-btn {
  display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem;
  border: 0; border-radius: var(--r-field); background: none; color: var(--ink-2); cursor: pointer;
}
.icon-btn:hover { background: var(--bg); color: var(--ink); }
.sidebar .icon-btn { color: var(--sidebar-ink); }
.sidebar .icon-btn:hover { background: rgba(255, 255, 255, 0.08); color: #fff; }
.theme-toggle .ico-dark { display: none; }
:root[data-theme="dark"] .theme-toggle .ico-light { display: none; }
:root[data-theme="dark"] .theme-toggle .ico-dark { display: block; }

/* ---------- Dropdown ---------- */
.dropdown { position: relative; }
.dropdown__trigger {
  display: inline-flex; align-items: center; gap: 0.625rem; max-width: 100%;
  padding: 0.25rem 0.5rem 0.25rem 0.25rem; border: 0; border-radius: var(--r-field);
  background: none; cursor: pointer; text-align: left;
}
.dropdown__trigger:hover { background: var(--bg); }
.dropdown__menu {
  position: absolute; z-index: 50; top: calc(100% + 0.375rem); right: 0; min-width: 16rem;
  padding: 0.375rem; border: 1px solid var(--line); border-radius: var(--r-panel);
  background: var(--surface); box-shadow: 0 12px 32px rgba(18, 26, 59, 0.16);
}
.dropdown__menu[hidden] { display: none; }
.dropdown__menu--left { right: auto; left: 0; }
.dropdown__head { padding: 0.5rem 0.625rem 0.375rem; font-size: var(--fs-sm); color: var(--ink-3); }
.dropdown__item {
  display: flex; align-items: center; gap: 0.625rem; width: 100%;
  padding: 0.5rem 0.625rem; border: 0; border-radius: var(--r-field);
  background: none; color: var(--ink); text-align: left; cursor: pointer;
}
.dropdown__item:hover { background: var(--bg); text-decoration: none; }
.dropdown__item[aria-current="true"] { background: var(--cobalt-100); }
.dropdown__sep { height: 1px; margin: 0.375rem 0; background: var(--line); }

.avatar {
  display: inline-grid; place-items: center; flex: none;
  width: 2rem; height: 2rem; border-radius: 50%;
  background: var(--cobalt-100); color: var(--cobalt); font-weight: 600; font-size: var(--fs-sm);
}
.avatar--square { border-radius: 7px; }
.who { display: flex; flex-direction: column; line-height: 1.25; min-width: 0; }
.who__name { font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: 11rem; }
.who__sub { font-size: var(--fs-sm); color: var(--ink-3); }
@media (max-width: 40rem) { .who { display: none; } }

/* ---------- Page head ---------- */
.page-head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; }
.page-head h1 { font-size: var(--fs-h1); font-weight: 600; letter-spacing: -0.015em; line-height: 1.2; }
.page-head__sub { margin-top: 0.25rem; color: var(--ink-2); }
.page-head__actions { display: flex; flex-wrap: wrap; gap: 0.5rem; }

/* ---------- Buttons ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  min-height: 2.5rem; padding: 0.5rem 1rem;
  border: 1px solid transparent; border-radius: var(--r-field);
  font-weight: 600; line-height: 1.2; cursor: pointer; text-decoration: none;
  transition: background 0.12s ease, border-color 0.12s ease;
}
.btn:hover { text-decoration: none; }
.btn--primary { background: var(--cobalt); color: var(--on-cobalt); }
.btn--primary:hover { background: var(--cobalt-600); }
.btn--secondary { background: var(--surface); color: var(--ink); border-color: var(--line-strong); }
.btn--secondary:hover { background: var(--bg); }
.btn--ghost { background: none; color: var(--cobalt); border-color: var(--line-strong); }
.btn--ghost:hover { background: var(--cobalt-100); }
.btn--danger { background: var(--bad); color: #fff; }
.btn--block { width: 100%; }
.btn--sm { min-height: 2rem; padding: 0.25rem 0.75rem; font-size: var(--fs-sm); }
.btn[aria-disabled="true"], .btn:disabled { opacity: 0.5; cursor: not-allowed; pointer-events: none; }

/* ---------- Panel ---------- */
.panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel); }
.panel__head { display: flex; align-items: baseline; justify-content: space-between; gap: 1rem; padding: 1rem 1.25rem 0.75rem; }
.panel__title { font-size: var(--fs-lg); font-weight: 600; letter-spacing: -0.005em; }
.panel__note { font-size: var(--fs-sm); color: var(--ink-3); }
.panel__body { padding: 0 1.25rem 1.25rem; }

/* ---------- Ledger band (tableau de bord) ---------- */
.ledger {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel);
  overflow: hidden;
}
.ledger__cell { position: relative; padding: 1.125rem 1.25rem 1.25rem; min-width: 0; }
.ledger__cell:nth-child(odd) { border-right: 1px solid var(--line); }
.ledger__cell:nth-child(n + 3) { border-top: 1px solid var(--line); }
.ledger__label { color: var(--ink-2); font-weight: 500; }
.ledger__fig { display: block; margin-top: 0.25rem; font-size: var(--fs-fig); font-weight: 600; letter-spacing: -0.02em; line-height: 1.15; white-space: nowrap; }
.ledger__cur { margin-left: 0.25rem; font-size: var(--fs); font-weight: 500; color: var(--ink-3); letter-spacing: 0; }
.ledger__sub { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.5rem; margin-top: 0.5rem; font-size: var(--fs-sm); color: var(--ink-3); }
.ledger__spark { display: block; width: 100%; height: 2rem; margin-top: 0.625rem; }
.ledger__spark polyline { fill: none; stroke: var(--cobalt); stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; vector-effect: non-scaling-stroke; }
.ledger__spark .area { fill: var(--cobalt-100); stroke: none; }
@media (min-width: 62rem) {
  .ledger { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .ledger__cell:nth-child(odd) { border-right: 0; }
  .ledger__cell:nth-child(n + 3) { border-top: 0; }
  .ledger__cell + .ledger__cell { border-left: 1px solid var(--line); }
}
.delta { font-weight: 600; }
.delta--up { color: var(--ok); }
.delta--down { color: var(--bad); }
.tone-bad { color: var(--bad); }
.tone-warn { color: var(--safran-ink); }

/* ---------- Grid helpers ---------- */
.stack { display: grid; gap: 1.25rem; }
.split { display: grid; gap: 1.25rem; margin-top: 1.25rem; }
@media (min-width: 62rem) { .split { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); align-items: start; } }

/* ---------- Worklist ---------- */
.worklist__group + .worklist__group { margin-top: 0.5rem; }
.worklist__title { padding: 0.5rem 1.25rem; font-size: var(--fs-sm); font-weight: 600; color: var(--ink-2); background: var(--surface-2); border-block: 1px solid var(--line); }
.task { display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 0.75rem; padding: 0.75rem 1.25rem; }
.task + .task { border-top: 1px solid var(--line); }
.task:hover { background: var(--surface-2); }
.task__icon { display: grid; place-items: center; width: 2rem; height: 2rem; border-radius: 7px; background: var(--bg); color: var(--ink-2); }
.task__icon.tone-bad { background: var(--bad-100); }
.task__icon.tone-warn { background: var(--safran-100); }
.task__icon.tone-info { background: var(--cobalt-100); color: var(--cobalt); }
.task__main { min-width: 0; }
.task__title { display: block; color: var(--ink); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.task__title:hover { color: var(--cobalt); text-decoration: none; }
.task__meta { display: block; font-size: var(--fs-sm); color: var(--ink-3); }
.task__end { text-align: right; font-weight: 500; white-space: nowrap; }
.task__end small { display: block; font-size: var(--fs-sm); font-weight: 400; color: var(--ink-3); }

/* ---------- Table ---------- */
.table-wrap { overflow-x: auto; }
.table { width: 100%; border-collapse: collapse; }
.table th { padding: 0.625rem 1.25rem; text-align: left; font-size: var(--fs-sm); font-weight: 600; color: var(--ink-2); background: var(--surface-2); border-block: 1px solid var(--line); white-space: nowrap; }
.table td { padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--line); vertical-align: middle; }
.table tbody tr:last-child td { border-bottom: 0; }
.table tbody tr:hover td { background: var(--surface-2); }
.table th.num, .table td.num { text-align: right; }
.table__sub { display: block; font-size: var(--fs-sm); color: var(--ink-3); }
.qty--in { color: var(--ok); font-weight: 600; }
.qty--out { color: var(--bad); font-weight: 600; }
@media (max-width: 47.99rem) { .hide-sm { display: none; } }

/* ---------- Chips ---------- */
.chip { display: inline-flex; align-items: center; gap: 0.25rem; padding: 0.125rem 0.625rem; border-radius: var(--r-chip); font-size: var(--fs-sm); font-weight: 500; line-height: 1.5; white-space: nowrap; background: var(--bg); color: var(--ink-2); }
.chip--ok { background: var(--ok-100); color: var(--ok); }
.chip--bad { background: var(--bad-100); color: var(--bad); }
.chip--warn { background: var(--safran-100); color: var(--safran-ink); }
.chip--info { background: var(--cobalt-100); color: var(--cobalt); }

/* ---------- Forms ---------- */
.field { display: grid; gap: 0.375rem; }
.field + .field { margin-top: 1rem; }
.label { font-weight: 600; }
.input, .select, .textarea {
  width: 100%; min-height: 2.75rem; padding: 0.5rem 0.75rem;
  border: 1px solid var(--line-strong); border-radius: var(--r-field);
  background: var(--surface); color: var(--ink); font: inherit;
}
.input::placeholder { color: var(--ink-3); }
.input:focus, .select:focus, .textarea:focus { outline: 2px solid var(--cobalt); outline-offset: 0; border-color: var(--cobalt); }
.help { font-size: var(--fs-sm); color: var(--ink-3); }
.field--error .input { border-color: var(--bad); }
.check { display: inline-flex; align-items: center; gap: 0.5rem; cursor: pointer; }
.check input { width: 1.125rem; height: 1.125rem; accent-color: var(--cobalt); }

/* ---------- Flash / empty ---------- */
.flashes { display: grid; gap: 0.5rem; margin-bottom: 1.25rem; }
.flash { display: flex; align-items: flex-start; gap: 0.75rem; padding: 0.75rem 1rem; border: 1px solid var(--line); border-left-width: 4px; border-radius: var(--r-field); background: var(--surface); }
.flash--success { border-left-color: var(--ok); }
.flash--error, .flash--danger { border-left-color: var(--bad); }
.flash--warning { border-left-color: var(--safran); }
.flash--info { border-left-color: var(--cobalt); }
.empty { display: grid; justify-items: center; gap: 0.5rem; padding: 2.5rem 1.25rem; text-align: center; color: var(--ink-2); }
.empty .ico { width: 2rem; height: 2rem; color: var(--ink-3); }
.empty__title { font-weight: 600; color: var(--ink); }

/* ---------- Auth ---------- */
.auth { display: grid; min-height: 100vh; }
.auth__brand { display: none; padding: 2.5rem; background: var(--nuit); color: #fff; }
.auth__brand .brand { font-size: 1.375rem; }
.auth__pitch { margin-top: 18vh; max-width: 26rem; }
.auth__pitch h2 { font-size: 2rem; font-weight: 600; line-height: 1.2; letter-spacing: -0.02em; }
.auth__pitch p { margin-top: 1rem; color: #aeb6da; font-size: var(--fs-lg); }
.auth__form { display: grid; align-content: center; justify-items: center; padding: 2rem 1.25rem; }
.auth__card { width: 100%; max-width: 24rem; }
.auth__card h1 { font-size: var(--fs-h1); font-weight: 600; letter-spacing: -0.015em; }
.auth__card .lead { margin: 0.375rem 0 1.5rem; color: var(--ink-2); }
.auth__mobile-brand { margin-bottom: 2rem; }
.auth__mobile-brand .brand { color: var(--ink); }
@media (min-width: 62rem) {
  .auth { grid-template-columns: minmax(0, 5fr) minmax(0, 6fr); }
  .auth__brand { display: flex; flex-direction: column; }
  .auth__mobile-brand { display: none; }
}

/* ---------- Choix de l'entreprise ---------- */
.choose { max-width: 34rem; margin: 0 auto; }
.choose__item { display: flex; align-items: center; gap: 0.875rem; width: 100%; padding: 0.875rem 1.25rem; border: 0; background: none; text-align: left; cursor: pointer; }
.choose__item + .choose__item, .choose form + form .choose__item { border-top: 1px solid var(--line); }
.choose__item:hover { background: var(--surface-2); }
.choose__name { font-weight: 600; }

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

/* ---------- Ajustements responsive ---------- */
.panel__head { flex-wrap: wrap; row-gap: 0.125rem; }
.panel__title { white-space: nowrap; }
.table--bars td:first-child, .table--bars th:first-child { width: 62%; }
@media (max-width: 47.99rem) {
  .ledger__fig { font-size: 1.5rem; }
  .ledger__cell { padding: 1rem; }
  .ledger__cur { display: block; margin: 0; font-size: var(--fs-sm); }
  .page-head h1 { font-size: 1.375rem; }
  .task { padding-inline: 1rem; }
  .panel__head, .panel__body { padding-inline: 1rem; }
  .table th, .table td { padding-inline: 1rem; }
}
[aria-disabled="true"] { cursor: not-allowed; }

/* ---------- Ventes ---------- */
.back { display: inline-flex; align-items: center; gap: 0.25rem; margin-bottom: 0.75rem; color: var(--ink-2); font-weight: 500; }
.back:hover { color: var(--cobalt); text-decoration: none; }

.tabs { display: flex; gap: 0.25rem; margin-bottom: 1rem; overflow-x: auto; scrollbar-width: none; }
.tabs::-webkit-scrollbar { display: none; }
.tab { display: inline-flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.875rem; border-radius: var(--r-chip); color: var(--ink-2); font-weight: 500; white-space: nowrap; }
.tab:hover { background: var(--surface); text-decoration: none; }
.tab.is-active { background: var(--nuit); color: #fff; }
:root[data-theme="dark"] .tab.is-active { background: var(--cobalt); color: var(--on-cobalt); }
.tab__count { font-size: var(--fs-sm); opacity: 0.7; }

.progress { display: block; width: 5.5rem; height: 6px; border-radius: 3px; background: var(--cobalt-100); overflow: hidden; }
.progress__bar { display: block; height: 100%; border-radius: 3px; background: var(--cobalt); }
@media (max-width: 61.99rem) { .hide-md { display: none; } }

.actionbar { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: -0.5rem 0 1.5rem; }
.actionbar form { margin: 0; }
.inline-form { display: inline-flex; flex-wrap: wrap; align-items: center; gap: 0.75rem; }
.btn--danger-ghost { color: var(--bad); }
.btn--danger-ghost:hover { background: var(--bad-100); }
.split--wide-left { margin-top: 0; }
@media (min-width: 62rem) { .split--wide-left { grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr); } }

.facts { margin: 0; padding: 0 1.25rem 1rem; }
.facts > div { display: flex; justify-content: space-between; gap: 1rem; padding: 0.5rem 0; border-bottom: 1px solid var(--line); }
.facts > div:last-child { border-bottom: 0; }
.facts dt { color: var(--ink-2); }
.facts dd { margin: 0; text-align: right; font-weight: 500; }
.facts__total dt, .facts__total dd { font-size: var(--fs-lg); font-weight: 600; color: var(--ink); }

/* Formulaires */
.form-grid { display: grid; gap: 1rem; }
.form-grid .field + .field { margin-top: 0; }
.panel__body.form-grid > .field { margin-top: 0; }   /* sinon le 1er champ est décalé vers le bas par « .panel__body > .field » */

/* Zone de scan des lignes */
.scanbar { display: grid; gap: .375rem; margin-bottom: 1rem; padding: .75rem 1rem; border: 1px dashed var(--line-strong); border-radius: var(--r-field); background: var(--surface-2); }
.scanbar__msg { min-height: 1.25rem; font-size: var(--fs-sm); color: var(--ink-3); }
.scanbar__msg.is-ok { color: var(--ok); }
.scanbar__msg.is-bad { color: var(--bad); }
@media (min-width: 48rem) { .form-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.textarea { min-height: 5rem; resize: vertical; }
.input--qty { width: 5.5rem; margin-left: auto; text-align: right; }

.lines { display: grid; gap: 0.75rem; margin-bottom: 1rem; }
.line { position: relative; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.75rem; padding: 1rem; padding-right: 3rem; border: 1px solid var(--line); border-radius: var(--r-field); background: var(--surface-2); }
.line .field + .field { margin-top: 0; }
.line__desc { grid-column: 1 / -1; }
.line__rm { position: absolute; top: 0.5rem; right: 0.5rem; }
@media (min-width: 62rem) {
  .line { grid-template-columns: minmax(0, 3fr) 5rem 8rem 6rem 6rem; align-items: start; padding-right: 3.25rem; }
  .line__desc { grid-column: auto; }
  .line__rm { top: 1.75rem; }
}
.ac { position: relative; }
.ac__list { position: absolute; z-index: 30; top: calc(100% + 4px); left: 0; right: 0; max-height: 16rem; overflow-y: auto; padding: 0.25rem; border: 1px solid var(--line); border-radius: var(--r-panel); background: var(--surface); box-shadow: 0 12px 32px rgba(18, 26, 59, 0.16); }
.ac__list[hidden] { display: none; }
.ac__list button { display: flex; flex-direction: column; align-items: flex-start; width: 100%; padding: 0.5rem 0.625rem; border: 0; border-radius: var(--r-field); background: none; text-align: left; cursor: pointer; }
.ac__list button:hover { background: var(--bg); }
.ac__list span { font-size: var(--fs-sm); color: var(--ink-3); }
.ac__none { padding: 0.5rem 0.625rem; font-size: var(--fs-sm); color: var(--ink-3); }

.formbar { position: sticky; bottom: 0; z-index: 15; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.75rem; margin: 1.25rem -1.25rem 0; padding: 0.75rem 1.25rem; background: color-mix(in srgb, var(--surface) 94%, transparent); backdrop-filter: blur(8px); border-top: 1px solid var(--line); }
.formbar__total { display: flex; flex-direction: column; line-height: 1.25; }
.formbar__total strong { font-size: var(--fs-lg); }
.formbar__actions { display: flex; gap: 0.5rem; margin-left: auto; }
@media (min-width: 62rem) { .formbar { margin-inline: -2.25rem; padding-inline: 2.25rem; } }
.stack, .split > * { min-width: 0; }
.field { align-content: start; }
.stack, .split { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 62rem) { .split { grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr); } .split--wide-left { grid-template-columns: minmax(0, 1.8fr) minmax(0, 1fr); } }

/* ---------- Trésorerie ---------- */
.ledger--three { grid-template-columns: minmax(0, 1fr); }
.ledger--three .ledger__cell:nth-child(odd) { border-right: 0; }
.ledger--three .ledger__cell + .ledger__cell { border-top: 1px solid var(--line); }
@media (min-width: 62rem) { .ledger--three { grid-template-columns: repeat(3, minmax(0, 1fr)); } .ledger--three .ledger__cell + .ledger__cell { border-top: 0; border-left: 1px solid var(--line); } }
.tone-ok { color: var(--ok); }

.section-head { display: flex; align-items: center; justify-content: space-between; margin: 1.5rem 0 0.75rem; }
.section-head h2 { font-size: var(--fs-lg); font-weight: 600; }
.accounts { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 40rem) { .accounts { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 75rem) { .accounts { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.acct { padding: 1rem 1.25rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel); }
.acct.is-selected { border-color: var(--cobalt); box-shadow: 0 0 0 1px var(--cobalt) inset; }
.acct__top { display: flex; align-items: center; gap: 0.75rem; }
.acct__name { font-weight: 600; }
.acct__sub { font-size: var(--fs-sm); color: var(--ink-3); overflow-wrap: anywhere; }
.acct__bal { margin: 0.875rem 0 0.625rem; font-size: 1.625rem; font-weight: 600; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.acct__actions { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; font-size: var(--fs-sm); font-weight: 500; }

.form-grid--4 { grid-template-columns: minmax(0, 1fr); }
.form-grid--2 { grid-template-columns: minmax(0, 1fr); }
@media (min-width: 48rem) { .form-grid--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); } .form-grid--2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (min-width: 75rem) { .form-grid--4 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.narrow { max-width: 42rem; }
.static { min-height: 2.75rem; display: flex; align-items: center; font-weight: 600; }
[hidden] { display: none !important; }
.input--money { width: 8.5rem; }
.tick { width: 1.125rem; height: 1.125rem; accent-color: var(--cobalt); }

.act { position: relative; display: inline-block; text-align: left; }
.act > summary { list-style: none; cursor: pointer; }
.act > summary::-webkit-details-marker { display: none; }
.act__menu { position: absolute; z-index: 20; right: 0; top: calc(100% + 4px); width: 16rem; display: grid; gap: 0.75rem; padding: 0.75rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel); box-shadow: 0 12px 32px rgba(18, 26, 59, 0.16); }
.act__menu form { display: grid; gap: 0.375rem; }
.act__menu form + form { padding-top: 0.75rem; border-top: 1px solid var(--line); }
@media (min-width: 48rem) { .only-sm { display: none; } }
.table td, .table th { overflow-wrap: anywhere; }
.table td.num, .table th.num { overflow-wrap: normal; }
@media (min-width: 48rem) { .table-wrap--visible { overflow: visible; } }
@media (max-width: 47.99rem) { .act__menu { position: fixed; left: 1rem; right: 1rem; top: auto; bottom: 1rem; width: auto; } }

/* ===== Comptabilité ===== */
.acc-bar { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 0.75rem 1.5rem; }
.acc-bar .tabs { min-width: 0; max-width: 100%; }
.acc-year { display: flex; align-items: center; gap: 0.5rem; margin-bottom: 1rem; }
.acc-year .select { width: auto; min-width: 9rem; }
.mono { font-variant-numeric: tabular-nums; font-feature-settings: "tnum"; font-weight: 600; letter-spacing: 0.01em; }
.dc { font-size: var(--fs-sm); color: var(--ink-3); font-weight: 500; margin-left: 0.125rem; }
.table tfoot th { background: var(--surface-2); border-top: 1px solid var(--line); border-bottom: 0; color: var(--ink); }
.table--compact th, .table--compact td { padding: 0.5rem 1.25rem; }
.table--compact th { background: transparent; border-top: 0; }
.entries { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); }
.entry { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); overflow: hidden; min-width: 0; }
.entry__head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.75rem; padding: 0.75rem 1.25rem; }
.entry__label { flex: 1 1 12rem; min-width: 0; font-weight: 500; overflow-wrap: anywhere; }
.entry__date { color: var(--ink-3); font-size: var(--fs-sm); }
.linklist { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.125rem; }
.linklist a { display: flex; align-items: center; gap: 0.625rem; padding: 0.5rem 0.25rem; border-radius: var(--r-ctl); color: var(--ink); }
.linklist a:hover { background: var(--bg); text-decoration: none; }
.pager { display: flex; align-items: center; justify-content: center; gap: 1rem; margin-top: 1.5rem; }
.pager__info { color: var(--ink-2); font-size: var(--fs-sm); }
.panel__foot { margin: 0; padding: 0.875rem 1.25rem; border-top: 1px solid var(--line); color: var(--ink-2); font-size: var(--fs-sm); }
.acc-close { margin-top: 0.5rem; }
.panel__body > .facts { padding-inline: 0; }

/* ---------- Comptabilité ---------- */
.tone-good { color: var(--ok); }
.note { margin: 1rem 0 0; color: var(--ink-2); font-size: var(--fs-sm); max-width: 60ch; }
.period { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 0.75rem; }
.period__f { display: grid; gap: 0.375rem; min-width: 0; }
.period__f--wide { flex: 1 1 18rem; }
.period .input[type="date"] { min-width: 9.5rem; }
.toolbar { display: grid; gap: 0.875rem; margin-bottom: 1.25rem; }
.chips { display: flex; flex-wrap: wrap; gap: 0.375rem; }
.chip-link { padding: 0.25rem 0.75rem; border: 1px solid var(--line); border-radius: var(--r-chip); color: var(--ink-2); font-size: var(--fs-sm); font-weight: 500; background: var(--surface); }
.chip-link:hover { border-color: var(--cobalt); color: var(--cobalt); text-decoration: none; }
.chip-link.is-active { background: var(--nuit); border-color: var(--nuit); color: #fff; }
:root[data-theme="dark"] .chip-link.is-active { background: var(--cobalt); border-color: var(--cobalt); color: var(--on-cobalt); }
.entry { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); margin-bottom: 0.875rem; overflow: hidden; }
.entry__head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem 0.75rem; padding: 0.75rem 1.25rem; border-bottom: 1px solid var(--line); background: var(--surface-2); }
.entry__label { flex: 1 1 14rem; min-width: 0; font-weight: 600; }
.entry__date { color: var(--ink-2); font-size: var(--fs-sm); }
.entry .table-wrap { border: 0; border-radius: 0; }
.setup { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: center; gap: 0.75rem; padding: 0 1.25rem 1.5rem; }
.setup .field + .field { margin-top: 0; }
.nowrap { white-space: nowrap; }

/* ---------- Charges et résultats ---------- */
.statement td { padding-block: 0.75rem; }
.statement .num { font-variant-numeric: tabular-nums; }
.statement__sub td { background: var(--surface-2); font-weight: 600; border-top: 1px solid var(--line); }
.statement__total td { border-top: 2px solid var(--ink); font-weight: 700; font-size: var(--fs-lg, 1.125rem); }
.shares { list-style: none; margin: 0; padding: 0; display: grid; gap: 1rem; }
.share__row { display: flex; justify-content: space-between; align-items: baseline; gap: 0.75rem; flex-wrap: wrap; }
.share__row > span { min-width: 0; }
.share__bar { height: 0.375rem; margin-top: 0.375rem; background: var(--line); border-radius: 999px; overflow: hidden; }
.share__bar span { display: block; height: 100%; background: var(--cobalt); border-radius: 999px; }
.bars { display: flex; align-items: stretch; gap: 0.5rem; height: 11rem; overflow-x: auto; padding-bottom: 0.25rem; }
.bars__col { flex: 1 0 2.25rem; display: grid; grid-template-rows: 1fr auto; gap: 0.375rem; min-width: 0; }
.bars__pair { display: flex; align-items: flex-end; justify-content: center; gap: 3px; border-bottom: 1px solid var(--line); }
.bar { display: block; width: 40%; max-width: 1.25rem; min-height: 2px; border-radius: 3px 3px 0 0; }
.bar--sales { background: var(--cobalt); }
.bar--costs { background: var(--safran); }
.bars__label { text-align: center; font-size: var(--fs-sm); color: var(--ink-2); }
.key { display: inline-block; width: 0.625rem; height: 0.625rem; border-radius: 2px; margin: 0 0.25rem 0 0.75rem; }
.key--sales { background: var(--cobalt); }
.key--costs { background: var(--safran); }
.meter { display: block; height: 0.25rem; margin-top: 0.375rem; background: var(--line); border-radius: 999px; overflow: hidden; min-width: 4rem; }
.meter__fill { display: block; height: 100%; background: var(--ok); }
.meter__fill--bad { background: var(--bad); }

/* ---------- Import de données ---------- */
@media (min-width: 48rem) { .ledger--four { grid-template-columns: repeat(4, minmax(0, 1fr)); } }
.import-types { display: grid; gap: 1rem; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 62rem) { .import-types { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.import-type { display: flex; flex-direction: column; gap: 0.5rem; padding: 1.25rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-card); }
.import-type__title { margin: 0.5rem 0 0; font-size: var(--fs-lg, 1.125rem); }
.import-type__text { margin: 0; color: var(--ink-2); flex: 1; }
.import-type__actions { display: flex; flex-wrap: wrap; gap: 0.5rem; margin-top: 0.75rem; }
.steps { list-style: none; display: flex; gap: 0.5rem; margin: 0 0 1.25rem; padding: 0; overflow-x: auto; }
.step { flex: 1 1 0; min-width: 5.5rem; display: flex; align-items: center; gap: 0.5rem; padding: 0.5rem 0.75rem; border-bottom: 3px solid var(--line); color: var(--ink-3); font-weight: 500; }
.step__n { display: inline-grid; place-items: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; border: 1.5px solid currentColor; font-size: var(--fs-sm); flex: none; }
.step.is-current { color: var(--ink); border-color: var(--cobalt); }
.step.is-current .step__n { background: var(--cobalt); border-color: var(--cobalt); color: var(--on-cobalt, #fff); }
.step.is-done { color: var(--ok); border-color: var(--ok); }
.dropzone { position: relative; display: grid; justify-items: center; gap: 0.375rem; padding: 2.25rem 1rem; border: 2px dashed var(--line); border-radius: var(--r-card); background: var(--surface-2); color: var(--ink-2); text-align: center; cursor: pointer; }
.dropzone:hover, .dropzone:focus-within { border-color: var(--cobalt); color: var(--cobalt); }
.dropzone .ico { width: 1.75rem; height: 1.75rem; }
.dropzone__title { font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.dropzone__hint { font-size: var(--fs-sm); }
.dropzone__input { position: absolute; inset: 0; opacity: 0; cursor: pointer; width: 100%; height: 100%; }
.tips { margin: 1rem 0 0; padding-left: 1.25rem; color: var(--ink-2); font-size: var(--fs-sm); display: grid; gap: 0.375rem; }
.map { display: grid; }
.map__group { display: grid; gap: 0.125rem; padding: 0.875rem 1.25rem 0.5rem; border-top: 1px solid var(--line-strong); background: var(--surface-2, transparent); }
.map__group strong { font-size: var(--fs-sm); text-transform: uppercase; letter-spacing: 0.04em; color: var(--ink-2); }
.map__row { display: grid; gap: 0.5rem; padding: 0.875rem 1.25rem; border-top: 1px solid var(--line); }
.map__field { min-width: 0; display: grid; gap: 0.125rem; }
.map__pick { min-width: 0; display: grid; gap: 0.25rem; }
.map__sample { color: var(--ink-3); font-size: var(--fs-sm); overflow-wrap: anywhere; min-height: 1.1em; }
@media (min-width: 48rem) { .map__row { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); align-items: start; } }
.check { display: flex; gap: 0.625rem; align-items: flex-start; }
.check input { margin-top: 0.25rem; accent-color: var(--cobalt); width: 1rem; height: 1rem; flex: none; }
.check .help { display: block; }
.panel__body > .field { margin-top: 1rem; }
.job__bar { height: 0.625rem; border-radius: 999px; background: var(--cobalt-100); overflow: hidden; }
.job__bar span { display: block; height: 100%; background: var(--cobalt); border-radius: 999px; transition: width 0.4s ease; }
.job__line { margin: 0.75rem 0 0; color: var(--ink-2); }
.formbar-inline { margin: 0; }
.table--nowrap th, .table--nowrap td { white-space: nowrap; }
@media (max-width: 47.99rem) { .step { min-width: 0; justify-content: center; padding-inline: 0.25rem; } .step:not(.is-current) .step__t { display: none; } .step.is-current { flex: 2 1 0; } }

/* ---- Pilote financier ---- */
.score { display: flex; align-items: baseline; gap: 0.5rem; }
.score__num { font-size: 3.25rem; font-weight: 700; line-height: 1; letter-spacing: -0.02em; font-variant-numeric: tabular-nums; }
.score__max { color: var(--ink-3); font-size: var(--fs-lg); }
.score--good .score__num { color: var(--ok); }
.score--watch .score__num { color: var(--safran-ink); }
.score--weak .score__num { color: var(--bad); }
.pilot-health { display: grid; gap: 1.25rem; }
@media (min-width: 62rem) { .pilot-health { grid-template-columns: minmax(0, 14rem) minmax(0, 1fr); align-items: start; } }
.findings { list-style: none; margin: 0; padding: 0 1.25rem 1.25rem; display: grid; gap: 0.75rem; }
.finding { display: grid; gap: 0.375rem; padding: 0.875rem 1rem; border: 1px solid var(--line); border-left-width: 4px; border-radius: var(--r-field); background: var(--surface); }
.finding--critical { border-left-color: var(--bad); }
.finding--warning { border-left-color: var(--safran); }
.finding--info { border-left-color: var(--cobalt); }
.finding--good { border-left-color: var(--ok); }
.finding__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.25rem 1rem; }
.finding__title { font-weight: 600; }
.finding__impact { font-size: var(--fs-sm); color: var(--ink-2); white-space: nowrap; }
.finding__facts, .finding__action { margin: 0; }
.finding__facts { color: var(--ink-2); }
.finding__action { padding-top: 0.25rem; }
.delta { font-size: var(--fs-sm); }
.delta--up { color: var(--ok); }
.delta--down { color: var(--bad); }
@media (max-width: 47.99rem) { .findings { padding-inline: 1rem; } }

/* ── Graphiques et indicateurs (tableaux de bord) ───────────────────────── */
.s1 { --c: var(--cobalt); } .s2 { --c: var(--safran); } .s3 { --c: var(--ok); } .s4 { --c: var(--bad); } .s5 { --c: var(--ink-3); } .s6 { --c: #8a5cf6; }
.chart { display: block; width: 100%; height: auto; max-height: 18rem; }
.chart__grid { stroke: var(--line); stroke-width: 1; }
.chart__grid--zero { stroke: var(--line-strong); }
.chart__tick { fill: var(--ink-3); font-size: 11px; }
.chart__line { fill: none; stroke: var(--c); stroke-width: 2.25; stroke-linejoin: round; stroke-linecap: round; }
.chart__area { fill: var(--c); opacity: 0.12; }
.chart__dot { fill: var(--surface); stroke: var(--c); stroke-width: 2; }
.chart__bar { fill: var(--c); }
.chart__bar:hover, .chart__dot:hover { opacity: 0.8; }
.chart__legend { display: flex; flex-wrap: wrap; gap: 0.25rem 1rem; margin: 0.5rem 0 0; padding: 0; list-style: none; font-size: var(--fs-sm); color: var(--ink-2); }
.chart__legend li { display: flex; align-items: center; gap: 0.4rem; }
.chart__legend--col { flex-direction: column; flex-wrap: nowrap; margin: 0; min-width: 0; flex: 1; }
.chart__legend--col li strong { margin-left: auto; color: var(--ink); font-variant-numeric: tabular-nums; }
.chart__legend--col li em { font-style: normal; color: var(--ink-3); min-width: 2.75rem; text-align: right; }
.chart__swatch { width: 0.7rem; height: 0.7rem; border-radius: 3px; background: var(--c); flex: none; }
.donut { display: flex; align-items: center; gap: 1.25rem; flex-wrap: wrap; padding: 0.25rem 0; }
.donut__svg { width: 9.5rem; height: 9.5rem; flex: none; }
.donut__track { fill: none; stroke: var(--line); stroke-width: 12; }
.donut__seg { fill: none; stroke: var(--c); stroke-width: 12; }
.donut__num { fill: var(--ink); font-size: 15px; font-weight: 700; }
.donut__cap { fill: var(--ink-3); font-size: 6.5px; }
.rank { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.7rem; }
.rank__row { display: grid; grid-template-columns: 1fr auto; gap: 0.15rem 0.75rem; font-size: var(--fs-sm); }
.rank__val { font-variant-numeric: tabular-nums; font-weight: 600; }
.rank__bar { grid-column: 1 / -1; height: 6px; border-radius: 3px; background: var(--line); overflow: hidden; }
.rank__fill { display: block; height: 100%; border-radius: 3px; background: var(--cobalt); }
.rank__fill--bad { background: var(--bad); } .rank__fill--warn { background: var(--safran); } .rank__fill--ok { background: var(--ok); }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(13.5rem, 1fr)); gap: 0.75rem; margin-bottom: 1rem; }
.kpi { display: flex; flex-direction: column; gap: 0.2rem; padding: 0.9rem 1rem; background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel); border-left: 4px solid var(--line-strong); }
.kpi--ok { border-left-color: var(--ok); } .kpi--bad { border-left-color: var(--bad); } .kpi--warn { border-left-color: var(--safran); }
.kpi__label { font-size: var(--fs-sm); color: var(--ink-3); }
.kpi__value { font-size: 1.5rem; font-weight: 700; color: var(--ink); font-variant-numeric: tabular-nums; line-height: 1.15; }
.kpi__sub { font-size: var(--fs-sm); color: var(--ink-2); }
.grid-2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(20rem, 1fr)); gap: 1rem; margin-bottom: 1rem; }
.grid-2 > .panel { margin-bottom: 0; }

/* ---------- Recherche globale (barre du haut) ---------- */
.gsearch { position: relative; flex: 1 1 14rem; min-width: 0; max-width: 32rem; margin-left: 0.5rem; }
.gsearch input { width: 100%; height: 2.25rem; padding: 0 0.75rem; border: 1px solid var(--line-strong); border-radius: var(--r-field, 0.5rem); background: var(--surface); color: var(--ink); font: inherit; }
.gsearch input::placeholder { color: var(--ink-3); }
.gsearch input:focus { outline: 2px solid var(--cobalt); outline-offset: 1px; }
.gsearch__panel { position: absolute; left: 0; right: 0; top: calc(100% + 0.35rem); z-index: 60; max-height: min(70vh, 30rem); overflow: auto; background: var(--surface); border: 1px solid var(--line-strong); border-radius: 0.6rem; box-shadow: 0 12px 32px rgba(10, 15, 36, 0.18); padding: 0.35rem; min-width: min(26rem, 92vw); }
.gsearch__group { padding: 0.5rem 0.6rem 0.2rem; font-size: 0.72rem; font-weight: 600; letter-spacing: 0.04em; text-transform: uppercase; color: var(--ink-3); }
.gsearch__item { display: flex; flex-direction: column; gap: 0.1rem; padding: 0.45rem 0.6rem; border-radius: 0.4rem; color: var(--ink); text-decoration: none; }
.gsearch__item:hover, .gsearch__item.is-active { background: var(--surface-2); text-decoration: none; outline: 1px solid var(--line); }
.gsearch__title { font-weight: 600; }
.gsearch__sub { font-size: var(--fs-sm, 0.85rem); color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gsearch__empty { padding: 0.8rem 0.7rem; color: var(--ink-2); }
@media (max-width: 40rem) { .gsearch { flex-basis: 0; } .gsearch input { padding: 0 0.5rem; } }

/* ── Couleur par famille de modules ─────────────────────────────────────────
   Chaque groupe du menu a sa couleur ; la page affichée reprend celle du groupe actif
   (barre d'en-tête, onglet actif, bandeau des totaux). Les couleurs servent à se repérer,
   jamais à porter seules une information (le texte reste toujours présent). */
:root {
  --mod-pilotage: #8e9bff;
  --mod-commerce: #3b9eff;
  --mod-stock: #f0a020;
  --mod-finances: #2bb673;
  --mod-personnel: #b57bff;
  --mod-outils: #8c94b8;
  --mod-plateforme: #ff6b8a;
}
.nav__group--pilotage { --mod: var(--mod-pilotage); }
.nav__group--commerce { --mod: var(--mod-commerce); }
.nav__group--stock { --mod: var(--mod-stock); }
.nav__group--finances { --mod: var(--mod-finances); }
.nav__group--personnel { --mod: var(--mod-personnel); }
.nav__group--outils { --mod: var(--mod-outils); }
.nav__group--plateforme { --mod: var(--mod-plateforme); }
.nav__group .nav__label { display: flex; align-items: center; gap: 0.5rem; }
.nav__group .nav__label::before { content: ""; width: 0.55rem; height: 0.55rem; border-radius: 50%; background: var(--mod, var(--sidebar-accent)); flex: none; }
.nav__group .nav__item .ico { color: var(--mod, currentColor); opacity: 0.9; }
.nav__group .nav__item.is-active::before { background: var(--mod, var(--sidebar-accent)); }
.nav__group .nav__item.is-active { box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--mod, #fff) 35%, transparent); }

.page[data-module="pilotage"] { --mod: var(--mod-pilotage); }
.page[data-module="commerce"] { --mod: var(--mod-commerce); }
.page[data-module="stock"] { --mod: var(--mod-stock); }
.page[data-module="finances"] { --mod: var(--mod-finances); }
.page[data-module="personnel"] { --mod: var(--mod-personnel); }
.page[data-module="outils"] { --mod: var(--mod-outils); }
.page[data-module="plateforme"] { --mod: var(--mod-plateforme); }
.page[data-module] .page-head { border-left: 4px solid var(--mod); padding-left: 0.875rem; }
.page[data-module] .tab.is-active { box-shadow: inset 0 -3px 0 var(--mod); }
.page[data-module] .ledger { border-top: 3px solid var(--mod); }

/* Sélecteur d'articles universel (js/picker.js) : une fenêtre à part, de couleur différente de la page, pour ne pas confondre avec les champs. */
.pk { position: fixed; z-index: 90; overflow-y: auto; padding: 0 0 0.375rem; border: 2px solid #3b5bdb; border-radius: 12px; background: #e8edff; box-shadow: 0 0 0 9999px rgba(18, 26, 59, 0.28), 0 20px 48px rgba(18, 26, 59, 0.35); }
.pk[hidden] { display: none; }
.pk__bar { position: sticky; top: 0; z-index: 1; display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 0.25rem 1rem; padding: 0.5rem 0.75rem; margin-bottom: 0.375rem; background: #3b5bdb; color: #fff; font-size: var(--fs-sm); }
.pk__bar span { opacity: 0.85; font-size: 0.75rem; }
.pk__it { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "main side" "sub side"; gap: 0.125rem 0.75rem; width: calc(100% - 0.75rem); margin: 0 0.375rem 0.25rem; padding: 0.5rem 0.625rem; border: 1px solid #c7d2fe; border-radius: 8px; background: #fff; text-align: left; cursor: pointer; color: inherit; font: inherit; }
.pk__it:hover { border-color: #3b5bdb; }
.pk__it.is-on { border-color: #3b5bdb; background: #f3f6ff; outline: 2px solid #3b5bdb; outline-offset: -2px; }
.pk__main { grid-area: main; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk__main em { font-style: normal; color: var(--ink-3); }
.pk__sub { grid-area: sub; font-size: var(--fs-sm); color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk__side { grid-area: side; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: 0.125rem; font-size: var(--fs-sm); }
.pk__st { padding: 0 0.4rem; border-radius: 999px; font-size: 0.75rem; background: var(--bg); color: var(--ink-3); }
.pk__st--ok { color: #1b7a3d; background: #e6f4ea; }
.pk__st--low { color: #8a5a00; background: #fdf1d6; }
.pk__st--out { color: #a12626; background: #fbe4e4; }
.pk__none { padding: 0.75rem; font-size: var(--fs-sm); color: #2b3a8a; }
.pk mark { background: #fff1a8; color: inherit; border-radius: 2px; padding: 0 1px; }
/* Le champ en cours de saisie reste au-dessus du voile pour qu'on voie ce qu'on tape. */
.pk-active { position: relative; z-index: 95; box-shadow: 0 0 0 3px #3b5bdb; border-radius: 8px; background: #fff; }

/* Rôles personnalisés */
.rolegrp { margin: 1rem 0; padding: 0.75rem 1rem; border: 1px solid var(--line); border-radius: var(--r-panel); }
.rolegrp legend { padding: 0 0.4rem; font-weight: 600; }
.rolegrp__it { display: block; padding: 0.2rem 0; cursor: pointer; }
.rolegrp--sensitive { border-color: #e0b15a; background: #fffaf0; }

/* ---------- Tableau de bord : « À faire aujourd'hui » ---------- */
.todo { background: var(--surface); border: 1px solid var(--line); border-radius: var(--r-panel); padding: 0.9rem 1rem; margin-bottom: 1rem; }
.todo--clear { border-left: 4px solid var(--ok); color: var(--ink-2); }
.todo__title { margin: 0 0 0.6rem; font-size: var(--fs); font-weight: 600; }
.todo__list { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; grid-template-columns: repeat(auto-fit, minmax(19rem, 1fr)); }
.todo__item { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.7rem 0.85rem; border: 1px solid var(--line); border-left: 4px solid var(--line-strong); border-radius: var(--r-field); background: var(--surface-2); }
.todo__item--bad { border-left-color: var(--bad); }
.todo__item--warn { border-left-color: var(--safran); }
.todo__item--info { border-left-color: var(--cobalt); }
.todo__text { display: flex; flex-direction: column; min-width: 0; }
.todo__sub { font-size: var(--fs-sm); color: var(--ink-3); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---------- Caisse : écran tactile ---------- */
.pos-scan { font-size: 1.15rem; min-height: 3.25rem; }
.pos-side { display: grid; gap: 0.75rem; align-content: start; }
@media (min-width: 62rem) { .pos-side { position: sticky; top: 4.5rem; } }
.pos-total { background: var(--nuit); color: #fff; border-radius: var(--r-panel); padding: 1rem 1.25rem; }
.pos-total__label { color: #c9cfe8; font-size: var(--fs-sm); }
.pos-total__fig { font-size: 3rem; font-weight: 700; line-height: 1.1; font-variant-numeric: tabular-nums; letter-spacing: -0.02em; }
.pos-total__cur { font-size: 1.1rem; font-weight: 500; color: #c9cfe8; }
.pos-total__vat { color: #8c94b8; font-size: var(--fs-sm); margin-top: 0.25rem; }
.pos-quick { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6rem; }
.pos-key { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.15rem; min-height: 4rem; border: 2px solid var(--line-strong); border-radius: var(--r-panel); background: var(--surface); color: var(--ink); font: inherit; font-size: 1.15rem; font-weight: 700; cursor: pointer; }
.pos-key small { font-size: var(--fs-sm); font-weight: 500; color: var(--ink-3); }
.pos-key--cash { border-color: var(--ok); } .pos-key--card { border-color: var(--cobalt); }
.pos-key:hover, .pos-key:focus-visible { background: var(--surface-2); }
.pos-key:active { transform: translateY(1px); }
.pos-bills { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5rem; margin: 0.75rem 0; }
.pos-bill { min-width: 3.5rem; min-height: 2.75rem; border: 1px solid var(--line-strong); border-radius: var(--r-field); background: var(--surface-2); color: var(--ink); font: inherit; font-weight: 700; cursor: pointer; }
.pos-bill:hover { border-color: var(--ok); }
.pos-input { font-size: 1.1rem; min-height: 2.9rem; font-variant-numeric: tabular-nums; }
.pos-change { min-height: 2rem; margin: 0.5rem 0; font-size: 1.1rem; color: var(--ink-2); }
.pos-change strong { font-size: 1.6rem; color: var(--ink); }
.pos-go { width: 100%; min-height: 4.25rem; border: 0; border-radius: var(--r-panel); background: var(--ok); color: #fff; font: inherit; font-size: 1.4rem; font-weight: 700; cursor: pointer; }
.pos-go small { font-weight: 500; opacity: 0.8; margin-left: 0.4rem; }
.pos-go:disabled { background: var(--line-strong); color: var(--ink-3); cursor: not-allowed; }
.pos-qty { display: inline-flex; align-items: center; gap: 0.3rem; }
.pos-qty__b { width: 2.5rem; height: 2.5rem; border: 1px solid var(--line-strong); border-radius: var(--r-field); background: var(--surface-2); color: var(--ink); font-size: 1.3rem; font-weight: 700; cursor: pointer; }
.pos-qty__in { width: 4rem; text-align: center; min-height: 2.5rem; }
#pos-cart td { padding-block: 0.7rem; }
.pos-ref { margin-top: 0.35rem; min-height: 2.4rem; font-size: var(--fs-sm); }
.pos-ref2 { display: grid; grid-template-columns: 1fr 1fr; gap: 0.4rem; }
.pos-fields { display: grid; gap: 0.5rem; }

/* Miniature d'article dans les listes, avec aperçu au survol / au toucher */
.thumb-cell { width: 3.25rem; padding-right: 0; }
.thumb { position: relative; display: inline-grid; place-items: center; width: 2.5rem; height: 2.5rem; border-radius: 8px; background: var(--bg); border: 1px solid var(--line, rgba(0,0,0,.08)); color: var(--ink-3, var(--ink-2)); }
.thumb > img:not(.thumb__pop) { width: 100%; height: 100%; object-fit: cover; border-radius: 7px; display: block; }
.thumb__pop { display: none; position: fixed; z-index: 400; width: 14rem; height: 14rem; object-fit: cover; border-radius: 12px; background: var(--surface, #fff); border: 1px solid var(--line, rgba(0,0,0,.12)); box-shadow: 0 10px 30px rgba(0,0,0,.25); pointer-events: none; }
.thumb.is-open .thumb__pop { display: block; }
.thumb:focus { outline: 2px solid var(--cobalt, #3b5bdb); outline-offset: 2px; }
.pk__thumb { vertical-align: middle; margin-right: .5rem; width: 2rem; height: 2rem; }
.pk__thumb .thumb { width: 2rem; height: 2rem; }
.thumb--none { opacity: .55; }

/* Acceptation des conditions */
.terms { min-height: 100vh; display: grid; place-items: center; padding: 1rem; background: var(--bg); }
.terms__card { width: min(52rem, 100%); background: var(--surface, #fff); border: 1px solid var(--line, rgba(0,0,0,.1)); border-radius: 16px; padding: 1.5rem; display: grid; gap: .9rem; }
.terms__box { max-height: 52vh; overflow-y: auto; border: 1px solid var(--line, rgba(0,0,0,.15)); border-radius: 12px; padding: 1rem 1.25rem; background: var(--bg); line-height: 1.55; }
.terms__h { margin-top: 0; padding-top: .5rem; border-top: 2px solid var(--line, rgba(0,0,0,.15)); font-size: 1.15rem; }
.terms__h:first-child { border-top: 0; }
.terms__hint { margin: 0; font-size: .9rem; }
.terms__form { display: grid; gap: .9rem; }
.terms__actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: space-between; }
@media (max-width: 640px) { .terms__box { max-height: 46vh; } .terms__actions .btn { width: 100%; } }

.withthumb { display: flex; align-items: center; gap: .65rem; }
.withthumb > span:last-child { min-width: 0; }
.task > .thumb { flex: none; }

/* Confirmation de promotion */
.promo-done { display: grid; gap: 1rem; }
.promo-done__hero { display: flex; gap: 1rem; align-items: center; padding: 1.1rem 1.25rem; border-radius: 14px; background: #e6f4ea; border: 1px solid #b7dfc3; color: #14532d; }
.promo-done__hero h1 { margin: 0 0 .15rem; font-size: 1.35rem; }
.promo-done__hero p { margin: 0; }
.promo-done__tick { flex: none; display: grid; place-items: center; width: 2.6rem; height: 2.6rem; border-radius: 50%; background: #1b7a3d; color: #fff; }
.promo-done__tick .ico { stroke: #fff; stroke-width: 2.5; }
.promo-done__actions { display: flex; flex-wrap: wrap; gap: .5rem; }
:root[data-theme="dark"] .promo-done__hero { background: #12301d; border-color: #1f5a34; color: #c9efd5; }

/* Suivi des promotions */
.promo__sum { display: flex; flex-wrap: wrap; gap: .5rem 2rem; align-items: baseline; }
.promo__sum strong { font-size: 1.25rem; }
.promo__rev { min-width: 18rem; max-width: 26rem; }
.promo__acts { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .4rem; }

/* Bandeau d'alerte fort (ex. commandes clients à valider) : fond coloré, visible sur toutes les pages. */
.alert-banner { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; padding: 0.9rem 1.1rem; border-radius: var(--r-field); border-left: 6px solid #c2410c; background: #fff1e0; color: #7c2d12; font-size: 1.02rem; box-shadow: 0 2px 10px rgba(194, 65, 12, 0.18); }
.alert-banner .ico { width: 1.4rem; height: 1.4rem; flex: none; color: #c2410c; }
.alert-banner__text { flex: 1; min-width: 14rem; }
.alert-banner .btn { white-space: nowrap; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .alert-banner { background: #3b2312; color: #ffd8b0; border-left-color: #fb923c; } :root:not([data-theme="light"]) .alert-banner .ico { color: #fb923c; } }
:root[data-theme="dark"] .alert-banner { background: #3b2312; color: #ffd8b0; border-left-color: #fb923c; }
:root[data-theme="dark"] .alert-banner .ico { color: #fb923c; }

/* Messages d'action : colorés, avec icône, et toujours visibles même quand la page est défilée. */
.flashes--live { position: sticky; top: 0.75rem; z-index: 60; }
.flash { box-shadow: 0 2px 10px rgba(0, 0, 0, 0.08); align-items: center; }
.flash__icon { flex: none; display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; border-radius: 50%; font-weight: 800; font-size: 0.85rem; color: #fff; background: var(--cobalt); }
.flash--success { background: color-mix(in srgb, var(--ok) 14%, var(--surface)); }
.flash--success .flash__icon { background: var(--ok); }
.flash--error, .flash--danger { background: color-mix(in srgb, var(--bad) 14%, var(--surface)); }
.flash--error .flash__icon, .flash--danger .flash__icon { background: var(--bad); }
.flash--warning { background: color-mix(in srgb, var(--safran) 20%, var(--surface)); }
.flash--warning .flash__icon { background: #c2410c; }
.flash--info { background: color-mix(in srgb, var(--cobalt) 12%, var(--surface)); }

/* Suivi d'une commande (espace client) : étapes de l'envoi à la livraison. */
.steps { display: flex; flex-wrap: wrap; gap: 0.25rem 0; list-style: none; margin: 0.6rem 0 0.2rem; padding: 0; }
.steps__item { flex: 1 1 7rem; position: relative; text-align: center; padding-top: 1.9rem; font-size: 0.85rem; color: var(--muted, #6b7280); min-width: 6rem; }
.steps__item::before { content: attr(data-n); position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 1.5rem; height: 1.5rem; line-height: 1.5rem; border-radius: 50%; background: var(--line); color: var(--muted, #6b7280); font-weight: 700; font-size: 0.8rem; z-index: 1; }
.steps__item::after { content: ""; position: absolute; top: 0.72rem; left: -50%; width: 100%; height: 2px; background: var(--line); }
.steps__item:first-child::after { display: none; }
.steps__item.is-done { color: var(--ink, inherit); }
.steps__item.is-done::before { content: "✓"; background: var(--ok); color: #fff; }
.steps__item.is-done::after { background: var(--ok); }
.steps__item.is-now { font-weight: 700; color: var(--ink, inherit); }
.steps__item.is-now::before { background: var(--cobalt); color: #fff; box-shadow: 0 0 0 4px color-mix(in srgb, var(--cobalt) 25%, transparent); }
.steps__item.is-bad { color: var(--bad); font-weight: 700; }
.steps__item.is-bad::before { content: "✕"; background: var(--bad); color: #fff; }
.steps__item.is-bad::after { background: var(--bad); }
.steps__when { display: block; font-weight: 400; font-size: 0.75rem; color: var(--muted, #6b7280); }
.ordercard { margin-bottom: 1rem; }
.ordercard__head { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; align-items: baseline; justify-content: space-between; }
.ordercard__note { margin: 0.6rem 0 0; padding: 0.5rem 0.75rem; border-radius: var(--r-field); background: color-mix(in srgb, var(--bad) 10%, var(--surface)); }

/* Fenêtre « Nouvel article » (composant partagé) et bouton « Créer cet article » des sélecteurs */
.pk__new { display: flex; flex-direction: column; align-items: flex-start; gap: 0.125rem; width: 100%; margin-top: 0.375rem; padding: 0.625rem 0.75rem; border: 0; border-top: 1px solid rgba(43, 58, 138, 0.25); background: rgba(59, 91, 219, 0.08); color: #2b3a8a; font: inherit; font-weight: 600; text-align: left; cursor: pointer; }
.pk__new span { font-weight: 400; font-size: 0.75rem; opacity: 0.8; }
.pk__new:hover { background: rgba(59, 91, 219, 0.16); }
.qa { width: min(44rem, calc(100vw - 1.5rem)); max-height: calc(100vh - 2rem); padding: 0; border: 1px solid var(--line-strong); border-radius: var(--r-panel); background: var(--surface); color: var(--ink); box-shadow: 0 24px 64px rgba(18, 26, 59, 0.35); overflow: hidden; }
.qa::backdrop { background: rgba(18, 26, 59, 0.55); }
.qa__loading { padding: 2rem; text-align: center; color: var(--ink-3); }
.qa__form { display: flex; flex-direction: column; max-height: calc(100vh - 2rem); }
.qa__head { display: flex; align-items: center; justify-content: space-between; padding: 0.875rem 1.25rem; border-bottom: 1px solid var(--line); }
.qa__title { margin: 0; font-size: var(--fs-lg); }
.qa__body { padding: 1.25rem; overflow-y: auto; display: grid; gap: 1rem; }
.qa__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(13rem, 1fr)); gap: 0.875rem 1rem; align-items: end; }
.qa__grid > .field, .qa__newcat .field { display: flex; flex-direction: column; justify-content: flex-end; gap: 0.375rem; margin: 0; }
.qa__grid > .field > label, .qa__newcat .field > label { margin: 0; line-height: 1.25; }
.qa .input:not([type="checkbox"]), .qa .select { height: 2.75rem; box-sizing: border-box; width: 100%; }
.qa textarea.input { height: auto; }
.qa__sub { margin: 0.25rem 0 0; font-size: var(--fs); color: var(--ink-3); text-transform: uppercase; letter-spacing: 0.04em; }
.qa__hint { margin: 0; }
.qa__error { padding: 0.625rem 0.875rem; border-radius: var(--r-field); border: 1px solid var(--bad); background: rgba(201, 58, 58, 0.08); color: var(--bad); font-size: var(--fs-sm); }
.qa__foot { display: flex; justify-content: flex-end; gap: 0.625rem; padding: 0.875rem 1.25rem; border-top: 1px solid var(--line); background: var(--bg); }
.qa .is-invalid { border-color: var(--bad); box-shadow: 0 0 0 2px rgba(201, 58, 58, 0.18); }
/* création de catégorie dans la fenêtre */
.qa__newcat { display: grid; gap: 0.875rem; padding: 1rem; border: 1px dashed var(--line-strong); border-radius: var(--r-panel); background: var(--bg); }
.qa__newcat[hidden], .qa [data-qa-article][hidden] { display: none; }
.qa__ncrow { display: grid; grid-template-columns: minmax(10rem, 2fr) minmax(8rem, 1fr) auto auto auto; gap: 0.5rem; align-items: center; margin-bottom: 0.5rem; }
.qa__ncrow input[data-f="choices"] { grid-column: 1 / -1; }
.qa__ncfoot { display: flex; flex-wrap: wrap; gap: 0.625rem; justify-content: space-between; }
@media (max-width: 40rem) { .qa__ncrow { grid-template-columns: 1fr 1fr; } }
.qa-toast { position: fixed; z-index: 1000; left: 50%; bottom: 1.5rem; transform: translateX(-50%); padding: 0.625rem 1rem; border-radius: var(--r-field); background: var(--ok); color: #fff; font-size: var(--fs); box-shadow: 0 8px 24px rgba(0, 0, 0, 0.25); transition: opacity 0.4s; }
.qa-toast.is-out { opacity: 0; }

/* Fenêtre « Nouvel article » : aucune marge héritée (.field + .field) ne doit décaler un champ de sa voisine */
.qa .field, .qa .field + .field { margin: 0 !important; }
.qa .qa__grid > .field, .qa .qa__newcat .field { align-self: end; }

/* Indicateur d'état de la TVA (tableau de bord) */
a.kpi--vat { text-decoration: none; color: inherit; }
a.kpi--vat:hover { box-shadow: 0 2px 10px rgba(18, 26, 59, 0.1); }
.kpi__ico { display: inline-flex; align-items: center; justify-content: center; width: 1.5rem; height: 1.5rem; margin-right: 0.25rem; border-radius: 999px; vertical-align: middle; }
.kpi__ico--due { background: rgba(232, 163, 23, 0.2); color: var(--safran-ink); }
.kpi__ico--credit, .kpi__ico--zero { background: rgba(15, 138, 95, 0.15); color: var(--ok); }
.kpi--vat .kpi__value { font-size: 1.25rem; }

/* --- Caisse : vente à crédit --- */
.pos-credit { margin: .75rem 0; }
.pos-credit .pos-key { width: 100%; }
.pos-credit__box { border: 1px solid var(--line-strong); border-radius: var(--r-panel); padding: .75rem; margin-top: .5rem; background: var(--surface); }
.pos-credit__list { display: flex; flex-direction: column; gap: .25rem; margin-top: .4rem; max-height: 14rem; overflow: auto; }
.pos-credit__it { text-align: left; border: 1px solid var(--line); border-radius: .5rem; background: var(--surface); color: var(--ink); font: inherit; padding: .5rem .65rem; cursor: pointer; }
.pos-credit__it:hover, .pos-credit__it:focus-visible { border-color: var(--cobalt); outline: none; }
.pos-credit__chosen { margin-top: .5rem; padding: .5rem .65rem; border-radius: .5rem; background: var(--bg-soft, rgba(0,0,0,.04)); }

/* Relevés, clôture du mois, justificatifs */
.stack-list { list-style: none; margin: 0; padding: 0; }
.stack-list__item { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 0.5rem 1rem; padding: 0.75rem 1.25rem; border-top: 1px solid var(--line); }
.stack-list__item:first-child { border-top: 0; }
.stack-list__item--col { flex-direction: column; align-items: stretch; }
.stack-list__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.4rem; }
.line-head { display: flex; justify-content: space-between; gap: 1rem; align-items: flex-start; }
.row-actions { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin-top: 0.4rem; }
.row-actions .input { flex: 1 1 12rem; min-width: 0; }
.vouchers { display: flex; flex-wrap: wrap; gap: 0.5rem; align-items: center; margin-top: 0.4rem; }
.voucher { display: inline-flex; gap: 0.35rem; align-items: center; padding: 0.15rem 0.6rem; border: 1px solid var(--line); border-radius: 999px; font-size: var(--fs-sm); }
.link-btn { background: none; border: 0; color: var(--bad); cursor: pointer; font-size: 1rem; line-height: 1; padding: 0 0.15rem; }
.inline { display: inline; }
.neg { color: var(--bad); } .pos { color: var(--ok); }

/* ===== Blocs par étape : un écran = quelques blocs numérotés, chacun avec sa couleur ===== */
.blk { --step: var(--cobalt); border-left: 5px solid var(--step); overflow: hidden; margin-top: 1.25rem; }
.blk:first-of-type { margin-top: 0; }
.blk--1 { --step: var(--cobalt); }
.blk--2 { --step: var(--ok); }
.blk--3 { --step: var(--safran); }
.blk--4 { --step: #8a63d2; }
.blk > .panel__head { background: color-mix(in srgb, var(--step) 9%, var(--surface)); align-items: center; padding-bottom: 0.9rem; }
.blk__title { display: flex; align-items: center; gap: 0.7rem; margin: 0; font-size: 1.05rem; }
.blk__num { display: inline-flex; align-items: center; justify-content: center; flex: none; width: 1.7rem; height: 1.7rem; border-radius: 50%; background: var(--step); color: #fff; font-weight: 600; font-size: 0.9rem; }
.blk__sub { display: block; font-weight: 400; font-size: var(--fs-sm); color: var(--ink-2, inherit); opacity: 0.75; }
.blk .panel__body { padding-top: 1rem; }
.blk--ok { border-left-color: var(--ok); } .blk--warn { border-left-color: var(--safran); } .blk--bad { border-left-color: var(--bad); }
@media (min-width: 48rem) { .form-grid--steps { grid-template-columns: repeat(2, minmax(0, 1fr)); } .form-grid--steps3 { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
.group-title { display: flex; align-items: center; gap: 0.75rem; margin: 2.25rem 0 0.9rem; font-size: 1.2rem; scroll-margin-top: 5rem; --step: var(--cobalt); }
.group-title--1 { --step: var(--cobalt); } .group-title--2 { --step: var(--ok); } .group-title--3 { --step: var(--safran); } .group-title--4 { --step: #8a63d2; }
.group-title .blk__num { background: var(--step); }
.group-nav { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 1rem; }
.group-nav a { padding: 0.35rem 0.85rem; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); font-size: var(--fs-sm); text-decoration: none; color: inherit; }
.group-nav a:hover { border-color: var(--cobalt); color: var(--cobalt); }
.blk > .panel__foot { background: transparent; }

/* Fenêtre « Stock » (stock-picker.js) */
.sp { position: fixed; inset: 0; z-index: 120; display: flex; align-items: flex-start; justify-content: center; padding: 4vh 1rem 1rem; background: rgba(18, 26, 59, .45); }
.sp__box { display: flex; flex-direction: column; width: min(46rem, 100%); max-height: 90vh; border-radius: 12px; background: var(--surface, #fff); box-shadow: 0 20px 50px rgba(0, 0, 0, .35); overflow: hidden; }
.sp__head { display: flex; align-items: center; gap: .75rem; padding: .75rem 1rem; border-bottom: 1px solid var(--line, #e5e7eb); }
.sp__q { flex: 1; min-width: 0; }
.sp__hint { padding: .375rem 1rem; font-size: var(--fs-sm, .8125rem); color: var(--ink-3, #667); background: var(--surface-2, #f6f7f9); }
.sp__hint.is-ok { color: var(--ok, #1b7a3d); }
.sp__body { flex: 1; overflow-y: auto; padding: .375rem .5rem 1rem; outline: 0; }
.sp__sec { position: sticky; top: 0; z-index: 1; margin: .375rem 0 .25rem; padding: .375rem .5rem; font-size: var(--fs-sm, .8125rem); font-weight: 600; color: var(--ink-2, #334); background: var(--surface, #fff); }
.sp__sec--promo { color: #8a3b00; background: #fff1e0; border-radius: 6px; }
.sp__it { display: grid; grid-template-columns: 1fr auto; grid-template-areas: "main side" "sub side"; gap: .125rem .75rem; width: 100%; margin: 0 0 .25rem; padding: .5rem .75rem; text-align: left; font: inherit; color: inherit; border: 1px solid var(--line, #e5e7eb); border-radius: 8px; background: var(--surface, #fff); cursor: pointer; }
.sp__it:hover, .sp__it.is-on { border-color: #3b5bdb; background: #f3f6ff; }
.sp__it--promo { border-color: #f0b46a; background: #fffaf3; }
.sp__it.is-flash { background: #e6f4ea; border-color: #1b7a3d; }
.sp__main { grid-area: main; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sp__main em { font-style: normal; color: var(--ink-3, #667); }
.sp__sub { grid-area: sub; font-size: var(--fs-sm, .8125rem); color: var(--ink-3, #667); }
.sp__side { grid-area: side; display: flex; flex-direction: column; align-items: flex-end; justify-content: center; gap: .125rem; font-size: var(--fs-sm, .8125rem); }
.sp__old { text-decoration: line-through; color: var(--ink-3, #667); }
.sp__promo { padding: 0 .4rem; border-radius: 999px; font-size: .75rem; font-weight: 600; color: #8a3b00; background: #ffe2c2; }
.sp__qty { margin-left: .5rem; padding: 0 .4rem; border-radius: 999px; font-size: .75rem; font-weight: 600; color: #1b7a3d; background: #e6f4ea; }
.sp__none { padding: .75rem; font-size: var(--fs-sm, .8125rem); color: var(--ink-3, #667); }
body.sp-open { overflow: hidden; }
.sp-btn { white-space: nowrap; }

.scanbar__row { display: flex; gap: .5rem; align-items: center; }
.scanbar__row .input { flex: 1; min-width: 0; }

/* Prix pris (statut du client, promotion) et prix des autres statuts */
.pk__lv, .sp__lv { padding: 0 .4rem; border-radius: 999px; font-size: .75rem; font-weight: 600; color: #1d4ed8; background: #dbeafe; }
.pk__lv--promo { color: #8a3b00; background: #ffe2c2; }
.line__src { display: block; margin-top: .25rem; font-size: .75rem; line-height: 1.3; color: var(--ink-3, #667); }
.line__src .src-chip { display: inline-block; padding: 0 .4rem; border-radius: 999px; font-weight: 600; color: #1d4ed8; background: #dbeafe; }
.line__src .src-chip--promo { color: #8a3b00; background: #ffe2c2; }
.line__src .src-chip--hand { color: #8a5a00; background: #fdf1d6; }
.status-note { margin: .375rem 0 0; font-size: var(--fs-sm, .8125rem); color: var(--ink-2, #334); }

