:root {
  --teal: #1f7a4d;
  --teal-dark: #155f3a;
  --teal-soft: #e8f3ec;
  --green-night: #153d2e;
  --green-night-2: #27684c;
  --header-bg: #143d2e;
  --header-bg-2: #276b4e;
  --header-ink: #f8fcf9;
  --header-muted: #c9dfd1;
  --header-border: rgba(208, 163, 90, .52);
  --header-hover: rgba(255, 255, 255, .08);
  --gold: #986327;
  --gold-bright: #d0a35a;
  --gold-soft: #f7efe3;
  --info: #356f9f;
  --info-dark: #285a83;
  --info-soft: #eaf2f9;
  --info-line: #bfd4e5;
  --ink: #182620;
  --muted: #46574e;
  --line: #dbe5de;
  --canvas: #f4f7f5;
  --white: #ffffff;
  --danger: #b23b2e;
  --danger-soft: #f9ece9;
  --warning: #b6791f;
  --warning-soft: #f9f2dd;
  --shadow: 0 1px 2px rgba(20, 46, 33, .035), 0 14px 34px rgba(20, 46, 33, .065);
  --font-display: "Segoe UI Variable Display", "Segoe UI Light", "Segoe UI Semilight", "Segoe UI", sans-serif;
  --font-body: "Segoe UI", ui-sans-serif, system-ui, sans-serif;
  font-family: var(--font-body);
}

:root[data-theme="dark"] {
  --teal: #33b26a;
  --teal-dark: #6fd39a;
  --teal-soft: rgba(51, 178, 106, .16);
  --header-bg: #183326;
  --header-bg-2: #214430;
  --header-ink: #f3f8f4;
  --header-muted: #c0d1c5;
  --header-border: #47765a;
  --header-hover: rgba(255, 255, 255, .08);
  --gold: #d68f4d;
  --gold-bright: #e5a869;
  --gold-soft: rgba(214, 143, 77, .14);
  --info: #80b7df;
  --info-dark: #a9d0eb;
  --info-soft: rgba(83, 151, 199, .16);
  --info-line: #355a72;
  --ink: #e7ede8;
  --muted: #a9bcae;
  --line: #2b4636;
  --canvas: #0f1c17;
  --white: #16281f;
  --danger: #e2897b;
  --danger-soft: rgba(226, 137, 123, .16);
  --warning: #e0a94f;
  --warning-soft: rgba(224, 169, 79, .16);
  --shadow: 0 1px 0 rgba(255, 255, 255, .03), 0 20px 46px rgba(0, 0, 0, .44);
  --scrollbar-thumb: #395743;
  color-scheme: dark;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --teal: #33b26a;
    --teal-dark: #6fd39a;
    --teal-soft: rgba(51, 178, 106, .16);
    --header-bg: #183326;
    --header-bg-2: #214430;
    --header-ink: #f3f8f4;
    --header-muted: #c0d1c5;
    --header-border: #47765a;
    --header-hover: rgba(255, 255, 255, .08);
    --gold: #d68f4d;
    --gold-bright: #e5a869;
    --gold-soft: rgba(214, 143, 77, .14);
    --info: #80b7df;
    --info-dark: #a9d0eb;
    --info-soft: rgba(83, 151, 199, .16);
    --info-line: #355a72;
    --ink: #e7ede8;
    --muted: #a9bcae;
    --line: #2b4636;
    --canvas: #0f1c17;
    --white: #16281f;
    --danger: #e2897b;
    --danger-soft: rgba(226, 137, 123, .16);
    --warning: #e0a94f;
    --warning-soft: rgba(224, 169, 79, .16);
    --shadow: 0 1px 0 rgba(255, 255, 255, .03), 0 20px 46px rgba(0, 0, 0, .44);
    --scrollbar-thumb: #395743;
    color-scheme: dark;
  }
}

* { box-sizing: border-box; }
html, body { max-width: 100%; overflow-x: hidden; }
body { margin: 0; color: var(--ink); background: var(--canvas); }
img, svg, video, canvas { max-width: 100%; }
a { color: var(--teal-dark); text-decoration: none; }
button, input { font: inherit; }

.topbar {
  height: 68px; padding: 0 28px; display: flex; align-items: center; gap: 28px;
  color: white; background: linear-gradient(110deg, #0a958a, #16b8a7);
  position: sticky; top: 0; z-index: 10; box-shadow: 0 2px 14px rgba(4, 80, 73, .18);
}
.brand { display: flex; align-items: center; gap: 10px; min-width: 180px; color: white; }
.brand-mark {
  width: 38px; height: 38px; display: grid; place-items: center; border-radius: 13px;
  font-weight: 800; background: var(--white); color: var(--teal); transform: rotate(-5deg);
}
.brand strong, .brand small { display: block; line-height: 1.15; }
.brand small { opacity: .78; font-size: 10px; margin-top: 2px; letter-spacing: .04em; }
nav { display: flex; align-items: stretch; align-self: stretch; overflow: hidden; }
nav a { color: rgba(255,255,255,.84); padding: 0 14px; display: grid; place-items: center; font-size: 14px; font-weight: 600; border-bottom: 3px solid transparent; }
nav a:hover, nav a.active { color: white; border-bottom-color: white; background: rgba(255,255,255,.08); }
.user-chip { margin-left: auto; display: flex; align-items: center; gap: 8px; font-size: 13px; white-space: nowrap; }
.user-chip > span:first-child { width: 32px; height: 32px; display: grid; place-items: center; background: rgba(255,255,255,.2); border: 1px solid rgba(255,255,255,.35); border-radius: 50%; font-weight: 700; }
.user-chip small { display: block; opacity: .75; font-size: 10px; }
.logout-button { border: 1px solid rgba(255,255,255,.4); border-radius: 8px; padding: 6px 8px; color: white; background: transparent; cursor: pointer; }
.logout-button:hover { background: rgba(255,255,255,.12); }
.menu-toggle { display: none; margin-left: auto; border: 0; background: transparent; color: white; font-size: 24px; }
.user-menu { margin-left: auto; position: relative; }
.user-menu > summary { list-style: none; cursor: pointer; }
.user-menu > summary::-webkit-details-marker { display: none; }
.user-menu-panel {
  position: absolute; right: 0; top: calc(100% + 12px); width: 240px;
  display: grid; padding: 9px; color: var(--ink); background: var(--white);
  border: 1px solid var(--line); border-radius: 13px; box-shadow: var(--shadow);
}
.user-menu-panel a, .user-menu-panel button {
  width: 100%; min-height: 38px; padding: 9px 11px; display: flex;
  align-items: center; border: 0; border-radius: 8px; color: var(--ink);
  background: transparent; text-align: left; font-weight: 650;
}
.user-menu-panel a:hover, .user-menu-panel button:hover { background: var(--teal-soft); }
.user-menu-panel .logout-button { color: var(--danger); }
.user-menu-title { margin: 4px 11px 7px; color: var(--muted); font-size: 11px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; }

.shell { width: 100%; max-width: 1400px; min-width: 0; margin: 0 auto; padding: 40px 34px 70px; }
.page-heading { display: flex; justify-content: space-between; gap: 28px; align-items: flex-end; margin-bottom: 26px; }
.page-heading h1 { font-size: clamp(28px, 4vw, 42px); line-height: 1.08; margin: 4px 0 8px; letter-spacing: -.035em; }
.page-heading p { margin: 0; color: var(--muted); }
.eyebrow { color: var(--teal-dark) !important; font-size: 12px; text-transform: uppercase; letter-spacing: .12em; font-weight: 800; }
.heading-actions { display: flex; gap: 10px; }

.button { border: 1px solid transparent; padding: 11px 17px; border-radius: 11px; font-weight: 700; cursor: pointer; display: inline-flex; gap: 10px; align-items: center; justify-content: center; }
.button.primary { color: white; background: var(--teal); }
.button.primary:hover { background: var(--teal-dark); }
.button.secondary { color: var(--ink); background: var(--white); border-color: var(--line); }
.button:disabled { opacity: .45; cursor: not-allowed; }
kbd { font-size: 11px; border: 1px solid rgba(100,114,122,.25); border-radius: 5px; padding: 2px 5px; box-shadow: 0 1px 0 rgba(0,0,0,.08); background: rgba(255,255,255,.5); }

.stat-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 16px; margin-bottom: 20px; }
.stat-card { min-height: 112px; background: var(--white); border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); padding: 20px; display: flex; gap: 14px; align-items: center; }
.stat-card.accent { background: var(--teal); border-color: var(--teal); color: white; }
.stat-card.warning { background: var(--warning-soft); border-color: #f0dfb4; }
.stat-icon { flex: 0 0 auto; width: 38px; height: 38px; border-radius: 12px; display: grid; place-items: center; background: var(--teal-soft); color: var(--teal-dark); font-size: 20px; font-weight: 800; }
.accent .stat-icon { background: rgba(255,255,255,.18); color: white; }
.warning .stat-icon { background: #f5dfaa; color: var(--warning); }
.stat-card small, .stat-card strong { display: block; }
.stat-card small { color: var(--muted); margin-bottom: 5px; }
.accent small { color: rgba(255,255,255,.75); }
.stat-card strong { font-size: 24px; letter-spacing: -.03em; }

.dashboard-grid, .detail-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 20px; margin-bottom: 20px; }
.dashboard-grid > *, .detail-grid > * { min-width: 0; }
.panel { min-width: 0; max-width: 100%; background: var(--white); border: 1px solid var(--line); border-radius: 17px; padding: 22px; box-shadow: var(--shadow); margin-bottom: 20px; }
.panel-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 18px; }
.panel-heading h2 { margin: 2px 0 0; font-size: 19px; letter-spacing: -.02em; }
.panel-heading a, .panel-heading span { font-size: 13px; }
.narrow-panel { max-width: 720px; }
.row-actions { display: flex; flex-wrap: wrap; gap: 7px; }
.list-row, .data-row {
  display: flex; justify-content: space-between; gap: 18px; padding: 12px 0;
  border-bottom: 1px solid var(--line); color: var(--ink);
}
.list-row:last-child, .data-row:last-child { border-bottom: 0; }
.list-row strong, .list-row small { display: block; }
.list-row small { margin-top: 3px; color: var(--muted); }
.shortcut-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 11px; }
.shortcut-grid a { min-height: 88px; border: 1px solid var(--line); color: var(--ink); border-radius: 13px; padding: 14px; display: grid; grid-template-columns: 34px 1fr auto; gap: 10px; align-items: center; }
.shortcut-grid a:hover { border-color: #8acfc8; background: var(--teal-soft); }
.shortcut-grid a > span { font-size: 23px; }
.shortcut-grid strong { font-size: 14px; }
.alert-summary { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.alert-summary > div { padding: 14px; border-radius: 12px; background: var(--danger-soft); }
.alert-summary strong, .alert-summary span { display: block; }
.alert-summary strong { color: var(--danger); font-size: 24px; }
.alert-summary span { color: var(--muted); font-size: 12px; }
.alert-list, .lot-list { list-style: none; margin: 14px 0 0; padding: 0; }
.alert-list li, .lot-list li { padding: 11px 0; display: flex; justify-content: space-between; gap: 20px; border-top: 1px solid var(--line); font-size: 13px; }
.alert-list span { color: var(--danger); }
.company-strip { display: grid; grid-template-columns: repeat(3, 1fr) auto; align-items: center; }
.company-strip > div { border-right: 1px solid var(--line); padding-left: 20px; }
.company-strip > div:first-child { padding-left: 0; }
.company-strip small, .company-strip strong { display: block; }
.company-strip small { color: var(--muted); }
.company-strip strong { font-size: 22px; }

.searchbar { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin-bottom: 18px; }
.searchbar label { font-weight: 800; }
.searchbar > div { display: flex; align-items: center; gap: 10px; flex: 1; max-width: 680px; }
.searchbar input { flex: 1; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; outline: none; }
.searchbar input:focus { border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft); }
.table-wrap { width: 100%; min-width: 0; max-width: 100%; overflow-x: visible; }
table { width: 100%; max-width: 100%; border-collapse: collapse; }
th { color: var(--muted); text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .07em; border-bottom: 1px solid var(--line); padding: 11px 12px; }
th, td { min-width: 0; overflow-wrap: anywhere; word-break: normal; }
td { padding: 13px 12px; border-bottom: 1px solid #edf0f1; font-size: 14px; vertical-align: middle; }
tbody tr:hover { background: #f8fbfb; }
td small, .entity-name { display: block; }
td small { color: var(--muted); margin-top: 3px; }
.entity-name { font-weight: 750; color: var(--ink); }
.money { white-space: nowrap; font-variant-numeric: tabular-nums; }
.badge, .stock-pill { display: inline-block; border-radius: 100px; padding: 5px 9px; font-size: 12px; font-weight: 750; }
.success { color: var(--teal-dark); background: var(--teal-soft); }
.danger { color: var(--danger); background: var(--danger-soft); }
.warning { color: #775207; background: #fff1c9; }
.suggestion-grid { display: grid; gap: 16px; }
.decision-form { display: grid; gap: 12px; margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.decision-form label { display: grid; gap: 6px; }
.result-note { color: var(--muted); font-size: 12px; margin: 14px 0 0; }
.empty { padding: 45px 20px; display: grid; gap: 5px; place-items: center; text-align: center; color: var(--muted); border: 1px dashed #cfd8da; border-radius: 13px; }
.empty strong { color: var(--ink); }
.empty.compact { padding: 22px 12px; }
.muted-note { color: var(--muted); margin: -8px 0 12px; font-size: 13px; }

.back-link { display: inline-block; margin-bottom: 20px; }
.product-heading { align-items: center; }
.stock-pill { font-size: 14px; padding: 9px 13px; }
.detail-list { margin: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 16px 24px; }
.detail-list div { min-width: 0; }
.detail-list dt { color: var(--muted); font-size: 12px; margin-bottom: 4px; }
.detail-list dd { margin: 0; font-weight: 650; overflow-wrap: anywhere; }
.detail-list.wide { grid-template-columns: repeat(2, 1fr); }
.lot-list li > div:last-child { text-align: right; }
.lot-list strong, .lot-list span { display: block; }
.lot-list span { color: var(--muted); font-size: 12px; margin-top: 2px; }

.module-stage { min-height: 380px; display: grid; place-content: center; text-align: center; justify-items: center; }
.module-stage h2 { margin: 14px 0 5px; }
.module-stage p { max-width: 580px; margin: 4px 0; color: var(--muted); }
.module-icon { width: 70px; height: 70px; border-radius: 22px; display: grid; place-items: center; color: var(--teal); background: var(--teal-soft); font-size: 36px; }
.muted { color: var(--muted); font-size: 13px; }
.module-nav, .purchase-nav {
  min-height: 46px; height: auto; align-self: auto; display: flex; flex-wrap: wrap;
  margin: -8px 0 20px; padding: 5px; overflow: visible;
  background: var(--white); border: 1px solid var(--line); border-radius: 13px;
  box-shadow: var(--shadow);
}
.module-nav a, .purchase-nav a {
  min-height: 36px; padding: 7px 13px; color: var(--muted);
  border: 0; border-radius: 9px; font-size: 13px;
}
.module-nav a:hover, .module-nav a.active,
.purchase-nav a:hover, .purchase-nav a.active {
  color: var(--teal-dark); background: var(--teal-soft); border: 0;
}
.nav-count {
  display: inline-grid; min-width: 18px; height: 18px; place-items: center;
  margin-left: 4px; padding: 0 5px; color: white; background: var(--teal);
  border-radius: 99px; font-size: 11px; font-weight: 800;
}
.stacked-form { display: grid; gap: 13px; }
.stacked-form label {
  display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750;
}
.stacked-form input, .stacked-form select, .stacked-form textarea,
.search-results + label select {
  width: 100%; min-height: 42px; padding: 9px 10px; color: var(--ink);
  border: 1px solid var(--line); border-radius: 9px; background: var(--white); font: inherit;
}
.stacked-form textarea { min-height: 130px; resize: vertical; }
.search-results {
  display: grid; gap: 8px; margin-top: -4px;
}
.search-result {
  width: 100%; padding: 10px 12px; display: block; color: var(--ink);
  text-align: left; background: var(--white); border: 1px solid var(--line);
  border-radius: 9px; cursor: pointer;
}
.search-result:hover { border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft); }
.search-result strong, .search-result small { display: block; }
.search-result small { margin-top: 3px; color: var(--muted); }
.scanner-layout {
  display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
  gap: 20px; align-items: start;
}
.scanner-pane {
  min-height: 420px; display: grid; gap: 14px; align-content: start;
}
.scanner-pane video {
  width: 100%; aspect-ratio: 16 / 10; object-fit: cover; background: #182322;
  border: 1px solid var(--line); border-radius: 12px;
}
.scanner-actions { display: flex; gap: 10px; flex-wrap: wrap; }
.scanner-side { margin-bottom: 0; }
.scanner-side input {
  width: 100%; min-height: 44px; padding: 10px 11px; border: 1px solid var(--line);
  border-radius: 9px; font: inherit;
}
.warning-text { color: var(--warning); font-weight: 800; }
.kpi-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; margin-bottom: 20px; }
.kpi-grid.compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.kpi-card { min-width: 0; padding: 18px; background: var(--white); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); }
.kpi-card span, .kpi-card strong { display: block; }
.kpi-card span { margin-bottom: 5px; color: var(--muted); font-size: 12px; }
.kpi-card strong { overflow-wrap: anywhere; font-size: 21px; }
.wide-left { grid-template-columns: minmax(0, 1.55fr) minmax(300px, .45fr); }
.filter-bar, .inline-form, .payment-row {
  display: flex; flex-wrap: wrap; align-items: end; gap: 12px; margin-bottom: 18px;
}
.filter-bar label, .inline-form label, .stack-form label, .payment-row label {
  min-width: 0; display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750;
}
.filter-bar input, .filter-bar select, .inline-form input, .inline-form select,
.stack-form input, .stack-form select, .stack-form textarea,
.payment-row input, .payment-row select {
  width: 100%; min-height: 42px; padding: 9px 11px; color: var(--ink);
  background: var(--white); border: 1px solid var(--line); border-radius: 9px; font: inherit;
}
.stack-form { display: grid; gap: 14px; }
.inline-form .grow { flex: 1 1 320px; position: relative; }
.payment-row > label { flex: 1 1 180px; }
.permission-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.permission-card { display: flex; gap: 10px; align-items: start; padding: 13px; border: 1px solid var(--line); border-radius: 11px; }
.permission-card input { margin-top: 3px; accent-color: var(--teal); }
.permission-card strong, .permission-card small { display: block; }
.permission-card small { margin-top: 3px; color: var(--muted); }
.autocomplete-results {
  position: absolute; z-index: 8; left: 0; right: 0; top: 100%;
  max-height: 320px; overflow-y: auto; background: var(--white); border: 1px solid var(--line);
  border-radius: 10px; box-shadow: var(--shadow);
}
.autocomplete-results:empty { display: none; }
.autocomplete-results button { width: 100%; padding: 10px 12px; display: block; border: 0; border-bottom: 1px solid var(--line); background: var(--white); text-align: left; cursor: pointer; }
.autocomplete-results button:hover { background: var(--teal-soft); }

.ocr-inline-header-form { display: grid; gap: 14px; }
.ocr-header-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.ocr-table-wrap { overflow: visible; }
.ocr-inline-table { min-width: 0; table-layout: auto; }
.ocr-inline-table thead {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap;
}
.ocr-inline-table tbody { display: grid; gap: 12px; }
.ocr-inline-table tr {
  display: grid;
  grid-template-columns:
    minmax(250px, 3fr) minmax(120px, 1.25fr) minmax(145px, 1.4fr)
    minmax(70px, .7fr) minmax(110px, 1.05fr) minmax(70px, .65fr)
    minmax(95px, .9fr) minmax(82px, .75fr);
  gap: 14px;
  padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: #f9fbfb;
}
.ocr-inline-table td { min-width: 0; padding: 0; border: 0; vertical-align: top; overflow-wrap: normal; }
.ocr-inline-table td::before {
  content: attr(data-label); display: block; margin-bottom: 5px; color: var(--muted);
  font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
}
.ocr-inline-table td:nth-child(n+4) { white-space: nowrap; }
.ocr-draft-actions {
  position: sticky; bottom: 12px; z-index: 6; display: flex; align-items: center;
  justify-content: space-between; gap: 18px; margin-top: 14px; padding: 13px 15px;
  border: 1px solid #B8DDD8; border-radius: 12px; background: #F3FBFA;
  box-shadow: 0 8px 24px rgb(19 54 59 / 12%);
}
.ocr-draft-actions strong, .ocr-draft-actions small { display: block; }
.ocr-draft-actions small { margin-top: 3px; color: var(--muted); }
.ocr-inline-input {
  width: 100%; min-width: 90px; padding: 8px 9px; border: 1px solid transparent;
  border-radius: 8px; background: transparent; color: var(--ink);
}
.ocr-inline-input:hover { border-color: var(--line); background: var(--white); }
.ocr-inline-input:focus { border-color: var(--teal); background: var(--white); box-shadow: 0 0 0 3px var(--teal-soft); outline: 0; }
.ocr-number-input { min-width: 82px; text-align: right; }
.ocr-product-cell { min-width: 0; }
.ocr-product-picker { position: relative; }
.ocr-product-input { min-width: 0; font-weight: 700; }
.ocr-product-results {
  position: absolute; z-index: 30; top: calc(100% + 4px); left: 0; width: min(480px, 80vw);
  max-height: 290px; overflow-y: auto; border-radius: 10px; box-shadow: 0 16px 40px rgb(15 23 42 / 20%);
}
.ocr-product-results button { display: grid; gap: 3px; }
.ocr-product-picker > small { display: block; margin-top: 5px; color: var(--muted); line-height: 1.25; }
.exceptional-receipt-form { max-width: 1100px; }
.exceptional-receipt-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.exceptional-product-picker { position: relative; max-width: 720px; }
.exceptional-product-picker .autocomplete-results {
  position: absolute; z-index: 25; top: 72px; left: 0; right: 0;
  max-height: 300px; overflow-y: auto; box-shadow: 0 16px 40px rgb(15 23 42 / 20%);
}
.exceptional-total { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; border-radius: 10px; background: var(--teal-soft); }
.exceptional-total strong { font-size: 1.15rem; }
.exceptional-confirmation { padding: 12px; border: 1px solid var(--warning); border-radius: 10px; background: #fffaf0; }
.exceptional-receipt-panel { border-top: 4px solid var(--warning); }

@media (max-width: 850px) {
  .ocr-header-fields { grid-template-columns: 1fr; }
  .exceptional-receipt-grid { grid-template-columns: 1fr; }
}
.autocomplete-results small { display: block; margin-top: 3px; color: var(--muted); }
.import-box { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line); }
.import-box summary { cursor: pointer; color: var(--teal-dark); font-weight: 750; }
.document-header { display: flex; justify-content: space-between; gap: 24px; padding-bottom: 22px; border-bottom: 2px solid var(--teal); }
.document-header > div:last-child { text-align: right; }
.document-header strong, .document-header small { display: block; }
.document-header h2 { margin: 0 0 6px; }
.document-totals { max-width: 380px; margin: 24px 0 0 auto; }
.document-totals div { display: flex; justify-content: space-between; gap: 20px; padding: 8px 0; border-bottom: 1px solid var(--line); }
.document-totals dd { margin: 0; font-weight: 800; }
@media print {
  .topbar, .no-print, .print-hidden, .flash-stack, .module-nav { display: none !important; }
  body, .shell { background: var(--white); padding: 0; }
  .printable-document { border: 0; box-shadow: none; }
  .batch-print-document { break-after: page; border: 0; box-shadow: none; }
  .batch-print-document:last-child { break-after: auto; }
}

.flash-stack { display: grid; gap: 8px; margin-bottom: 18px; }
.flash { padding: 12px 15px; border-radius: 11px; border: 1px solid var(--line); background: var(--white); box-shadow: var(--shadow); font-weight: 650; }
.flash.success { color: var(--teal-dark); border-color: #b8ded9; background: var(--teal-soft); }
.flash.error { color: var(--danger); border-color: #efc5c1; background: var(--danger-soft); }

/* Poste de vente */
.sale-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 1fr);
  gap: 20px;
  align-items: start;
}
.sale-workspace-main, .sale-workspace-side { min-width: 0; }
.sale-workspace-side { position: sticky; top: 88px; }
.sale-section .panel-heading > div { min-width: 0; }
.section-kicker {
  margin: 0 0 4px; color: var(--teal-dark); font-size: 11px;
  font-weight: 800; letter-spacing: .09em; text-transform: uppercase;
}
.sale-form-grid {
  display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 14px 16px;
}
.sale-form-grid label, .sale-note-field, .sale-product-inputs label {
  min-width: 0; display: grid; gap: 6px; color: var(--muted);
  font-size: 12px; font-weight: 750;
}
.sale-form-grid input, .sale-form-grid select, .sale-note-field textarea,
.sale-product-inputs input {
  width: 100%; min-height: 44px; padding: 10px 12px; color: var(--ink);
  background: var(--white); border: 1px solid var(--line); border-radius: 10px;
  outline: none; font: inherit;
}
.sale-form-grid input:focus, .sale-form-grid select:focus,
.sale-note-field textarea:focus, .sale-product-inputs input:focus {
  border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft);
}
.sale-form-grid .span-2 { grid-column: span 2; }
.field-help { color: var(--muted); font-weight: 500; }
.sale-details {
  margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line);
}
.sale-details summary {
  margin-bottom: 14px; color: var(--teal-dark); cursor: pointer;
  font-size: 13px; font-weight: 750;
}
.sale-product-inputs {
  display: grid; grid-template-columns: minmax(210px, .8fr) minmax(300px, 1.4fr) 105px auto;
  gap: 12px; align-items: end;
}
.product-search-field { position: relative; }
.input-with-icon { position: relative; display: block; }
.input-with-icon > span:first-child {
  position: absolute; z-index: 1; left: 12px; top: 50%;
  transform: translateY(-50%); color: var(--teal-dark); font-size: 18px;
  pointer-events: none;
}
.input-with-icon input { padding-left: 39px; }
.sale-product-results { top: calc(100% + 5px); }
.sale-product-result-heading {
  display: flex; justify-content: space-between; gap: 12px; align-items: center;
}
.sale-product-result-heading strong { color: var(--ink); }
.sale-product-result-tags {
  display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px;
}
.mini-badge {
  display: inline-flex; align-items: center; min-height: 22px;
  padding: 3px 7px; color: var(--teal-dark); background: var(--teal-soft);
  border: 1px solid #b8ded9; border-radius: 999px;
  font-size: 11px; font-weight: 800;
}
.autocomplete-results .sale-product-result {
  padding: 12px 13px; border-bottom: 1px solid var(--line);
}
.autocomplete-results .sale-product-result small { line-height: 1.4; }
.autocomplete-results .sale-product-result:last-child { border-bottom: 0; }
.selected-product-card {
  margin-top: 14px; padding: 13px 14px; display: grid;
  grid-template-columns: 34px minmax(0, 1fr) auto; gap: 11px;
  align-items: center; border: 1px solid #b8ded9;
  border-radius: 12px; background: var(--teal-soft);
}
.selected-product-card[hidden] { display: none; }
.selected-product-icon {
  width: 32px; height: 32px; display: grid; place-items: center;
  color: white; background: var(--teal); border-radius: 50%; font-weight: 900;
}
.selected-product-card strong, .selected-product-card small { display: block; }
.selected-product-card small { margin-top: 3px; color: var(--muted); }
.sale-search-status { margin: 12px 0 0; color: var(--muted); font-size: 12px; }
.sale-search-status[data-tone="success"] { color: var(--teal-dark); }
.sale-search-status[data-tone="warning"] { color: var(--warning); }
.sale-summary-list { margin: 0; display: grid; }
.sale-summary-list > div {
  display: flex; justify-content: space-between; gap: 14px;
  padding: 11px 0; border-bottom: 1px solid var(--line);
}
.sale-summary-list > div:last-child { border-bottom: 0; }
.sale-summary-list dt { color: var(--muted); font-size: 12px; }
.sale-summary-list dd { margin: 0; text-align: right; font-size: 13px; font-weight: 750; }
.sale-alert {
  margin: 15px 0; padding: 11px 12px; color: #775207;
  background: var(--warning-soft); border-radius: 10px; font-size: 12px;
}
.sale-submit-card p { margin: 0 0 15px; color: var(--muted); line-height: 1.5; }
.sale-submit-card small {
  display: block; margin-top: 11px; color: var(--muted); text-align: center;
}
.button.full-width { width: 100%; }
.button.compact { min-height: 34px; padding: 7px 10px; font-size: 12px; }
.sale-submit { min-height: 50px; }

/* Construction d'une nouvelle vente */
.sale-search-panel { padding: 20px; }
.sale-search-console {
  display: grid; grid-template-columns: minmax(130px, .42fr) minmax(300px, 1.58fr);
  gap: 12px; align-items: end;
}
.sale-search-console label, .sale-discount-field > label {
  min-width: 0; display: grid; gap: 6px; color: var(--muted);
  font-size: 12px; font-weight: 750;
}
.sale-search-console input, .sale-search-console select,
.sale-discount-control input, .sale-discount-control select {
  width: 100%; min-height: 44px; padding: 10px 12px; color: var(--ink);
  background: var(--white); border: 1px solid var(--line); border-radius: 8px;
  outline: none; font: inherit;
}
.sale-search-console input:focus, .sale-search-console select:focus,
.sale-discount-control input:focus, .sale-discount-control select:focus {
  border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft);
}
.sale-unified-search { position: relative; }
.sale-search-control {
  min-width: 0; display: grid; grid-template-columns: 44px minmax(0, 1fr);
}
.sale-search-icon {
  min-height: 44px; display: grid; place-items: center; color: var(--teal-dark);
  background: #f7fafb; border: 1px solid var(--line); border-right: 0;
  border-radius: 8px 0 0 8px; font-size: 16px; line-height: 1;
}
.sale-search-control input {
  min-width: 0; padding-left: 12px; border-radius: 0 8px 8px 0;
}
.sale-search-feedback {
  min-height: 24px; margin-top: 9px; display: flex; justify-content: space-between;
  gap: 18px; color: var(--muted); font-size: 11px;
}
.sale-search-feedback small, .sale-search-feedback p { margin: 0; }
.sale-search-labels { margin: 2px 0 0; color: var(--muted); font-size: 11px; }
.sale-discount-field { min-width: 0; }
.sale-discount-control {
  width: min(100%, 290px); display: grid; grid-template-columns: minmax(0, 1fr) 74px;
}
.sale-discount-control input { border-radius: 8px 0 0 8px; }
.sale-discount-control select { border-left: 0; border-radius: 0 8px 8px 0; }
.sale-cart-column { min-width: 0; }
.new-sale-cart { background: #f7fafb; border-radius: 8px; }
.new-sale-cart .transaction-cart-header { padding: 18px 20px 14px; }
.new-sale-cart-head {
  min-height: 36px; padding: 8px 43px 8px 18px; display: grid;
  grid-template-columns: minmax(0, 1fr) 118px 100px 26px; gap: 10px;
  align-items: center; color: var(--muted); background: #edf3f4;
  border-bottom: 1px solid var(--line); font-size: 10px; font-weight: 800;
  text-transform: uppercase;
}
.new-sale-cart-head span:nth-child(2),
.new-sale-cart-head span:nth-child(3) { text-align: right; }
.new-sale-cart .transaction-cart-lines { max-height: min(54vh, 560px); }
.new-sale-cart-empty {
  min-height: 150px; margin: 0; padding: 34px 18px; display: grid;
  place-content: center; gap: 6px; text-align: center; color: var(--muted);
  background: var(--white); border: 0; border-radius: 0;
}
.new-sale-cart-empty strong { color: var(--ink); }
.new-sale-cart-line {
  position: relative; min-height: 108px; padding: 14px 43px 14px 18px;
  display: grid; grid-template-columns: minmax(0, 1fr) 118px 100px 26px;
  gap: 10px; align-items: center; background: var(--white); border-bottom: 1px solid var(--line);
}
.new-sale-cart-line.stock-warning { background: #fffdf7; }
.new-sale-cart-product { min-width: 0; }
.new-sale-cart-product > strong, .new-sale-cart-product > small { display: block; }
.new-sale-cart-product > strong { font-size: 13px; overflow-wrap: anywhere; }
.new-sale-cart-product > small { margin-top: 3px; color: var(--muted); font-size: 10px; line-height: 1.35; }
.new-sale-cart-product .cart-stock-warning { color: var(--warning); font-weight: 750; }
.cart-quantity-control {
  width: 118px; display: grid; grid-template-columns: 30px 54px 30px;
  gap: 2px; align-items: center;
}
.cart-quantity-button, .cart-quantity-input {
  height: 34px; min-width: 0; border: 1px solid var(--line); background: var(--white);
}
.cart-quantity-button {
  padding: 0; display: grid; place-items: center; color: var(--teal-dark);
  border-radius: 6px; cursor: pointer; font-size: 17px; font-weight: 800;
}
.cart-quantity-button:hover { background: var(--teal-soft); }
.cart-quantity-input {
  width: 54px; padding: 4px; border-radius: 6px; text-align: center;
  font-size: 12px; font-variant-numeric: tabular-nums;
}
.new-sale-cart-numbers { min-width: 0; text-align: right; }
.new-sale-cart-numbers small, .new-sale-cart-numbers strong { display: block; white-space: nowrap; }
.new-sale-cart-numbers small { color: var(--muted); font-size: 9px; }
.new-sale-cart-numbers strong { margin-top: 5px; font-size: 13px; }
.new-sale-cart-remove { position: static; justify-self: end; }
.new-sale-cart-footer { padding: 16px 19px 19px; gap: 8px; }
.new-sale-cart-footer .cart-discount strong { color: var(--danger); }
.new-sale-cart-footer .cart-total strong { color: var(--teal-dark); font-size: 23px; }
.new-sale-cart-footer .sale-cart-operations {
  margin: 5px 0; padding: 11px 0; display: grid;
  grid-template-columns: minmax(90px, .6fr) minmax(0, 1.4fr); gap: 6px 14px;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.sale-cart-operations span { color: var(--muted); }
.sale-cart-operations strong { text-align: right; font-size: 11px; }
.new-sale-cart-footer > small { display: block; color: var(--muted); text-align: center; line-height: 1.4; }
.mini-badge.warning { color: #775207; border-color: #ead59c; background: #fff6df; }
.mini-badge.cold { color: #245c78; border-color: #c4ddea; background: #edf7fc; }

/* Paniers transactionnels vente et commande */
.transaction-workspace {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(420px, 1fr);
  gap: 20px;
  align-items: start;
  margin-bottom: 22px;
}
.sale-validation-workspace { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.sale-validation-prescription { margin-bottom: 0; }
.transaction-entry { min-width: 0; }
.transaction-search-panel { margin-bottom: 0; padding: 18px; }
.compact-heading { margin-bottom: 13px; }
.transaction-product-bar {
  display: grid;
  grid-template-columns: minmax(180px, .7fr) minmax(260px, 1.3fr) 78px auto;
  gap: 10px;
  align-items: end;
}
.transaction-product-bar label, .purchase-quick-bar label,
.line-options label {
  min-width: 0; display: grid; gap: 5px; color: var(--muted);
  font-size: 11px; font-weight: 750;
}
.transaction-product-bar input, .purchase-quick-bar input,
.line-options input {
  width: 100%; min-height: 42px; padding: 9px 10px; color: var(--ink);
  border: 1px solid var(--line); border-radius: 9px; background: var(--white); font: inherit;
}
.transaction-product-bar input:focus, .purchase-quick-bar input:focus,
.line-options input:focus {
  outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft);
}
.transaction-product-search, .purchase-product-search { position: relative; }
.compact-selection { margin-top: 11px; padding: 10px 12px; }
.selected-product-card.selection-pending {
  opacity: .62; border-style: dashed;
}
.selected-product-card.selection-pending::after {
  content: "Sélection précédente";
  grid-column: 2; color: var(--muted); font-size: 10px; font-weight: 750;
}
.transaction-cart {
  position: sticky;
  top: 88px;
  overflow: hidden;
  padding: 0;
  margin-bottom: 0;
}
.transaction-cart-header {
  padding: 17px 18px 14px; display: flex; justify-content: space-between;
  gap: 14px; align-items: center; border-bottom: 1px solid var(--line);
}
.transaction-cart-header h2 { margin: 1px 0 0; font-size: 20px; }
.cart-count {
  min-width: 31px; height: 31px; padding: 6px 9px; display: grid; place-items: center;
  color: white; background: var(--teal); border-radius: 999px; font-weight: 800;
}
.transaction-cart-lines {
  max-height: min(50vh, 480px);
  overflow-y: auto;
  overscroll-behavior: contain;
}
.transaction-cart-line {
  position: relative; padding: 13px 42px 13px 17px; display: grid;
  grid-template-columns: minmax(0, 1fr) auto; gap: 10px;
  border-bottom: 1px solid #edf0f1;
}
.transaction-cart-line:last-child { border-bottom: 0; }
.cart-line-main, .cart-line-numbers { min-width: 0; }
.cart-line-main strong, .cart-line-main small,
.cart-line-numbers span, .cart-line-numbers strong { display: block; }
.cart-line-main strong { overflow-wrap: anywhere; font-size: 13px; }
.cart-line-main small, .cart-line-numbers span { margin-top: 3px; color: var(--muted); font-size: 11px; }
.cart-line-numbers { text-align: right; white-space: nowrap; }
.cart-line-numbers strong { margin-top: 4px; font-size: 13px; }
.transaction-cart-line form { position: absolute; top: 12px; right: 12px; }
.cart-remove {
  width: 25px; height: 25px; padding: 0; display: grid; place-items: center;
  color: var(--danger); border: 1px solid #edc7c3; border-radius: 7px;
  background: var(--white); cursor: pointer; font-size: 17px; line-height: 1;
}
.cart-remove:hover { background: var(--danger-soft); }
.cart-empty { margin: 15px; }
.transaction-cart-footer {
  padding: 14px 17px 17px; display: grid; gap: 7px;
  border-top: 1px solid var(--line); background: #fafcfc;
}
.transaction-cart-footer > div {
  display: flex; justify-content: space-between; gap: 15px; font-size: 12px;
}
.transaction-cart-footer > div span { color: var(--muted); }
.transaction-cart-footer .cart-total {
  margin: 5px 0 7px; padding-top: 10px; border-top: 1px solid var(--line);
  color: var(--ink); font-size: 17px;
}
.transaction-cart-footer form { width: 100%; }
.cart-checkout-form {
  margin-top: 5px; padding-top: 13px; display: grid; gap: 11px;
  border-top: 1px solid var(--line);
}
.cart-checkout-primary {
  display: grid; grid-template-columns: minmax(0, 1fr) 112px; gap: 9px;
}
.cart-checkout-primary label {
  min-width: 0; display: grid; gap: 5px; color: var(--muted);
  font-size: 11px; font-weight: 750;
}
.cart-checkout-primary select, .cart-checkout-primary input,
.cart-extra-payment select, .cart-extra-payment input {
  width: 100%; min-width: 0; min-height: 38px; padding: 8px 9px;
  color: var(--ink); background: var(--white); border: 1px solid var(--line);
  border-radius: 7px; outline: none; font: inherit;
}
.cart-payment-reference { grid-column: 1 / -1; }
.cart-split-payment summary {
  width: fit-content; color: var(--teal-dark); cursor: pointer;
  font-size: 11px; font-weight: 750;
}
.cart-split-payment[open] summary { margin-bottom: 9px; }
.cart-extra-payment {
  display: grid; grid-template-columns: minmax(0, 1fr) 100px minmax(0, 1fr);
  gap: 7px; margin-top: 7px;
}
.psychotropic-sale-form {
  display: grid; grid-template-columns: minmax(220px, .9fr) minmax(320px, 1.5fr) 100px auto;
  gap: 12px; align-items: end;
}
.psychotropic-sale-form label {
  min-width: 0; display: grid; gap: 6px; color: var(--muted);
  font-size: 12px; font-weight: 750;
}
.psychotropic-sale-form select, .psychotropic-sale-form input {
  width: 100%; min-height: 42px; padding: 9px 10px; color: var(--ink);
  background: var(--white); border: 1px solid var(--line); border-radius: 8px;
}
.transaction-lower-section { scroll-margin-top: 88px; }
.purchase-quick-bar {
  display: grid; grid-template-columns: minmax(280px, 1fr) 95px auto;
  gap: 10px; align-items: end;
}
.line-options {
  margin-top: 12px; padding-top: 11px; border-top: 1px solid var(--line);
}
.line-options summary {
  width: fit-content; color: var(--teal-dark); cursor: pointer;
  font-size: 12px; font-weight: 750;
}
.line-options[open] summary { margin-bottom: 11px; }
.transaction-order-summary { margin-bottom: 0; }

.mini-stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; margin-bottom: 20px; }
.mini-stat-grid.four { grid-template-columns: repeat(4, 1fr); }
.mini-stat-grid article { padding: 18px 20px; border: 1px solid var(--line); border-radius: 14px; background: var(--white); box-shadow: var(--shadow); }
.mini-stat-grid small, .mini-stat-grid strong { display: block; }
.mini-stat-grid small { color: var(--muted); margin-bottom: 5px; }
.mini-stat-grid strong { font-size: 22px; }

.filterbar { display: grid; grid-template-columns: minmax(230px, 2fr) repeat(4, minmax(130px, 1fr)) auto auto; align-items: end; gap: 12px; margin-bottom: 20px; }
.filterbar label, .record-form label, .compact-form label { display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750; }
.filterbar input, .filterbar select, .record-form input, .record-form select, .record-form textarea, .compact-form input, .compact-form select {
  width: 100%; min-height: 42px; padding: 9px 11px; color: var(--ink); background: var(--white);
  border: 1px solid var(--line); border-radius: 9px; outline: none;
}
.record-form textarea { min-height: auto; resize: vertical; }
.form-help {
  margin: 0; padding: 11px 13px; color: var(--muted); background: #f6f8f8;
  border-radius: 9px; font-size: 12px;
}
.filterbar input:focus, .filterbar select:focus, .record-form input:focus, .record-form select:focus, .record-form textarea:focus, .compact-form input:focus, .compact-form select:focus {
  border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft);
}
.filter-reset { align-self: center; font-size: 13px; }
.saved-views { display: flex; flex-wrap: wrap; gap: 8px; margin: -4px 0 18px; }
.saved-views a {
  padding: 7px 11px; color: var(--teal-dark); background: var(--teal-soft);
  border: 1px solid #cce3df; border-radius: 100px; font-size: 12px; font-weight: 750;
}
.catalogue-filters { display: grid; gap: 14px; margin-bottom: 16px; }
.filter-primary {
  display: grid; grid-template-columns: minmax(340px, 2.4fr) minmax(170px, 1fr)
    minmax(150px, .8fr) auto auto; gap: 12px; align-items: end;
}
.catalogue-filters label {
  display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750;
}
.catalogue-filters input, .catalogue-filters select {
  width: 100%; min-height: 42px; padding: 9px 11px; color: var(--ink); background: var(--white);
  border: 1px solid var(--line); border-radius: 9px; outline: none;
}
.catalogue-filters input:focus, .catalogue-filters select:focus {
  border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft);
}
.advanced-filters {
  border: 1px solid var(--line); border-radius: 11px; background: #fbfcfc;
}
.advanced-filters > summary {
  padding: 11px 14px; cursor: pointer; color: var(--teal-dark); font-size: 13px;
  font-weight: 800;
}
.advanced-filters[open] > summary { border-bottom: 1px solid var(--line); }
.advanced-filters .filter-grid {
  display: grid; grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 13px; padding: 14px;
}
.advanced-filters > .button { margin: 0 14px 14px; }
.table-toolbar {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  margin: 6px 0 12px;
}
.table-toolbar .result-note { margin: 0; }
.column-chooser { position: relative; }
.column-chooser > summary {
  cursor: pointer; list-style: none; padding: 8px 11px; border: 1px solid var(--line);
  border-radius: 9px; color: var(--teal-dark); font-size: 12px; font-weight: 800;
}
.column-chooser > summary::-webkit-details-marker { display: none; }
.column-chooser > div {
  position: absolute; z-index: 6; right: 0; top: calc(100% + 6px); width: 260px;
  max-height: 360px; overflow-y: auto; display: grid; gap: 7px; padding: 13px;
  background: var(--white); border: 1px solid var(--line); border-radius: 11px;
  box-shadow: var(--shadow);
}
.column-chooser label { display: flex; align-items: center; gap: 8px; font-size: 12px; }
.catalogue-table { max-height: 68vh; overflow-y: auto; border: 1px solid var(--line); border-radius: 10px; }
.catalogue-table table { table-layout: fixed; }
.catalogue-table thead { position: sticky; top: 0; z-index: 3; background: var(--white); }
.catalogue-table th, .catalogue-table td { white-space: normal; }
.catalogue-table td[data-column="product"],
.catalogue-table td[data-column="dci"],
.catalogue-table td[data-column="presentation"] { white-space: normal; }
#products-table [data-column="product"] { width: 18%; }
#products-table [data-column="dci"] { width: 16%; }
#products-table [data-column="form"],
#products-table [data-column="nature"] { width: 10%; }
#products-table [data-column="manufacturer"] { width: 14%; }
#products-table [data-column="sale_price"],
#products-table [data-column="purchase_price"] { width: 8%; }
#products-table [data-column="stock"] { width: 7%; }
#products-table [data-column="expiry"] { width: 9%; }
#suppliers-table [data-supplier-column="supplier"] { width: 22%; }
#suppliers-table [data-supplier-column="type"] { width: 17%; }
#suppliers-table [data-supplier-column="city"] { width: 12%; }
#suppliers-table [data-supplier-column="phone"] { width: 14%; }
#suppliers-table [data-supplier-column="validation"] { width: 12%; }
#suppliers-table [data-supplier-column="products"] { width: 10%; }
#suppliers-table [data-supplier-column="balance"] { width: 13%; }
.sort-link { color: inherit; }
.sort-link span { color: var(--teal); margin-left: 3px; }
.inline-flag {
  display: inline-block; margin-right: 4px; padding: 2px 6px; color: #6f2d25;
  background: var(--danger-soft); border-radius: 100px; font-size: 10px; font-weight: 750;
}
.inline-flag.warning { color: #775207; background: #fff1c9; }
.inline-flag.info { color: #174e6d; background: #dff3ff; }
.pagination { display: flex; justify-content: center; align-items: center; gap: 18px; padding-top: 18px; }
.pagination span { color: #a0aaae; }
.pagination strong { font-size: 13px; }

.charges-filter-primary {
  grid-template-columns: minmax(300px, 2fr) minmax(190px, 1fr)
    minmax(170px, .8fr) auto auto;
}
.mini-stat-grid article > span { color: var(--muted); font-size: 11px; }
.saved-views a.active { color: white; background: var(--teal); border-color: var(--teal); }
.inline-category-create { margin-top: 14px; border-top: 1px solid var(--line); padding-top: 12px; }
.inline-category-create > summary { color: var(--teal-dark); cursor: pointer; font-size: 12px; font-weight: 800; }
.compact-inline-form { display: flex; gap: 10px; align-items: end; margin-top: 12px; }
.compact-inline-form label { flex: 1; display: grid; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 750; }
.compact-inline-form input { width: 100%; min-height: 40px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; }
.analysis-bars { display: grid; gap: 14px; list-style: none; margin: 0; padding: 0; }
.analysis-bars li { display: grid; gap: 7px; }
.analysis-bars li > div { display: flex; justify-content: space-between; gap: 12px; font-size: 12px; }
.analysis-bars li > div span { color: var(--muted); text-align: right; }
.analysis-track { height: 8px; overflow: hidden; background: #e9eeee; border-radius: 999px; }
.analysis-track i { display: block; height: 100%; background: linear-gradient(90deg, var(--teal), #4bc9bd); border-radius: inherit; }
.expense-cancelled { opacity: .62; }
.total-preview { display: flex; align-items: center; justify-content: space-between; padding: 14px 16px; background: var(--teal-soft); border-radius: 10px; }
.total-preview span { color: var(--teal-dark); font-size: 12px; font-weight: 750; }
.total-preview strong { font-size: 20px; }
.recurrence-fields { margin-top: 14px; }
.payment-create { margin-bottom: 18px; }
.purchases-filter-primary {
  grid-template-columns: minmax(270px, 1.6fr) minmax(230px, 1.2fr)
    minmax(170px, .8fr) auto auto;
}
.purchase-nav {
  display: flex; width: fit-content; max-width: 100%; gap: 5px; margin: -8px 0 20px;
  padding: 5px; overflow: hidden; background: #e8eeee; border-radius: 12px;
}
.purchase-nav a {
  padding: 9px 16px; border-radius: 8px; color: var(--muted);
  font-size: 13px; font-weight: 800; white-space: nowrap;
}
.purchase-nav a:hover, .purchase-nav a.active {
  color: var(--teal-dark); background: var(--white); box-shadow: 0 1px 5px rgba(19, 54, 59, .08);
}
.receipt-workflow {
  display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px;
}
.receipt-workflow article {
  min-width: 0; padding: 14px 16px; border: 1px solid #cce3df;
  border-radius: 13px; background: var(--teal-soft);
}
.receipt-workflow strong, .receipt-workflow span { display: block; }
.receipt-workflow strong { margin-bottom: 4px; color: var(--teal-dark); font-size: 13px; }
.receipt-workflow span { color: var(--muted); font-size: 12px; line-height: 1.45; }
.receipt-filter-primary {
  grid-template-columns: minmax(320px, 2fr) minmax(240px, 1.2fr) auto auto;
}
.receipt-orders-table table { table-layout: fixed; }
.receipt-orders-table th:nth-child(1) { width: 16%; }
.receipt-orders-table th:nth-child(2) { width: 18%; }
.receipt-orders-table th:nth-child(3) { width: 12%; }
.receipt-orders-table th:nth-child(4) { width: 19%; }
.receipt-orders-table th:nth-child(5) { width: 9%; }
.receipt-orders-table th:nth-child(6) { width: 13%; }
.receipt-orders-table th:nth-child(7) { width: 13%; }
.receipt-progress { min-width: 120px; }
.receipt-progress > span {
  display: block; height: 7px; overflow: hidden; margin-bottom: 5px;
  border-radius: 999px; background: #e2e8e9;
}
.receipt-progress i {
  display: block; height: 100%; border-radius: inherit; background: var(--teal);
}
.receipt-progress small { margin: 0; white-space: nowrap; }
.receipt-context { margin-bottom: 0; }
.receipt-checklist {
  display: grid; gap: 10px; margin: 0; padding: 0; list-style: none;
}
.receipt-checklist li {
  position: relative; padding-left: 24px; color: var(--muted); font-size: 13px;
}
.receipt-checklist li::before {
  content: "✓"; position: absolute; left: 0; top: -1px; width: 17px; height: 17px;
  display: grid; place-items: center; border-radius: 50%; color: white;
  background: var(--teal); font-size: 10px; font-weight: 900;
}
.receipt-lines { display: grid; gap: 14px; }
.receipt-line-card {
  min-width: 0; padding: 17px; border: 1px solid var(--line);
  border-radius: 13px; background: #fbfcfc;
}
.receipt-line-card.complete { background: #f7fbfa; }
.receipt-line-card > header {
  display: flex; justify-content: space-between; align-items: flex-start;
  gap: 16px; margin-bottom: 15px;
}
.receipt-line-card > header > div { min-width: 0; }
.receipt-line-card > header span:not(.badge),
.receipt-line-card > header small {
  display: block; margin-top: 4px; color: var(--muted); font-size: 12px;
}
.receipt-entry-form {
  display: grid; grid-template-columns: repeat(4, minmax(130px, 1fr));
  gap: 12px; align-items: end; padding-top: 14px; border-top: 1px solid var(--line);
}
.receipt-entry-form label {
  display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750;
}
.receipt-entry-form input {
  width: 100%; min-height: 42px; padding: 9px 11px; color: var(--ink);
  background: var(--white); border: 1px solid var(--line); border-radius: 9px; outline: none;
}
.receipt-entry-form input:focus {
  border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft);
}
.receipt-entry-form .receipt-note { grid-column: span 3; }
.receipt-document-form {
  display: grid; grid-template-columns: repeat(4, minmax(150px, 1fr)) auto;
  gap: 12px; align-items: end;
}
.receipt-document-form label {
  display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750;
}
.receipt-document-form input {
  width: 100%; min-height: 42px; padding: 9px 11px; color: var(--ink);
  background: var(--white); border: 1px solid var(--line); border-radius: 9px; outline: none;
}
.receipt-document-form input:focus {
  border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft);
}
.purchase-status-brouillon { color: #44545c; background: #edf1f2; }
.purchase-status-commandée,
.purchase-status-partiellement-reçue { color: #775207; background: #fff1c9; }
.purchase-status-reçue { color: var(--teal-dark); background: var(--teal-soft); }
.purchase-status-annulée { color: var(--danger); background: var(--danger-soft); }
.purchase-line-form {
  display: grid; grid-template-columns: minmax(280px, 2fr)
    repeat(4, minmax(110px, .7fr)) auto; gap: 12px; align-items: end;
}
.purchase-line-form label, .receipt-form label {
  display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750;
}
.purchase-line-form input, .receipt-form input {
  width: 100%; min-height: 42px; padding: 9px 11px; color: var(--ink);
  background: var(--white); border: 1px solid var(--line); border-radius: 9px; outline: none;
}
.purchase-product-search { position: relative; min-width: 0; }
.proposal-kpis { margin-bottom: 18px; }
.proposal-toolbar {
  position: sticky; top: 78px; z-index: 8; margin-bottom: 18px;
  display: grid; grid-template-columns: minmax(260px, 1fr) 175px auto auto;
  gap: 12px; align-items: end; padding: 14px 16px;
}
.proposal-toolbar label {
  display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 750;
}
.proposal-toolbar input {
  width: 100%; min-height: 42px; padding: 9px 11px;
  border: 1px solid var(--line); border-radius: 9px; font: inherit;
}
.proposal-selection-status {
  min-width: 98px; min-height: 42px; display: flex; gap: 6px;
  align-items: center; justify-content: center; color: var(--muted);
  border: 1px solid var(--line); border-radius: 9px; background: #f7f9f9;
  font-size: 11px;
}
.proposal-selection-status strong { color: var(--teal-dark); font-size: 18px; }
.proposal-groups { display: grid; gap: 16px; }
.proposal-supplier-group { padding: 0; overflow: hidden; }
.proposal-group-heading {
  padding: 16px 18px; display: flex; justify-content: space-between;
  gap: 16px; align-items: center; border-bottom: 1px solid var(--line);
  background: #f7fafa;
}
.proposal-group-heading h2 { margin: 2px 0 3px; font-size: 18px; }
.proposal-group-heading span { color: var(--muted); font-size: 12px; }
.proposal-select-all {
  display: flex; gap: 8px; align-items: center; color: var(--teal-dark);
  font-size: 12px; font-weight: 800; cursor: pointer;
}
.proposal-select-all input, .proposal-choice input { accent-color: var(--teal); }
.proposal-list { display: grid; }
.proposal-row {
  min-width: 0; padding: 13px 18px; display: grid;
  grid-template-columns: 26px minmax(220px, 1.5fr) repeat(4, minmax(86px, .55fr)) minmax(145px, .75fr);
  gap: 12px; align-items: center; border-bottom: 1px solid #edf1f2;
}
.proposal-row:last-child { border-bottom: 0; }
.proposal-row:hover { background: #fbfdfd; }
.proposal-row-blocked { background: #fbfafa; }
.proposal-choice { display: grid; place-items: center; }
.proposal-choice input { width: 18px; height: 18px; }
.proposal-lock {
  width: 20px; height: 20px; display: grid; place-items: center;
  color: #8a6416; border-radius: 50%; background: var(--warning-soft);
  font-size: 11px; font-weight: 900;
}
.proposal-product { min-width: 0; }
.proposal-product .entity-name, .proposal-product small { display: block; }
.proposal-product .entity-name { overflow-wrap: anywhere; }
.proposal-product small { margin-top: 4px; color: var(--muted); font-size: 11px; }
.proposal-product .badge { width: fit-content; margin-top: 6px; }
.proposal-metric span, .proposal-metric strong { display: block; }
.proposal-metric span, .proposal-quantity { color: var(--muted); font-size: 10px; font-weight: 750; }
.proposal-metric strong { margin-top: 3px; font-size: 14px; }
.proposal-quantity { display: grid; gap: 5px; }
.proposal-quantity input {
  width: 100%; min-width: 0; min-height: 38px; padding: 8px 9px;
  border: 1px solid var(--line); border-radius: 8px; font: inherit;
}
.proposal-quantity input:disabled { color: var(--muted); background: #eef1f1; }
.autocomplete-results {
  position: absolute; z-index: 8; top: calc(100% + 5px); left: 0; right: 0;
  max-height: 280px; overflow-y: auto; padding: 6px; background: var(--white);
  border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow);
}
.autocomplete-results button {
  width: 100%; padding: 10px; border: 0; border-radius: 7px; color: var(--ink);
  background: transparent; text-align: left; cursor: pointer;
}
.autocomplete-results button:hover { background: var(--teal-soft); }
.receipt-create { min-width: 120px; }
.receipt-create > summary { list-style: none; white-space: nowrap; }
.receipt-create > summary::-webkit-details-marker { display: none; }
.receipt-form {
  position: absolute; z-index: 8; right: 28px; width: min(540px, calc(100vw - 50px));
  margin-top: 8px; padding: 15px; display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px;
  background: var(--white); border: 1px solid #a9ddd8; border-radius: 12px;
  box-shadow: 0 15px 45px rgba(19, 54, 59, .18);
}
.inventory-filter-primary {
  grid-template-columns: minmax(320px, 2fr) minmax(210px, 1fr) auto auto;
}
.inventory-table table { table-layout: fixed; }
.inventory-table th, .inventory-table td { overflow-wrap: normal; }
.inventory-table th:nth-child(1) { width: 25%; }
.inventory-table th:nth-child(2) { width: 13%; }
.inventory-table th:nth-child(3),
.inventory-table th:nth-child(4),
.inventory-table th:nth-child(5),
.inventory-table th:nth-child(7),
.inventory-table th:nth-child(10) { width: 6%; }
.inventory-table th:nth-child(6),
.inventory-table th:nth-child(11) { width: 7%; }
.inventory-table th:nth-child(8) { width: 9%; }
.inventory-table th:nth-child(9) { width: 9%; }
.inventory-table td:not(:first-child) { white-space: normal; }
.inventory-table td:nth-child(2) .badge {
  max-width: 100%;
  white-space: normal;
  overflow-wrap: anywhere;
  line-height: 1.2;
  text-align: center;
}
.fefo-rank {
  display: inline-grid; width: 28px; height: 28px; place-items: center;
  border-radius: 50%; color: white; background: var(--teal); font-weight: 800;
}
.lot-status-actif { color: var(--teal-dark); background: var(--teal-soft); }
.lot-status-quarantaine { color: #775207; background: #fff1c9; }
.lot-status-retiré, .lot-status-périmé { color: var(--danger); background: var(--danger-soft); }
.lot-status-épuisé { color: #44545c; background: #edf1f2; }
.lot-action { position: relative; min-width: 120px; }
.lot-action > summary { list-style: none; white-space: nowrap; }
.lot-action > summary::-webkit-details-marker { display: none; }
.lot-status-form {
  position: absolute; z-index: 8; right: 0; width: min(380px, calc(100vw - 50px));
  margin-top: 8px; padding: 15px; display: grid; gap: 12px;
  background: var(--white); border: 1px solid #a9ddd8; border-radius: 12px;
  box-shadow: 0 15px 45px rgba(19, 54, 59, .18);
}
.lot-status-form label {
  display: grid; gap: 6px; color: var(--muted); font-size: 12px; font-weight: 750;
}
.lot-status-form input, .lot-status-form select, .count-input {
  width: 100%; min-height: 40px; padding: 8px 10px; color: var(--ink);
  background: var(--white); border: 1px solid var(--line); border-radius: 8px;
}
.count-input { max-width: 150px; }
.stocktake-actions { margin-top: 18px; }
.stocktake-validation {
  display: flex; align-items: center; justify-content: space-between; gap: 20px;
  border-color: #a9ddd8; background: #f7fdfc;
}
.stocktake-validation h2, .stocktake-validation p { margin: 0; }
.stocktake-validation p { margin-top: 6px; color: var(--muted); }

@media (max-width: 1350px) {
  .menu-toggle { display: block; cursor: pointer; }
  .topbar nav {
    display: none; position: absolute; left: 0; right: 0; top: 68px; height: auto;
    background: var(--teal-dark); flex-direction: column; align-items: stretch;
    padding: 8px; box-shadow: var(--shadow);
  }
  .menu-open .topbar nav { display: flex; }
  .topbar nav a {
    min-height: 44px; place-items: center start; border: 0; border-radius: 8px;
    padding: 0 14px;
  }
}

.validation-summary { margin-bottom: 18px; padding: 16px 18px; color: var(--danger); background: var(--danger-soft); border: 1px solid #efc5c1; border-radius: 13px; }
.validation-summary ul { margin: 7px 0 0; padding-left: 20px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 17px 20px; }
.form-grid > label {
  min-width: 0; display: grid; gap: 6px; color: var(--muted);
  font-size: 13px; font-weight: 700;
}
.form-grid > label > input:not([type="checkbox"]):not([type="radio"]),
.form-grid > label > select,
.form-grid > label > textarea {
  width: 100%; min-width: 0; min-height: 44px; padding: 10px 12px;
  color: var(--ink); background: var(--white); border: 1px solid var(--line);
  border-radius: 9px; font: inherit;
}
.form-grid > label > textarea { min-height: 96px; resize: vertical; }
.form-grid > label > input:focus,
.form-grid > label > select:focus,
.form-grid > label > textarea:focus {
  outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft);
}
.quote-date-grid { grid-template-columns: minmax(0, 1fr); }
.quote-date-grid label, .quote-date-grid input { min-width: 0; max-width: 100%; }
.ocr-camera { display: grid; gap: 12px; min-width: 0; padding: 15px; border: 1px solid #b9dedb; border-radius: 14px; background: #f1faf9; }
.ocr-camera-header { display: grid; gap: 3px; }
.ocr-camera-header strong { color: var(--ink); font-size: 15px; }
.ocr-camera-header span { color: var(--muted); font-size: 12px; }
.ocr-source-card { display: grid; gap: 11px; min-width: 0; padding: 13px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); box-shadow: 0 4px 14px rgba(22, 56, 52, .05); }
.ocr-source-heading { display: grid; gap: 2px; }
.ocr-source-heading strong { font-size: 14px; }
.ocr-source-heading small { color: var(--muted); line-height: 1.35; }
.ocr-camera-actions { display: grid; gap: 9px; }
.ocr-camera-actions .button { width: 100%; }
.ocr-scanner-choice { grid-template-columns: minmax(0, 1fr); align-items: stretch; }
.ocr-scanner-field { display: grid; gap: 6px; min-width: 0; color: var(--muted); font-size: 12px; font-weight: 700; }
.ocr-scanner-field select, .ocr-scanner-choice .button { width: 100%; min-width: 0; }
.ocr-camera-status { margin: 0; color: var(--muted); font-size: 12px; line-height: 1.4; }
.ocr-scanner-choice[hidden] { display: none; }
.ocr-camera button[hidden] { display: none; }
.ocr-camera video, .ocr-camera img { display: block; width: 100%; max-height: 430px; object-fit: contain; border-radius: 10px; background: #162323; }
.ocr-camera video[hidden], .ocr-camera img[hidden] { display: none; }
.span-2 { grid-column: 1 / -1; }
.form-actions { display: flex; justify-content: flex-end; gap: 10px; margin-top: -4px; }
.compact-form { display: grid; gap: 12px; }
.archive-form { display: flex; justify-content: flex-end; margin-top: 8px; }
.button.danger-outline { color: var(--danger); background: transparent; border-color: #dfaaa5; }
.button.danger-outline:hover { background: var(--danger-soft); }
.record-banner { margin-bottom: 18px; padding: 12px 15px; color: var(--warning); background: var(--warning-soft); border: 1px solid #f0dfb4; border-radius: 11px; font-weight: 700; }
.record-banner.critical { border-color: #d45b5b; background: #fff0f0; color: #8a2020; }
.auth-shell { min-height: calc(100vh - 160px); display: grid; place-items: center; }
.auth-card { width: min(100%, 460px); display: grid; gap: 15px; padding: 30px; }
.auth-card h1 { margin: 0; }
.auth-card > p { margin: 0; }
.auth-card label, .stack-form label { display: grid; gap: 6px; color: var(--muted); font-size: 13px; font-weight: 700; }
.auth-card input, .stack-form input, .stack-form select { width: 100%; border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; color: var(--ink); background: var(--white); }
.stack-form { display: grid; gap: 13px; }
.error-panel { max-width: 680px; margin: 50px auto; text-align: center; }
.form-errors {
  padding: 13px 15px;
  border: 1px solid #e7a5a5;
  border-radius: 10px;
  color: #8a2020;
  background: var(--danger-soft);
}
.form-errors strong { display: block; margin-bottom: 6px; }
.form-errors ul { margin: 0; padding-left: 20px; }
.form-errors p { margin: 0; }
.balance-pill { display: inline-block; padding: 9px 13px; color: var(--teal-dark); background: var(--teal-soft); border-radius: 100px; font-weight: 750; white-space: nowrap; }
.movement-list, .related-list { list-style: none; margin: 0; padding: 0; }
.movement-list li { display: flex; gap: 12px; align-items: center; padding: 11px 0; border-bottom: 1px solid var(--line); }
.movement-list li:last-child, .related-list li:last-child { border-bottom: 0; }
.movement-list > li > span { min-width: 58px; padding: 5px 8px; border-radius: 8px; text-align: center; font-weight: 800; }
.movement-list .positive { color: var(--teal-dark); background: var(--teal-soft); }
.movement-list .negative { color: var(--danger); background: var(--danger-soft); }
.movement-list strong, .movement-list small { display: block; }
.movement-list small { color: var(--muted); margin-top: 2px; }
.related-list li { display: flex; justify-content: space-between; gap: 18px; padding: 11px 0; border-bottom: 1px solid var(--line); font-size: 13px; }
.related-list span { color: var(--muted); text-align: right; }
.prose { margin: 0; white-space: pre-wrap; line-height: 1.6; }

.sticky-record-header {
  position: sticky; top: 68px; z-index: 7; margin: -20px -10px 22px; padding: 12px 10px;
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  background: rgba(244, 246, 246, .94); backdrop-filter: blur(8px);
}
.sticky-record-header h1 { margin: 2px 0 0; font-size: 22px; }
.sticky-record-header .back-link { margin: 0; font-size: 12px; }
.form-section { padding-top: 18px; }
.section-title { display: flex; align-items: center; gap: 10px; margin-bottom: 20px; }
.section-title > span { width: 6px; height: 25px; border-radius: 10px; background: #22b8aa; }
.section-title h2 { margin: 0; font-size: 20px; }
.checkbox-grid { display: flex; flex-wrap: wrap; gap: 12px 28px; margin-top: 20px; }
.checkbox-grid label { display: flex; align-items: center; gap: 8px; color: var(--ink); font-size: 13px; font-weight: 700; }
.checkbox-grid input { width: 18px; min-height: 18px; accent-color: var(--teal); }

.product-actionbar { display: flex; justify-content: space-between; align-items: center; gap: 18px; margin-bottom: 18px; }
.product-actionbar .back-link { margin: 0; }
.product-actionbar form { margin: 0; }
.product-master { border: 2px solid #63c9c0; }
.section-title.decorative {
  padding: 11px 14px; border: 1px solid #c5eae6;
  background: linear-gradient(105deg, #fff 0%, #e7f8f6 35%, #f6fffd 100%);
}
.section-title.decorative h2 { color: #105b58; }
.info-fieldset { margin: 0 0 18px; padding: 18px 20px 20px; border: 1px solid var(--line); border-radius: 12px; background: #f9fbfc; }
.info-fieldset:last-child { margin-bottom: 0; }
.info-fieldset legend { padding: 0 10px; font-size: 16px; font-weight: 800; }
.product-info-grid { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 20px 28px; }
.product-info-grid div { min-width: 0; }
.product-info-grid dt { color: #617782; font-size: 11px; margin-bottom: 4px; }
.product-info-grid dd { margin: 0; min-height: 18px; font-size: 13px; font-weight: 650; overflow-wrap: anywhere; white-space: pre-wrap; }
.span-3 { grid-column: 1 / -1; }
.boolean-badge { display: inline-block; padding: 4px 8px; border-radius: 7px; font-size: 11px; font-weight: 800; }
.boolean-badge.yes { color: var(--teal-dark); background: var(--teal-soft); }
.boolean-badge.no { color: white; background: #e64f59; }
.dossier-section { border: 2px solid #63c9c0; }
.dossier-section > .panel-heading { margin-top: -6px; }
.inline-create { position: relative; }
.inline-create > summary { list-style: none; cursor: pointer; }
.inline-create > summary::-webkit-details-marker { display: none; }
.drawer-form {
  margin-top: 12px; padding: 16px; display: grid; grid-template-columns: repeat(2, minmax(180px, 1fr)); gap: 13px;
  border: 1px solid #a9ddd8; border-radius: 12px; background: #f7fdfc;
}
.drawer-form label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 750; }
.drawer-form input, .drawer-form select, .drawer-form textarea, .comment-form textarea {
  width: 100%; min-height: 40px; padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; background: var(--white); font: inherit;
}
.drawer-form > .button { align-self: end; }
.table-empty { padding: 26px !important; color: var(--muted); text-align: center; }
.history-grid { grid-template-columns: 1fr 1fr; margin-bottom: 12px; }
.history-grid h3 { margin: 0 0 12px; font-size: 15px; }
.positive-text { color: var(--teal-dark); font-weight: 800; }
.negative-text { color: var(--danger); font-weight: 800; }
.adjustment-create { margin-top: 14px; }
.comment-form { display: grid; gap: 10px; }
.comment-form .button { justify-self: end; }
.comment-list { list-style: none; margin: 18px 0 0; padding: 0; }
.comment-list li { padding: 14px 0; border-top: 1px solid var(--line); }
.comment-list li > div { display: flex; justify-content: space-between; gap: 12px; }
.comment-list small { color: var(--muted); }
.comment-list p { margin: 7px 0 0; white-space: pre-wrap; }

.ingredient-panel { border: 2px solid #63c9c0; }
.ingredient-heading { align-items: flex-start; }
.ingredient-heading h2, .ingredient-heading p { margin: 0; }
.ingredient-heading p { margin-top: 4px; color: var(--muted); font-size: 13px; }
.verification-badge, .ingredient-state {
  display: inline-block; border-radius: 999px; font-size: 11px; font-weight: 800;
}
.verification-badge { padding: 7px 11px; white-space: nowrap; }
.ingredient-state { margin-top: 5px; padding: 4px 7px; width: fit-content; }
.status-official_verified, .status-source_verified, .status-pharmacist_verified,
.state-official_verified, .state-source_verified, .state-pharmacist_verified {
  color: #075e54; background: #d9f5ef;
}
.status-missing, .status-conflict, .state-missing, .state-conflict {
  color: #982d26; background: #fde4e1;
}
.status-catalogue_unverified, .state-catalogue_unverified {
  color: #775207; background: #fff1c9;
}
.ingredient-list { display: grid; gap: 9px; }
.ingredient-card {
  display: flex; align-items: center; justify-content: space-between; gap: 18px;
  padding: 12px 14px; border: 1px solid var(--line); border-radius: 10px; background: #f9fbfc;
}
.ingredient-card strong, .ingredient-card span, .ingredient-card small { display: block; }
.ingredient-card span { margin-top: 2px; color: #33525d; font-weight: 700; }
.ingredient-card small { margin-top: 4px; color: var(--muted); }
.button.text-danger { min-height: auto; padding: 5px 8px; color: var(--danger); background: transparent; border: 0; }
.ingredient-empty { padding: 18px; color: var(--danger); background: var(--danger-soft); border-radius: 10px; }
.ingredient-conflict {
  margin-top: 12px; padding: 14px; display: grid; gap: 5px;
  color: #7b281f; background: #fff0ed; border: 1px solid #efb5af; border-radius: 10px;
}
.ingredient-conflict span { font-weight: 800; }
.ingredient-conflict p { margin: 3px 0 0; }
.ingredient-actions {
  margin-top: 16px; display: grid; grid-template-columns: 2fr 1fr; gap: 14px; align-items: end;
}
.ingredient-add-form {
  display: grid; grid-template-columns: 1.2fr .8fr auto; gap: 10px; align-items: end;
}
.ingredient-add-form label { display: grid; gap: 5px; color: var(--muted); font-size: 12px; font-weight: 750; }
.ingredient-add-form input {
  width: 100%; min-height: 40px; padding: 9px 10px;
  border: 1px solid var(--line); border-radius: 8px; font: inherit;
}
.ingredient-verify-form { padding-left: 14px; border-left: 1px solid var(--line); }
.ingredient-verify-form p { margin: 0 0 8px; color: var(--muted); font-size: 11px; }

/* Interface transversale : formulaires, tableaux de bord et rapports */
.required-field { position: relative; }
.required-field > input:required, .required-field > select:required,
.required-field > textarea:required { border-left: 3px solid #86cbc4; }
.field-invalid { border-color: var(--danger) !important; box-shadow: 0 0 0 3px var(--danger-soft) !important; }
.character-counter { justify-self: end; color: var(--muted); font-weight: 500; }
.guided-form { padding: 16px; border: 1px solid var(--line); border-radius: 12px; background: #f9fbfb; }
.form-disclosure { padding: 13px 0; border-bottom: 1px solid var(--line); }
.form-disclosure:last-child { border-bottom: 0; }
.form-disclosure > summary { color: var(--teal-dark); cursor: pointer; font-weight: 800; }
.form-disclosure > form { margin-top: 14px; }
.checkbox-label { display: flex !important; align-items: center; gap: 9px; }
.checkbox-label input { width: auto !important; min-height: 0 !important; accent-color: var(--teal); }

.entity-picker {
  min-width: 0; position: relative; display: grid; gap: 8px; margin-bottom: 14px;
}
.entity-picker > label {
  min-width: 0; display: grid; gap: 6px; color: var(--muted);
  font-size: 12px; font-weight: 750;
}
.entity-picker > label input, .entity-picker > label select {
  width: 100%; min-height: 44px; padding: 10px 12px; color: var(--ink);
  background: var(--white); border: 1px solid var(--line); border-radius: 10px; font: inherit;
}
.entity-picker > label input:focus, .entity-picker > label select:focus {
  outline: none; border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft);
}
.entity-picker-results { top: 70px; }
.entity-result-heading { display: flex; justify-content: space-between; gap: 12px; align-items: center; }
.entity-form-row {
  display: grid; grid-template-columns: minmax(320px, 1fr) 180px auto;
  gap: 14px; align-items: end;
}
.entity-form-row.quote-line-row {
  grid-template-columns: minmax(300px, 1fr) 110px 110px auto;
}
.entity-form-row > label {
  min-width: 0; display: grid; gap: 6px; color: var(--muted);
  font-size: 12px; font-weight: 750;
}
.entity-form-row > label input {
  width: 100%; min-height: 44px; padding: 10px 12px;
  border: 1px solid var(--line); border-radius: 10px; font: inherit;
}
.contact-entry-form { margin-bottom: 24px; padding-bottom: 20px; border-bottom: 1px solid var(--line); }
.recall-card { margin-top: 18px; padding: 15px; border: 1px solid var(--line); border-radius: 13px; background: #fafcfc; }
.recall-card header { display: flex; justify-content: space-between; gap: 14px; margin-bottom: 14px; }
.recall-card header strong, .recall-card header small { display: block; }
.recall-card header small { margin-top: 4px; color: var(--muted); }
.safety-kpis, .report-secondary-kpis {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 14px; margin-bottom: 20px;
}
.safety-kpis article, .report-secondary-kpis article {
  min-width: 0; padding: 16px 18px; background: var(--white); border: 1px solid var(--line);
  border-radius: 13px; box-shadow: var(--shadow);
}
.safety-kpis span, .safety-kpis strong,
.report-secondary-kpis span, .report-secondary-kpis strong,
.report-secondary-kpis small { display: block; }
.safety-kpis span, .report-secondary-kpis span { color: var(--muted); font-size: 12px; }
.safety-kpis strong, .report-secondary-kpis strong { margin-top: 4px; font-size: 21px; }
.report-secondary-kpis small { margin-top: 3px; color: var(--muted); }

.dashboard-kpis, .report-kpis {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 15px; margin-bottom: 18px;
}
.dashboard-kpi, .report-kpi {
  min-width: 0; padding: 19px; display: flex; flex-direction: column;
  border: 1px solid var(--line); border-radius: 15px; background: var(--white); box-shadow: var(--shadow);
}
.dashboard-kpi.primary, .report-kpi.primary {
  color: white; border-color: var(--teal); background: linear-gradient(135deg, var(--teal-dark), var(--teal));
}
.dashboard-kpi.warning-card { border-color: #e6cc92; background: var(--warning-soft); }
.report-kpi.negative-card { border-color: #efc5c1; background: var(--danger-soft); }
.dashboard-kpi-head { display: flex; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 12px; font-weight: 750; }
.primary .dashboard-kpi-head { color: rgba(255,255,255,.8); }
.dashboard-kpi > strong, .report-kpi > strong { margin: 9px 0 4px; font-size: clamp(22px, 2.2vw, 30px); letter-spacing: -.035em; }
.dashboard-kpi > small, .report-kpi > small { color: var(--muted); line-height: 1.45; }
.primary > small { color: rgba(255,255,255,.75); }
.dashboard-kpi > a { margin-top: auto; padding-top: 12px; font-size: 12px; font-weight: 750; }
.trend { width: fit-content; margin-top: 11px; padding: 4px 7px; border-radius: 999px; font-size: 11px; font-weight: 750; }
.trend.up { color: #075e54; background: #d9f5ef; }
.trend.down { color: #982d26; background: #fde4e1; }
.trend.neutral { color: var(--muted); background: #edf1f2; }
.primary .trend { color: white; background: rgba(255,255,255,.16); }
.dashboard-status-strip {
  display: grid; grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 1px; margin-bottom: 20px; overflow: hidden; border: 1px solid var(--line);
  border-radius: 13px; background: var(--line); box-shadow: var(--shadow);
}
.dashboard-status-strip a {
  min-width: 0; padding: 13px 15px; display: flex; gap: 10px; align-items: center;
  color: var(--ink); background: var(--white);
}
.dashboard-status-strip small, .dashboard-status-strip strong { display: block; }
.dashboard-status-strip small { color: var(--muted); font-size: 11px; }
.dashboard-status-strip strong { margin-top: 2px; font-size: 13px; }
.status-dot { flex: 0 0 auto; width: 9px; height: 9px; border-radius: 50%; background: var(--muted); box-shadow: 0 0 0 4px #edf1f2; }
.status-dot.ok { background: var(--teal); box-shadow: 0 0 0 4px var(--teal-soft); }
.status-dot.attention { background: #d39a2d; box-shadow: 0 0 0 4px var(--warning-soft); }
.status-dot.danger-dot { background: var(--danger); box-shadow: 0 0 0 4px var(--danger-soft); }
.dashboard-shortcuts a strong small { display: block; margin-top: 4px; color: var(--muted); font-size: 11px; font-weight: 500; }
.priority-list { display: grid; }
.priority-list a {
  padding: 13px 0; display: flex; justify-content: space-between; gap: 15px;
  color: var(--ink); border-bottom: 1px solid var(--line);
}
.priority-list a:last-child { border-bottom: 0; }
.priority-list a strong {
  min-width: 34px; height: 28px; padding: 5px 8px; border-radius: 999px;
  color: var(--teal-dark); background: var(--teal-soft); text-align: center;
}

.report-filter-panel { display: flex; justify-content: space-between; gap: 18px; align-items: end; }
.report-presets { display: flex; flex-wrap: wrap; gap: 7px; }
.report-presets a {
  padding: 8px 11px; color: var(--muted); border: 1px solid var(--line);
  border-radius: 9px; background: var(--white); font-size: 12px; font-weight: 750;
}
.report-presets a:hover, .report-presets a.active { color: var(--teal-dark); border-color: #9ed8d2; background: var(--teal-soft); }
.report-period-form { display: flex; gap: 10px; align-items: end; }
.report-period-form label { display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 750; }
.report-period-form input { min-height: 40px; padding: 8px 10px; border: 1px solid var(--line); border-radius: 9px; font: inherit; }
.report-kpi > span:first-child { color: var(--muted); font-size: 12px; font-weight: 750; }
.report-kpi.primary > span:first-child { color: rgba(255,255,255,.8); }
.report-grid { display: grid; grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); gap: 20px; }
.bar-chart { display: grid; gap: 10px; max-height: 420px; overflow-y: auto; padding-right: 4px; }
.bar-chart-row { display: grid; grid-template-columns: 88px minmax(80px, 1fr) 120px; gap: 11px; align-items: center; font-size: 12px; }
.bar-track { height: 10px; overflow: hidden; border-radius: 999px; background: #edf2f2; }
.bar-track i { height: 100%; display: block; border-radius: inherit; background: linear-gradient(90deg, var(--teal), #4bc8bc); }
.bar-chart-row > strong { text-align: right; }
.report-callout { margin-top: 16px; padding: 14px; border-radius: 11px; background: #f5f8f8; }
.report-callout span, .report-callout strong, .report-callout small { display: block; }
.report-callout span, .report-callout small { color: var(--muted); font-size: 12px; }
.report-callout strong { margin: 4px 0; font-size: 21px; }
.automation-workspace { grid-template-columns: minmax(0, 1.35fr) minmax(300px, .65fr); }
.automation-token-callout { border-left: 4px solid var(--warning); background: var(--warning-soft); }
.automation-token-callout code { display: block; padding: 12px; border: 1px solid #e3cc91; background: var(--white); overflow-wrap: anywhere; }
.compact-button { min-height: 32px; padding: 6px 9px; font-size: 12px; }
.automation-api-form { margin-top: 18px; align-items: end; }
.automation-api-form .button { align-self: end; }
.quality-action-band { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.quality-action-band strong, .quality-action-band span { display: block; }
.quality-action-band span { margin-top: 4px; color: var(--muted); font-size: 13px; }
.checkbox-line { display: flex !important; grid-template-columns: auto 1fr; align-items: center; }
.checkbox-line input { width: auto; min-height: auto; }
.rank-list { display: grid; }
.rank-row { padding: 11px 0; display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 10px; align-items: center; border-bottom: 1px solid var(--line); }
.rank-row:last-child { border-bottom: 0; }
.rank-number { width: 25px; height: 25px; display: grid; place-items: center; color: var(--teal-dark); background: var(--teal-soft); border-radius: 8px; font-size: 11px; font-weight: 800; }
.rank-row strong, .rank-row small { display: block; }
.rank-row small { margin-top: 3px; color: var(--muted); }
.export-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 11px; }
.export-grid a {
  min-width: 0; padding: 14px; display: grid; grid-template-columns: 30px 1fr;
  gap: 2px 10px; color: var(--ink); border: 1px solid var(--line); border-radius: 11px;
}
.export-grid a:hover { border-color: #8acfc8; background: var(--teal-soft); }
.export-grid a > span { grid-row: 1 / 3; font-size: 20px; color: var(--teal-dark); }
.export-grid strong, .export-grid small { display: block; }
.export-grid small { color: var(--muted); }

@media (max-width: 1050px) {
  .topbar { padding: 0 18px; }
  .brand { min-width: auto; }
  .brand > span:last-child, .user-chip > span:last-child { display: none; }
  .menu-toggle { display: block; cursor: pointer; }
  .topbar nav {
    display: none; position: absolute; left: 0; right: 0; top: 68px; height: auto;
    background: var(--teal-dark); flex-direction: column; align-items: stretch;
    padding: 8px; box-shadow: var(--shadow);
  }
  .menu-open .topbar nav { display: flex; }
  .topbar nav a {
    min-height: 44px; place-items: center start; border: 0; border-radius: 8px;
    padding: 0 14px;
  }
  .user-chip, .user-menu { margin-left: 0; }
  .stat-grid { grid-template-columns: repeat(2, 1fr); }
  .catalogue-table { max-height: none; overflow-y: visible; border: 0; }
  .catalogue-table table,
  .catalogue-table tbody { display: block; }
  .catalogue-table thead {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap;
  }
  .catalogue-table tbody { display: grid; gap: 12px; }
  .catalogue-table tr {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0 18px; padding: 10px 14px; border: 1px solid var(--line);
    border-radius: 12px; background: var(--white);
  }
  .catalogue-table td {
    width: auto !important; min-width: 0; padding: 9px 0; border-bottom: 1px solid #edf0f1;
  }
  .catalogue-table td::before {
    content: attr(data-label); display: block; margin-bottom: 3px; color: var(--muted);
    font-size: 10px; font-weight: 800; letter-spacing: .05em; text-transform: uppercase;
  }
  .catalogue-table td[data-column="product"],
  .catalogue-table td[data-supplier-column="supplier"] { grid-column: 1 / -1; }
  .sale-workspace { grid-template-columns: 1fr; }
  .sale-workspace-side { position: static; display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
  .sale-workspace-side.sale-cart-column { display: block; }
  .sale-product-inputs { grid-template-columns: minmax(190px, .8fr) minmax(270px, 1.4fr) 100px; }
  .sale-product-inputs .add-product-button { grid-column: 1 / -1; }
  .transaction-workspace { grid-template-columns: 1fr; }
  .transaction-cart { position: static; }
  .transaction-product-bar { grid-template-columns: minmax(160px, .65fr) minmax(220px, 1.35fr) 70px; }
  .transaction-product-bar .button { grid-column: 1 / -1; }
  .dashboard-kpis, .report-kpis, .safety-kpis, .report-secondary-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-status-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-grid { grid-template-columns: 1fr; }
  .report-filter-panel { align-items: stretch; flex-direction: column; }
  .proposal-toolbar { grid-template-columns: minmax(0, 1fr) 170px; }
  .proposal-toolbar .button, .proposal-selection-status { width: 100%; }
  .proposal-row {
    grid-template-columns: 26px repeat(2, minmax(0, 1fr));
    align-items: start;
  }
  .proposal-product { grid-column: 2 / -1; }
  .proposal-metric { padding: 7px 0; }
  .proposal-metric:nth-of-type(3) { grid-column: 2; }
  .proposal-quantity { grid-column: 2 / -1; }
  .ocr-inline-table tr { grid-template-columns: repeat(12, minmax(0, 1fr)); }
  .ocr-inline-table td:nth-child(1) { grid-column: span 6; }
  .ocr-inline-table td:nth-child(2), .ocr-inline-table td:nth-child(3) { grid-column: span 3; }
  .ocr-inline-table td:nth-child(4), .ocr-inline-table td:nth-child(8) { grid-column: span 2; }
  .ocr-inline-table td:nth-child(5), .ocr-inline-table td:nth-child(7) { grid-column: span 3; }
  .ocr-inline-table td:nth-child(6) { grid-column: span 2; }
}

@media (max-width: 800px) {
  .topbar { height: 60px; }
  .sticky-record-header { top: 60px; margin-top: -12px; }
  .topbar nav { top: 60px; }
  .shell { padding: 26px 16px 50px; }
  .page-heading { align-items: stretch; flex-direction: column; }
  .heading-actions { flex-wrap: wrap; }
  .stat-grid, .dashboard-grid, .detail-grid { grid-template-columns: 1fr; }
  .kpi-grid, .kpi-grid.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .permission-grid { grid-template-columns: 1fr 1fr; }
  .inline-form, .filter-bar, .payment-row { align-items: stretch; flex-direction: column; }
  .inline-form > *, .filter-bar > *, .payment-row > * { width: 100%; }
  .mini-stat-grid, .mini-stat-grid.four { grid-template-columns: repeat(2, 1fr); }
  .filterbar { grid-template-columns: 1fr; align-items: stretch; }
  .filter-primary, .advanced-filters .filter-grid { grid-template-columns: 1fr; }
  .charges-filter-primary { grid-template-columns: 1fr; }
  .purchases-filter-primary, .purchase-line-form { grid-template-columns: 1fr; }
  .receipt-filter-primary, .receipt-entry-form { grid-template-columns: 1fr 1fr; }
  .receipt-document-form { grid-template-columns: 1fr 1fr; }
  .receipt-document-form .button { grid-column: 1 / -1; }
  .receipt-entry-form .receipt-note { grid-column: 1 / -1; }
  .receipt-workflow { grid-template-columns: 1fr; }
  .receipt-line-card > header { flex-direction: column; }
  .inventory-filter-primary { grid-template-columns: 1fr; }
  .table-toolbar { align-items: flex-start; flex-direction: column; }
  .column-chooser > div { left: 0; right: auto; }
  .shortcut-grid, .detail-list, .detail-list.wide { grid-template-columns: 1fr; }
  .form-grid { grid-template-columns: 1fr; }
  .ocr-scanner-choice { grid-template-columns: 1fr; }
  .ocr-scanner-choice .button { width: 100%; }
  .span-2 { grid-column: auto; }
  .product-actionbar { align-items: stretch; flex-direction: column; }
  .product-actionbar .heading-actions { display: grid; grid-template-columns: 1fr 1fr; }
  .product-actionbar .button { width: 100%; }
  .product-info-grid, .history-grid { grid-template-columns: 1fr; }
  .span-3 { grid-column: auto; }
  .drawer-form { grid-template-columns: 1fr; }
  .ingredient-actions, .ingredient-add-form { grid-template-columns: 1fr; }
  .ingredient-verify-form { padding: 14px 0 0; border-left: 0; border-top: 1px solid var(--line); }
  .sale-workspace-side, .sale-form-grid, .sale-product-inputs { grid-template-columns: 1fr; }
  .sale-search-console { grid-template-columns: 1fr; }
  .sale-search-feedback { align-items: flex-start; flex-direction: column; gap: 4px; }
  .new-sale-cart-head { display: none; }
  .new-sale-cart-line {
    grid-template-columns: minmax(0, 1fr) auto; padding: 14px 42px 14px 14px;
  }
  .new-sale-cart-product { grid-column: 1 / -1; }
  .cart-quantity-control { grid-column: 1; }
  .new-sale-cart-numbers { grid-column: 2; }
  .new-sale-cart-remove { position: absolute; top: 13px; right: 11px; }
  .sale-form-grid .span-2, .sale-product-inputs .add-product-button { grid-column: auto; }
  .sale-product-inputs .quantity-field { max-width: none; }
  .sale-page-heading .heading-actions .button { width: 100%; }
  .transaction-workspace { grid-template-columns: 1fr; }
  .transaction-cart { position: static; grid-row: 2; }
  .transaction-cart-lines { max-height: 380px; }
  .transaction-product-bar, .purchase-quick-bar { grid-template-columns: 1fr; }
  .psychotropic-sale-form { grid-template-columns: 1fr; }
  .proposal-toolbar { position: static; grid-template-columns: 1fr; }
  .proposal-group-heading { align-items: flex-start; flex-direction: column; }
  .proposal-row { grid-template-columns: 24px minmax(0, 1fr); }
  .proposal-product, .proposal-metric, .proposal-metric:nth-of-type(3),
  .proposal-quantity { grid-column: 2; }
  .entity-form-row, .entity-form-row.quote-line-row, .report-period-form { grid-template-columns: 1fr; display: grid; }
  .export-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .form-actions { flex-direction: column-reverse; }
  .related-list li { align-items: flex-start; flex-direction: column; gap: 4px; }
  .related-list span { text-align: left; }
  .company-strip { grid-template-columns: repeat(3, 1fr); gap: 15px; }
  .company-strip > div { padding-left: 0; border: 0; }
  .company-strip > a { grid-column: 1 / -1; }
  .searchbar { align-items: stretch; flex-direction: column; }
  .searchbar > div { align-items: stretch; flex-direction: column; max-width: none; }
  .compact-inline-form { align-items: stretch; flex-direction: column; }
  .receipt-form {
    position: fixed; inset: auto 12px 12px; width: auto; max-height: 82vh;
    overflow-y: auto; grid-template-columns: 1fr;
  }
  .lot-status-form {
    position: fixed; inset: auto 12px 12px; width: auto; max-height: 82vh;
    overflow-y: auto;
  }
  .stocktake-validation { align-items: stretch; flex-direction: column; }
  .scanner-layout { grid-template-columns: 1fr; }
  .scanner-pane { min-height: 0; }
  .scanner-pane video { aspect-ratio: 4 / 3; }
  .scanner-actions .button { flex: 1; }
  .table-wrap:not(.catalogue-table) table,
  .table-wrap:not(.catalogue-table) tbody { display: block; }
  .table-wrap:not(.catalogue-table) thead {
    position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
    overflow: hidden; clip: rect(0, 0, 0, 0); white-space: nowrap;
  }
  .table-wrap:not(.catalogue-table) tbody { display: grid; gap: 12px; }
  .table-wrap:not(.catalogue-table) tr {
    display: block; padding: 10px 14px; border: 1px solid var(--line);
    border-radius: 12px; background: var(--white);
  }
  .table-wrap:not(.catalogue-table) td {
    display: grid; grid-template-columns: minmax(100px, .8fr) minmax(0, 1.2fr);
    gap: 12px; align-items: start; width: 100%; padding: 8px 0;
  }
  .table-wrap:not(.catalogue-table) td::before {
    content: attr(data-label); color: var(--muted); font-size: 10px; font-weight: 800;
    letter-spacing: .05em; text-transform: uppercase;
  }
  .table-wrap td[colspan] { display: block; }
  .table-wrap td[colspan]::before { content: none; }
}

/* ============================================================
   Couche Avex Officine importée du prototype Claude.
   Elle conserve les composants du socle actuel et harmonise leur rendu.
   ============================================================ */

body {
  background:
    radial-gradient(circle at 82% 0, rgba(31, 122, 77, .055), transparent 31rem),
    var(--canvas);
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
.ui-icon {
  width: 20px; height: 20px; display: inline-block; flex: 0 0 auto;
  overflow: visible; vertical-align: -.2em;
}
.menu-toggle .ui-icon { width: 24px; height: 24px; display: block; }
.dashboard-ledger-icon { width: 16px; height: 16px; color: var(--info); }
.dashboard-shortcuts > a > .ui-icon { width: 22px; height: 22px; color: var(--info-dark); }
.sale-search-icon .ui-icon { width: 19px; height: 19px; display: block; }
.module-icon .ui-icon { width: 34px; height: 34px; }
.selected-product-icon { position: relative; font-size: 0; }
.selected-product-icon::after {
  content: ""; width: 11px; height: 6px; display: block;
  border-left: 2px solid currentColor; border-bottom: 2px solid currentColor;
  transform: translateY(-1px) rotate(-45deg);
}
::selection { background: rgba(22, 162, 98, .28); color: var(--ink); }
* { scrollbar-width: thin; scrollbar-color: var(--scrollbar-thumb, #c7d3cb) transparent; }
*::-webkit-scrollbar { width: 10px; height: 10px; }
*::-webkit-scrollbar-thumb { background: var(--scrollbar-thumb, #c7d3cb); border-radius: 99px; border: 2px solid var(--canvas); }
*::-webkit-scrollbar-track { background: transparent; }
:focus-visible { outline: 2px solid var(--teal); outline-offset: 2px; border-radius: 4px; }

h1, h2, h3, .page-heading h1, .panel-heading h2, .module-stage h2 {
  font-family: var(--font-display); font-weight: 400; letter-spacing: -.012em;
}
.eyebrow { color: var(--gold) !important; font-weight: 650; letter-spacing: .17em; font-size: 11px; }

.topbar {
  color: var(--header-ink);
  background: linear-gradient(105deg, var(--header-bg) 0%, var(--header-bg-2) 100%);
  border-bottom: 1px solid var(--header-border);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.07), 0 7px 24px rgba(13,42,29,.18);
}
.brand { color: var(--header-ink); }
.brand-mark { transform: none; border-radius: 9px; background: #fff; color: transparent; font-size: 0; position: relative; box-shadow: 0 3px 10px rgba(4,29,17,.25), inset 0 0 0 1px rgba(255,255,255,.7); }
.brand-mark::before, .brand-mark::after { content: ""; position: absolute; top: 50%; left: 50%; background: var(--teal); border-radius: 1px; transform: translate(-50%,-50%); }
.brand-mark::before { width: 18px; height: 7px; }
.brand-mark::after { width: 7px; height: 18px; }
.brand strong { font-size: 15px; font-weight: 600; letter-spacing: .08em; }
.brand small { color: var(--header-muted); opacity: 1; letter-spacing: .18em; text-transform: uppercase; font-size: 9px; }
nav a { border-bottom-width: 2px; font-weight: 500; transition: color .15s ease, background .15s ease, border-color .15s ease; }
nav a { color: var(--header-muted); }
nav a:hover { color: var(--header-ink); border-bottom-color: rgba(255,255,255,.38); background: var(--header-hover); }
nav a.active { color: var(--header-ink); font-weight: 600; border-bottom-color: var(--gold-bright); background: rgba(255,255,255,.1); }
.user-chip { color: var(--header-ink); }
.user-chip > span:first-child { color: var(--teal-dark); background: rgba(255,255,255,.94); border-color: rgba(255,255,255,.45); }
.user-chip small { color: var(--header-muted); opacity: 1; }
.logout-button { color: var(--header-ink); border-color: var(--header-border); }
.logout-button:hover { background: var(--header-hover); }
.menu-toggle { color: var(--header-ink); }
.user-menu-panel { background: var(--white); border-radius: 8px; border-color: var(--line); box-shadow: 0 18px 50px rgba(20,32,27,.16); }

/* La navigation complète reste élégante sur grand écran et devient un menu
   explicite avant que les modules ne puissent être tronqués. */
@media (max-width: 1800px) {
  body:not(.ui-sidebar) .menu-toggle { display: block; margin-left: auto; cursor: pointer; }
  body:not(.ui-sidebar) .user-menu { margin-left: 0; }
  body:not(.ui-sidebar) .topbar nav {
    display: none; position: absolute; left: 0; right: 0; top: 68px;
    max-height: calc(100vh - 68px); overflow-y: auto;
    padding: 10px 18px 16px; flex-direction: column; align-items: stretch;
    background: linear-gradient(145deg,var(--header-bg),var(--header-bg-2));
    border-bottom: 1px solid var(--header-border); box-shadow: 0 18px 36px rgba(9,35,23,.24);
  }
  body:not(.ui-sidebar).menu-open .topbar nav { display: flex; }
  body:not(.ui-sidebar) .topbar nav a {
    min-height: 44px; padding: 0 14px; place-items: center start;
    border: 0; border-radius: 8px;
  }
}

.button { border-radius: 8px; font-weight: 600; letter-spacing: 0; transition: transform .12s ease, box-shadow .15s ease, background .15s ease, border-color .15s ease; }
.button.primary { background: linear-gradient(135deg,#2d8b5b,var(--teal) 62%,#17633d); box-shadow: inset 0 1px 0 rgba(255,255,255,.2),0 4px 13px rgba(21,95,58,.22); }
.button.primary:hover { background: linear-gradient(135deg,#277d52,var(--teal-dark)); transform: translateY(-1px); box-shadow: inset 0 1px 0 rgba(255,255,255,.14),0 7px 19px rgba(21,95,58,.26); }
.button.primary:active { transform: translateY(0); }
.button.secondary { background: var(--white); }
.button.secondary:hover { border-color: var(--teal); box-shadow: 0 2px 10px rgba(20,32,27,.08); }

.panel, .stat-card, .kpi-card, .mini-stat-grid article, .dashboard-kpi, .report-kpi,
.myerp-status-strip > span, .help-directory-row, .command-palette, .support-message,
.mobile-scan-feed article, .flash, .module-nav, .purchase-nav, .new-sale-cart-empty,
.new-sale-cart-line { background-color: var(--white); }
.panel { position: relative; overflow: hidden; border-radius: 14px; border-color: var(--line); box-shadow: var(--shadow); }
.panel-heading { border-bottom: 1px solid var(--line); padding-bottom: 13px; }
.panel-heading h2 { font-family: var(--font-body); font-size: 20px; font-weight: 600; letter-spacing: -.015em; }
.panel.accent-green { background: linear-gradient(180deg,var(--teal-soft),var(--white) 170px); }
.panel.accent-amber { background: linear-gradient(180deg,var(--gold-soft),var(--white) 170px); }
.panel.accent-green::before, .panel.accent-amber::before { content: ""; position: absolute; inset: 0 0 auto; height: 3px; }
.panel.accent-green::before { background: linear-gradient(90deg,var(--teal-dark),var(--teal)); }
.panel.accent-amber::before { background: linear-gradient(90deg,var(--gold),var(--gold-bright)); }
.panel.accent-green .panel-heading h2 { color: var(--teal-dark); }
.panel.accent-amber .panel-heading h2 { color: var(--gold); }

.stat-card { border-radius: 13px; position: relative; overflow: hidden; transition: transform .15s ease, box-shadow .2s ease; }
.stat-card:hover { transform: translateY(-2px); box-shadow: 0 6px 24px rgba(20,32,27,.08); }
.stat-card strong { font-family: var(--font-display); font-weight: 400; font-size: 26px; font-variant-numeric: tabular-nums; }
.stat-card.accent { background: linear-gradient(140deg,#2c6f50,var(--teal-dark)); }
.stat-icon { border-radius: 7px; background: var(--gold-soft); color: var(--gold); }

/* Hiérarchie premium : moins de gras, davantage de contraste par la taille et l'espace. */
.section-kicker { font-weight: 650; letter-spacing: .11em; }
.panel-heading a, .panel-heading span { font-weight: 500; }
.list-row strong, .data-row strong, .rank-row strong,
.shortcut-grid strong, .entity-name, td strong,
.report-catalog-card strong, .priority-list a strong,
.dashboard-status-strip strong, .company-strip strong,
.quality-item-head strong, .print-center-card strong { font-weight: 600; }
.list-row small, .data-row small, .rank-row small,
.shortcut-grid strong small, .report-catalog-card p { font-weight: 400; }
.badge, .stock-pill, .mini-badge, .trend,
.report-presets a, .report-period-form label { font-weight: 600; }
.user-menu-title { font-weight: 650; }
.info { color: var(--info-dark); background: var(--info-soft); }
.flash.info { color: var(--info-dark); border-color: var(--info-line); background: var(--info-soft); }
.inline-flag.info, .mini-badge.info { color: var(--info-dark); border-color: var(--info-line); background: var(--info-soft); }
.module-icon, .rank-number {
  color: var(--info-dark); background: var(--info-soft); border: 1px solid var(--info-line);
}
.info-fieldset { background: var(--info-soft); border-color: var(--info-line); }
.report-callout { background: var(--info-soft); border: 1px solid var(--info-line); }
.help-step > span { background: var(--info); }
.report-kpi, .report-secondary-kpis article {
  border-radius: 14px;
  border-color: var(--line);
  box-shadow: 0 1px 2px rgba(20,46,33,.035), 0 12px 28px rgba(20,46,33,.055);
}
.report-kpi { padding: 21px 20px; }
.report-kpi > span:first-child { font-weight: 600; letter-spacing: .01em; }
.report-kpi > strong, .report-secondary-kpis strong {
  font-family: var(--font-display);
  font-weight: 600;
  letter-spacing: -.025em;
}
.report-secondary-kpis span { font-weight: 450; }
.report-kpi.primary {
  border-color: rgba(208,163,90,.48);
  background: linear-gradient(145deg,#123f2f 0%,#1d6646 58%,#2b8057 100%);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.12), 0 14px 32px rgba(18,63,47,.17);
}
.report-kpi.primary .trend { color: #fff; background: rgba(255,255,255,.14); }

th { letter-spacing: .08em; font-weight: 600; color: var(--muted); border-bottom-color: var(--line); }
td { border-bottom-color: var(--line); }
tbody tr { transition: background .12s ease; }
tbody tr:hover { background: var(--info-soft); }
.money { font-variant-numeric: tabular-nums; }

input:not([type="checkbox"]):not([type="radio"]), select, textarea,
.search-result, .autocomplete-results, .autocomplete-results button {
  color: var(--ink); background-color: var(--white);
}
.stacked-form input, .stacked-form select, .stacked-form textarea, .searchbar input { border-radius: 6px; transition: border-color .15s ease, box-shadow .15s ease; }
.stacked-form input:focus, .stacked-form select:focus, .stacked-form textarea:focus, .searchbar input:focus { border-color: var(--teal); box-shadow: 0 0 0 3px rgba(22,162,98,.18); outline: none; }

.quality-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 16px; }
.quality-item { min-width: 0; }
.quality-item-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; margin-bottom: 6px; }
.quality-item-head span { color: var(--muted); font-size: 12px; }
.quality-item-head strong { font-size: 18px; }
.quality-bar { height: 7px; border-radius: 99px; background: var(--line); overflow: hidden; }
.quality-bar > span { display: block; height: 100%; background: var(--teal); border-radius: 99px; }
.quality-bar.warn > span { background: var(--warning); }
.quality-bar.bad > span { background: var(--danger); }
.quality-item small { display: block; margin-top: 6px; color: var(--muted); font-size: 11px; }
.print-center-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(240px,1fr)); gap: 16px; margin-bottom: 16px; }
.print-center-card { color: var(--ink); display: flex; flex-direction: column; gap: 8px; transition: transform .13s ease,box-shadow .15s ease,border-color .15s ease; }
.print-center-card:hover { transform: translateY(-2px); border-color: var(--teal); box-shadow: 0 6px 20px rgba(20,32,27,.1); }
.print-center-card p { margin: 0; color: var(--muted); font-size: 13px; }
.print-center-card strong { font-size: 20px; }
.print-center-cta { margin-top: auto; color: var(--teal-dark); font-size: 12.5px; font-weight: 700; }

.sale-product-result-row { display: grid; grid-template-columns: minmax(0,1fr) auto; gap: 8px; align-items: stretch; }
.sale-product-result-row .sale-product-result { min-width: 0; }
.sale-equivalents-link { align-self: center; padding: 7px 10px; color: var(--teal-dark); background: transparent; border: 0; font-size: 11px; font-weight: 750; text-decoration: underline; cursor: pointer; }
.sale-equivalents-link:hover { color: var(--gold); }
.new-sale-cart-product .sale-equivalents-link { display: block; padding-left: 0; text-align: left; }
.mini-badge.danger { color: var(--danger); border-color: #eec4bf; background: var(--danger-soft); }
.sale-search-status[data-tone="danger"] { color: var(--danger); background: var(--danger-soft); }

body.auth-page { background: linear-gradient(165deg,var(--green-night) 0%,var(--green-night-2) 62%,#57886a 100%); min-height: 100vh; }
body.auth-page .topbar { background: transparent; border-bottom-color: transparent; box-shadow: none; }
body.auth-page .shell { display: grid; min-height: calc(100vh - 130px); place-items: center; }
.auth-shell { width: 100%; display: grid; place-items: center; }
.auth-card { width: min(420px,100%); padding: 38px 36px 32px; border-radius: 10px; border: 1px solid var(--line); background: var(--white); box-shadow: 0 26px 70px rgba(6,24,16,.4),0 2px 12px rgba(6,24,16,.22); display: grid; gap: 13px; }
.auth-card::before { content: ""; display: block; width: 46px; height: 3px; border-radius: 99px; background: linear-gradient(90deg,var(--teal),rgba(22,162,98,.2)); }
.auth-card h1 { margin: 0; font-size: 32px; }
.auth-card input { min-height: 46px; border-radius: 6px; background: var(--white); }

.flash { border-radius: 6px; border: 1px solid transparent; box-shadow: 0 6px 20px rgba(20,32,27,.08); animation: officine-flash-in .28s ease both; }
@keyframes officine-flash-in { from { opacity: 0; transform: translateY(-6px); } to { opacity: 1; transform: translateY(0); } }
.command-palette { border-radius: 9px; border-color: var(--line); box-shadow: 0 30px 90px rgba(5,18,13,.3); }
.command-palette::backdrop { background: rgba(14,47,38,.4); backdrop-filter: blur(3px); }

.dashboard-ledger { display: grid; grid-template-columns: minmax(280px,1.28fr) repeat(3,minmax(0,1fr)); align-items: stretch; background: var(--white); border: 1px solid var(--line); border-radius: 14px; box-shadow: var(--shadow); margin-bottom: 18px; overflow: hidden; }
.dashboard-ledger.role-aware { grid-template-columns: minmax(280px,1.28fr) repeat(3,minmax(0,1fr)); }
.dashboard-ledger-primary { padding: 26px 28px; position: relative; }
.dashboard-ledger-primary::before { content: ""; position: absolute; left: 0; top: 22px; bottom: 22px; width: 3px; background: linear-gradient(180deg,var(--teal),transparent); }
.dashboard-ledger-label { display: flex; justify-content: space-between; align-items: center; color: var(--muted); font-size: 12px; font-weight: 600; letter-spacing: .055em; text-transform: uppercase; margin-bottom: 11px; }
.dashboard-ledger-figure { font-family: var(--font-display); font-weight: 400; font-size: 44px; line-height: 1; margin-bottom: 12px; font-variant-numeric: tabular-nums; }
.dashboard-ledger-meta { color: var(--muted); font-size: 14px; margin-bottom: 13px; }
.dashboard-ledger-divider { background: var(--line); }
.dashboard-ledger-cell { padding: 24px 22px; }
.dashboard-ledger-cell + .dashboard-ledger-cell { border-left: 1px solid var(--line); }
.dashboard-ledger-sub { font-family: var(--font-display); font-weight: 400; font-size: 22px; margin-bottom: 7px; font-variant-numeric: tabular-nums; }
.dashboard-ledger-note { color: var(--muted); font-size: 13px; }
.chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border-radius: 99px; font-size: 12px; font-weight: 600; margin-top: 9px; }
.chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.chip.good { color: var(--teal-dark); background: var(--teal-soft); }
.chip.bad { color: var(--danger); background: var(--danger-soft); }
.chip.neutral { color: var(--muted); background: color-mix(in srgb,var(--white) 80%,var(--muted)); }

@media (max-width: 1120px) {
  .dashboard-ledger,
  .dashboard-ledger.role-aware { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .dashboard-ledger-cell:nth-child(odd) { border-left: 0; }
  .dashboard-ledger-cell { border-top: 1px solid var(--line); }
}
@media (max-width: 680px) {
  .dashboard-ledger,
  .dashboard-ledger.role-aware { grid-template-columns: 1fr; }
  .dashboard-ledger-divider { display: none; }
  .dashboard-ledger-cell { border-left: 0 !important; border-top: 1px solid var(--line); }
}
@media (max-width: 520px) {
  .user-menu { display: block; flex: 0 0 44px; min-width: 44px; min-height: 44px; }
  .user-chip { width: 44px; min-width: 44px; min-height: 44px; padding: 5px; display: grid; place-items: center; }
  .user-chip > span:first-child { width: 34px; height: 34px; display: grid; }
  .user-menu-panel { width: min(300px,calc(100vw - 16px)); right: 0; }
  .sale-product-result-row { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: no-preference) {
  .shell > * { animation: officine-rise .3s ease both; }
  .shell > *:nth-child(2) { animation-delay: .03s; }
  .shell > *:nth-child(3) { animation-delay: .06s; }
  @keyframes officine-rise { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
}
@media print { :root { --white: #fff; --canvas: #fff; --ink: #111; } body { background: var(--white); color: #111; } .shell > * { animation: none !important; } }

.connection-state { display: block; margin: 8px 14px; color: var(--muted); font-size: 12px; }
.connection-state.offline { color: #b42318; font-weight: 700; }
.workflow-steps { display: grid; gap: 12px; padding-left: 24px; color: var(--muted); }
.critical-panel { border-color: #f0b4ae; background: #fff8f7; }
.compact-form { min-width: 240px; padding: 10px 0; }
.mobile-pairing { align-items: center; text-align: center; }
.mobile-pairing img { width: min(320px, 100%); margin: auto; background: #fff; border-radius: 14px; }
.mobile-pairing a { overflow-wrap: anywhere; }
.mobile-scan-feed { display: grid; gap: 8px; max-height: 520px; overflow: auto; }
.mobile-scan-feed article { display: grid; gap: 3px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--white); }
.mobile-scan-feed span, .mobile-scan-feed small { color: var(--muted); overflow-wrap: anywhere; }
.mobile-scanner-page { min-height: 100vh; background: #edf7f5; }
.mobile-scanner-shell { width: min(620px, calc(100% - 24px)); margin: auto; padding: 16px 0 40px; }
.mobile-scanner-shell > header { display: flex; align-items: center; gap: 12px; margin-bottom: 14px; }
.mobile-scanner-shell > header div { display: grid; }
.mobile-scanner-shell video { width: 100%; max-height: 55vh; border-radius: 12px; background: #111; }
.offline-shell { padding-top: 32px; }
.offline-connection { align-self: flex-start; padding: 8px 12px; border-radius: 999px; background: #e8f7f2; color: #08755f; font-size: 13px; font-weight: 700; }
.offline-connection.offline { background: #fff1f0; color: #b42318; }
.offline-unlock { max-width: 680px; margin: 20px auto; }
.offline-unlock-form { max-width: 520px; }
.offline-actions { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 12px; }
.offline-drafts { display: grid; gap: 8px; }
.offline-draft { align-items: center; gap: 12px; }
.offline-draft span { min-width: 0; }
.offline-draft strong, .offline-draft small { display: block; overflow-wrap: anywhere; }
.offline-guarantees { margin-top: 20px; }
@media (max-width: 720px) {
  .offline-shell { padding: 18px 12px 32px; }
  .offline-actions .button { flex: 1 1 100%; }
  .offline-draft { align-items: flex-start; flex-direction: column; }
}
.support-conversation { display: grid; gap: 14px; }
.support-message { padding: 14px; border: 1px solid var(--line); border-radius: 12px; background: var(--white); }
.support-message.internal { border-style: dashed; background: #fff9e8; }
.support-message header { display: flex; justify-content: space-between; gap: 12px; }
.support-message p { white-space: pre-wrap; }
.priority-critique { background: #fee4e2; color: #b42318; }
.priority-haute { background: #fff0d6; color: #9a5b00; }
@media (max-width: 700px) { .mobile-scanner-shell .button { width: 100%; } .compact-form { min-width: 210px; } }

@media (max-width: 520px) {
  .topbar { padding: 0 10px; gap: 10px; }
  .sale-workspace-main .panel-heading > span { display: none; }
  .user-chip > span:first-child { display: none; }
  .logout-button { padding: 6px; }
  .catalogue-table tr { grid-template-columns: 1fr; }
  .catalogue-table td[data-column="product"],
  .catalogue-table td[data-supplier-column="supplier"] { grid-column: auto; }
  .mini-stat-grid, .mini-stat-grid.four { grid-template-columns: 1fr; }
  .kpi-grid, .kpi-grid.compact, .permission-grid { grid-template-columns: 1fr; }
  .purchase-nav { width: 100%; }
  .purchase-nav a { flex: 1; text-align: center; }
  .receipt-filter-primary, .receipt-entry-form { grid-template-columns: 1fr; }
  .receipt-document-form { grid-template-columns: 1fr; }
  .receipt-document-form .button { grid-column: auto; }
  .cart-checkout-primary, .cart-extra-payment { grid-template-columns: 1fr; }
  .cart-payment-reference { grid-column: auto; }
  .receipt-entry-form .receipt-note { grid-column: auto; }
  .product-actionbar .heading-actions { grid-template-columns: 1fr; }
  .selected-product-card { grid-template-columns: 30px minmax(0, 1fr); }
  .selected-product-card .button { grid-column: 1 / -1; width: 100%; }
  .sale-section, .sale-summary-card, .sale-submit-card { padding: 17px; }
  .dashboard-kpis, .report-kpis, .safety-kpis, .report-secondary-kpis,
  .dashboard-status-strip, .export-grid { grid-template-columns: 1fr; }
  .bar-chart-row { grid-template-columns: 72px minmax(50px, 1fr); }
  .bar-chart-row > strong { grid-column: 2; }
}
/* Reporting library */
.report-library {
  margin-top: 28px;
}

.report-library-heading {
  padding: 0 0 14px;
  border-bottom: 1px solid var(--border, #d8e0e5);
}

.report-category-band {
  padding: 22px 0;
  border-bottom: 1px solid var(--border, #d8e0e5);
}

.report-category-band h3 {
  margin: 0 0 12px;
  font-size: 1rem;
}

.report-catalog-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.report-catalog-card {
  display: flex;
  min-height: 150px;
  flex-direction: column;
  justify-content: space-between;
  gap: 14px;
  padding: 16px;
  border: 1px solid var(--border, #d8e0e5);
  border-radius: 6px;
  background: var(--white);
}

.report-catalog-card strong {
  display: block;
  font-size: .95rem;
}

.report-catalog-card p {
  margin: 7px 0 0;
  color: var(--muted, #5b6870);
  font-size: .84rem;
  line-height: 1.45;
}

.report-card-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 10px;
  font-size: .84rem;
}

.report-native-links {
  display: flex;
  flex-wrap: wrap;
  gap: 18px;
  padding: 18px 0 0;
}

.report-advanced-filters {
  width: 100%;
  min-width: 0;
  display: grid;
  grid-template-columns: repeat(12, minmax(0, 1fr));
  gap: 16px 14px;
  align-items: end;
}

.report-filter-panel {
  display: block;
  padding: 20px 22px;
}

.report-advanced-filters > label {
  grid-column: span 3;
  min-width: 0;
  display: grid;
  gap: 7px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 750;
}

.report-advanced-filters input,
.report-advanced-filters select {
  width: 100%;
  min-width: 0;
  min-height: 42px;
  padding: 9px 11px;
  color: var(--ink);
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 8px;
  outline: none;
}

.report-advanced-filters input:focus,
.report-advanced-filters select:focus {
  border-color: var(--teal);
  box-shadow: 0 0 0 3px var(--teal-soft);
}

.report-search-field {
  grid-column: span 3;
}

.report-search-field.wide {
  grid-column: span 6;
}

.report-filter-actions {
  grid-column: 1 / -1;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.report-result-panel {
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  margin-top: 18px;
}

.report-detail-page .shell {
  max-width: 1840px;
}

.report-table-wrap {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  max-height: min(66vh, 720px);
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  border: 1px solid #e6ecee;
  border-radius: 6px;
}

.report-data-table {
  width: 100%;
  min-width: 0;
  max-width: 100%;
  table-layout: fixed;
}

.report-data-table th,
.report-data-table td {
  width: auto;
  min-width: 0;
  max-width: none;
  padding: 10px 8px;
  white-space: normal;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.report-data-table th {
  white-space: normal;
  line-height: 1.25;
}

.report-data-table th:first-child,
.report-data-table td:first-child {
  width: auto;
  min-width: 0;
}

.report-data-table.report-columns-8 th,
.report-data-table.report-columns-8 td,
.report-data-table.report-columns-9 th,
.report-data-table.report-columns-9 td {
  padding-left: 7px;
  padding-right: 7px;
  font-size: 12px;
}

.report-data-table.report-columns-10 th,
.report-data-table.report-columns-10 td,
.report-data-table.report-columns-11 th,
.report-data-table.report-columns-11 td,
.report-data-table.report-columns-12 th,
.report-data-table.report-columns-12 td {
  padding-left: 6px;
  padding-right: 6px;
  font-size: 11px;
}

.report-data-table.report-columns-13 th,
.report-data-table.report-columns-13 td,
.report-data-table.report-columns-14 th,
.report-data-table.report-columns-14 td,
.report-data-table.report-columns-15 th,
.report-data-table.report-columns-15 td,
.report-data-table.report-columns-16 th,
.report-data-table.report-columns-16 td,
.report-data-table.report-columns-17 th,
.report-data-table.report-columns-17 td {
  padding-left: 5px;
  padding-right: 5px;
  font-size: 10px;
  line-height: 1.3;
}

.report-data-table thead th {
  position: sticky;
  top: 0;
  z-index: 1;
  background: #edf4f4;
}

.report-data-table tfoot td {
  position: sticky;
  bottom: 0;
  font-weight: 700;
  background: #dff5f1;
  border-top: 2px solid #0f766e;
}

.report-pagination {
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 12px;
  padding: 18px 2px 0;
}

.report-pagination-direction,
.report-pagination-pages {
  display: flex;
  align-items: center;
  gap: 7px;
}

.report-pagination a,
.report-pagination-pages strong,
.report-pagination-direction span {
  min-height: 34px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  padding: 6px 10px;
  border: 1px solid var(--line);
  border-radius: 6px;
  background: var(--white);
  font-size: 12px;
  font-weight: 750;
}

.report-pagination a {
  color: var(--teal-dark);
}

.report-pagination a:hover {
  color: white;
  background: var(--teal-dark);
  border-color: var(--teal-dark);
}

.report-pagination-pages strong {
  min-width: 34px;
  color: white;
  background: var(--teal);
  border-color: var(--teal);
}

.report-pagination-pages a {
  min-width: 34px;
}

.report-pagination-direction span {
  color: #9aa4a8;
  background: #f5f7f7;
}

.report-pagination-status {
  color: var(--muted);
  white-space: nowrap;
}

@media (max-width: 1050px) {
  .report-catalog-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .report-advanced-filters {
    grid-template-columns: repeat(6, minmax(0, 1fr));
  }

  .report-advanced-filters > label,
  .report-search-field,
  .report-search-field.wide {
    grid-column: span 3;
  }
}

@media (max-width: 680px) {
  .report-catalog-grid,
  .report-advanced-filters {
    grid-template-columns: 1fr;
  }

  .report-advanced-filters > label,
  .report-search-field,
  .report-search-field.wide,
  .report-filter-actions {
    grid-column: auto;
  }

  .report-filter-panel,
  .report-result-panel {
    padding: 16px;
  }

  .report-data-table,
  .report-data-table[class*="report-columns-"] {
    width: 100%;
    min-width: 0;
    max-width: 100%;
  }

  .report-filter-actions .button {
    flex: 1;
  }

  .report-pagination,
  .report-pagination-direction {
    justify-content: center;
  }

  .report-pagination-status {
    width: 100%;
    text-align: center;
    order: -1;
  }

  .report-detail-heading .heading-actions {
    width: 100%;
  }
}

/* Patient communication */
.communication-segments {
  margin: 22px 0;
}

.communication-segment-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
}

.communication-segment-grid article {
  min-height: 140px;
  padding: 15px;
  border: 1px solid var(--border, #d8e0e5);
  border-radius: 6px;
  background: var(--white);
}

.communication-segment-grid article > span {
  display: block;
  color: #0f766e;
  font-size: 1.45rem;
  font-weight: 750;
}

.communication-segment-grid article p {
  color: var(--muted, #5b6870);
  font-size: .82rem;
  line-height: 1.4;
}

.communication-segment-grid article small {
  color: #0f766e;
}

.communication-main-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.65fr) minmax(320px, .75fr);
  gap: 16px;
  margin: 18px 0;
  align-items: start;
}

.communication-main-grid.compact-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.communication-main-grid > .panel {
  margin: 0;
}

.communication-create-panel {
  position: sticky;
  top: 82px;
}

.communication-message-cell {
  max-width: 380px;
  white-space: normal;
}

.message-preview {
  margin-top: 16px;
  padding: 14px;
  border-left: 3px solid #0f766e;
  background: #f1f7f6;
}

.message-preview p {
  white-space: pre-wrap;
}

@media (max-width: 1050px) {
  .communication-segment-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .communication-main-grid,
  .communication-main-grid.compact-grid {
    grid-template-columns: 1fr;
  }

  .communication-create-panel {
    position: static;
  }
}

@media (max-width: 680px) {
  .communication-segment-grid {
    grid-template-columns: 1fr;
  }
}

/* Accounting workspace */
.accounting-period-panel {
  display: flex;
  justify-content: space-between;
  align-items: end;
  gap: 18px;
  margin-bottom: 18px;
}

.accounting-presets {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.accounting-presets a {
  padding: 8px 11px;
  border: 1px solid var(--border, #d8e0e5);
  border-radius: 5px;
  background: var(--white);
  font-size: .84rem;
}

.accounting-presets a.active {
  color: #fff;
  border-color: #0f766e;
  background: #0f766e;
}

.accounting-actions-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  margin: 18px 0;
}

.accounting-actions-grid .panel {
  margin: 0;
}

.accounting-report-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin: 18px 0;
}

.accounting-report-grid a {
  display: flex;
  min-height: 88px;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  padding: 14px;
  border: 1px solid var(--border, #d8e0e5);
  border-radius: 6px;
  background: var(--white);
}

.accounting-report-grid span,
.accounting-mapping-form td small {
  display: block;
  color: var(--muted, #5b6870);
  font-size: .78rem;
}

.accounting-mapping-form select {
  min-width: 300px;
}

@media (max-width: 1050px) {
  .accounting-report-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (max-width: 680px) {
  .accounting-period-panel,
  .accounting-actions-grid {
    display: grid;
    grid-template-columns: 1fr;
  }

  .accounting-report-grid {
    grid-template-columns: 1fr;
  }
}

/* Relations and MyERP */
.relation-workspace { align-items: start; }
.relation-table table { table-layout: fixed; }
.relation-table th:nth-child(1) { width: 21%; }
.relation-table th:nth-child(2) { width: 23%; }
.relation-table th:nth-child(3) { width: 24%; }
.relation-table th:nth-child(4) { width: 20%; }
.relation-table th:nth-child(5) { width: 12%; }
.timeline-row { display: grid; grid-template-columns: 145px minmax(0, 1fr); gap: 16px; padding: 14px 0; border-bottom: 1px solid var(--line); }
.timeline-row:last-child { border-bottom: 0; }
.timeline-row > span { color: var(--muted); font-size: 12px; }
.timeline-row strong, .timeline-row small { display: block; }
.timeline-row small { margin-top: 3px; color: var(--muted); }
.timeline-row p { margin: 8px 0; line-height: 1.5; }
.danger-zone, .compact-form { margin-top: 18px; padding-top: 16px; border-top: 1px solid var(--line); }
.relation-visit-form .form-grid { grid-template-columns: 1fr; }
.visit-completion-panel .form-actions { margin-top: 0; padding-top: 12px; }

.preparation-create-form .form-grid { grid-template-columns: 1fr; }
.preparation-type-nav a { display: inline-flex; align-items: center; gap: 7px; }
.preparation-type-nav a span {
  min-width: 21px; height: 21px; display: inline-grid; place-items: center;
  padding: 0 6px; border-radius: 10px; color: inherit; background: rgba(12, 155, 142, .1);
  font-size: 11px; font-weight: 800;
}
.preparation-type-nav a.active span { color: white; background: var(--teal-dark); }
.preparation-type-badge { white-space: normal; line-height: 1.25; }
.preparation-type-badge.magistrale { color: #315b86; background: #e8f1fa; border-color: #bfd3e8; }
.preparation-type-badge.officinale { color: #08766d; background: var(--teal-soft); border-color: #b8e1dc; }
.preparation-type-badge.reconditionnement { color: #8a5a0a; background: #fff3d6; border-color: #ead39d; }
.magistral-context {
  display: grid; gap: 12px; padding: 15px 0;
  border-top: 1px solid var(--line); border-bottom: 1px solid var(--line);
}
.magistral-context[hidden] { display: none; }
.magistral-context .section-kicker { margin: 0; }
.magistral-patient-panel { border-left: 4px solid #5c86ad; }
.pharmacovigilance-form { display: grid; gap: 16px; }
.pharmacovigilance-form .form-actions { margin-top: 0; padding-top: 2px; }

.recall-create-disclosure { margin-bottom: 18px; }
.recall-create-disclosure > summary { padding: 12px 0; }
.recall-create-form { padding-top: 16px; }
.recall-date-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.recall-date-grid label { min-width: 0; display: grid; gap: 6px; color: var(--muted); font-size: 13px; font-weight: 700; }
.recall-date-grid input { width: 100%; min-width: 0; border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; color: var(--ink); background: var(--white); }
.recall-dossier-list { border-top: 1px solid var(--line); }
.recall-dossier-row { display: grid; grid-template-columns: minmax(0, 1fr) minmax(270px, .34fr); gap: 22px; padding: 19px 0; border-bottom: 1px solid var(--line); }
.recall-dossier-title { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.recall-dossier-title > a { color: var(--ink); font-size: 16px; font-weight: 850; }
.recall-dossier-main p { margin: 8px 0; color: var(--muted); line-height: 1.45; }
.recall-dossier-meta { display: flex; flex-wrap: wrap; gap: 7px 15px; color: var(--muted); font-size: 12px; }
.recall-dossier-meta span { overflow-wrap: anywhere; }
.recall-dossier-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px 14px; align-content: center; }
.recall-dossier-stats span { color: var(--muted); font-size: 11px; }
.recall-dossier-stats strong { display: block; color: var(--ink); font-size: 17px; }
.recall-dossier-stats .button { grid-column: 1 / -1; justify-content: center; }
.recall-severity.information { color: #315b86; background: #e8f1fa; border-color: #bfd3e8; }
.recall-severity.mineur { color: #08766d; background: var(--teal-soft); border-color: #b8e1dc; }
.recall-severity.majeur { color: #8a5a0a; background: #fff3d6; border-color: #ead39d; }
.recall-severity.critique { color: #982d2d; background: var(--danger-soft); border-color: #e7b2ae; }
.recall-identity-panel { border-left: 4px solid #b77912; }
.recall-detail-list dd { overflow-wrap: anywhere; }
.recall-lot-table td small { max-width: 260px; }
.recall-item-followup { margin-top: 12px; }
.recall-item-followup form { padding-top: 15px; }
.recall-document-form { padding-bottom: 18px; border-bottom: 1px solid var(--line); }
.recall-document-list .data-row > span:last-child { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 7px; }
.recall-timeline .timeline-row { grid-template-columns: 1fr; }

@media (max-width: 900px) {
  .recall-date-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .recall-dossier-row { grid-template-columns: 1fr; }
  .recall-dossier-stats { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .recall-dossier-stats .button { grid-column: auto; }
}

@media (max-width: 620px) {
  .recall-date-grid, .recall-dossier-stats { grid-template-columns: 1fr; }
  .recall-dossier-stats .button { grid-column: auto; }
}

.myerp-status-strip > span { min-width: 0; padding: 13px 15px; display: flex; gap: 10px; align-items: center; color: var(--ink); background: var(--white); }
.help-directory { display: grid; gap: 1px; overflow: hidden; border: 1px solid var(--line); border-radius: 8px; background: var(--line); }
.help-directory-row { min-width: 0; padding: 18px 20px; display: flex; justify-content: space-between; gap: 24px; align-items: center; color: var(--ink); background: var(--white); }
.help-directory-row:hover { background: #f8fbfb; }
.help-directory-row small, .help-directory-row strong { display: block; }
.help-directory-row small { color: var(--teal-dark); font-size: 11px; font-weight: 800; text-transform: uppercase; }
.help-directory-row strong { margin-top: 3px; font-size: 17px; }
.help-directory-row p { margin: 5px 0 0; color: var(--muted); }
.help-directory-row > span:last-child { color: var(--teal-dark); font-size: 22px; }
.help-procedure { max-width: 980px; }
.help-step { display: grid; grid-template-columns: 42px minmax(0, 1fr); gap: 16px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.help-step:last-child { border-bottom: 0; }
.help-step > span { width: 36px; height: 36px; display: grid; place-items: center; color: white; background: var(--teal); border-radius: 50%; font-weight: 800; }
.help-step h2 { margin: 3px 0 7px; font-size: 18px; }
.help-step p { margin: 0; color: var(--muted); line-height: 1.55; }
.help-step .record-banner { margin: 12px 0 0; }

.command-palette { width: min(620px, calc(100% - 32px)); max-height: min(680px, calc(100vh - 50px)); padding: 0; overflow: hidden; color: var(--ink); background: var(--white); border: 1px solid var(--line); border-radius: 8px; box-shadow: 0 24px 80px rgba(19, 54, 59, .25); }
.command-palette::backdrop { background: rgba(17, 32, 38, .45); }
.command-palette-head { display: flex; justify-content: space-between; align-items: center; padding: 15px 17px; border-bottom: 1px solid var(--line); }
.command-palette-head button { width: 34px; height: 34px; border: 0; background: transparent; color: var(--muted); font-size: 24px; cursor: pointer; }
.command-palette > input { width: calc(100% - 32px); min-height: 44px; margin: 16px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 7px; outline: none; }
.command-palette > input:focus { border-color: var(--teal); box-shadow: 0 0 0 3px var(--teal-soft); }
.command-list { max-height: 480px; display: grid; gap: 2px; padding: 0 10px 12px; overflow-y: auto; }
.command-list a { padding: 11px 12px; color: var(--ink); border-radius: 6px; font-weight: 650; }
.command-list a:hover { background: var(--teal-soft); }

.density-choice { margin: 0; padding: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; border: 0; }
.density-choice legend { grid-column: 1 / -1; margin-bottom: 2px; color: var(--muted); font-size: 13px; font-weight: 600; }
.density-choice label {
  min-width: 0; padding: 13px; display: grid; grid-template-columns: auto minmax(0,1fr);
  gap: 10px; align-items: start; color: var(--ink); border: 1px solid var(--line);
  border-radius: 10px; background: var(--white); cursor: pointer;
}
.density-choice label:has(input:checked) { border-color: var(--teal); background: var(--teal-soft); box-shadow: 0 0 0 2px color-mix(in srgb,var(--teal) 15%,transparent); }
.density-choice input { width: 18px !important; height: 18px; margin: 2px 0 0; accent-color: var(--teal); }
.density-choice strong, .density-choice small { display: block; }
.density-choice strong { font-weight: 600; }
.density-choice small { margin-top: 4px; color: var(--muted); font-size: 11.5px; line-height: 1.4; }

@media (min-width: 801px) {
  body.density-compact .shell { padding-top: 30px; padding-bottom: 52px; }
  body.density-compact .panel { padding: 16px; margin-bottom: 14px; }
  body.density-compact .panel-heading { margin-bottom: 13px; padding-bottom: 10px; }
  body.density-compact .page-heading { margin-bottom: 18px; }
  body.density-compact .page-heading h1 { font-size: clamp(27px,3.2vw,36px); }
  body.density-compact .button { padding: 9px 14px; }
  body.density-compact td { padding-top: 9px; padding-bottom: 9px; font-size: 13px; }
  body.density-compact th { padding-top: 8px; padding-bottom: 8px; }
  body.density-compact .data-row,
  body.density-compact .list-row { padding-top: 9px; padding-bottom: 9px; }
  body.density-compact .dashboard-ledger-primary { padding: 20px 22px; }
  body.density-compact .dashboard-ledger-cell { padding: 18px; }
  body.density-compact .dashboard-ledger-figure { font-size: 38px; }
  body.density-compact .dashboard-status-strip a { padding: 10px 13px; }
  body.density-compact .shortcut-grid a { min-height: 72px; padding: 11px 12px; }
  body.density-compact .report-kpi { padding: 16px; }
  body.density-compact .report-secondary-kpis article { padding: 12px 15px; }
  body.density-compact .kpi-grid,
  body.density-compact .dashboard-grid,
  body.density-compact .report-kpis { gap: 12px; margin-bottom: 14px; }
}
.settings-list { max-height: 420px; margin-top: 18px; overflow-y: auto; }
.panel-toolbar { display: flex; flex-wrap: wrap; gap: 12px; align-items: center; padding: 0 0 14px; }
.panel-toolbar > span { margin-left: auto; color: var(--muted); font-size: 13px; }
.proposal-cart-panel { position: sticky; top: 88px; align-self: start; }
.proposal-cart-items { max-height: 440px; overflow-y: auto; }
.proposal-cart-items .data-row { align-items: flex-start; }
.receipt-value-preview { border-left: 4px solid var(--teal); }
.document-print-header { display: flex; justify-content: space-between; gap: 24px; padding-bottom: 15px; border-bottom: 2px solid var(--teal); }
.document-print-header > div:last-child { text-align: right; }
.document-print-header strong, .document-print-header small { display: block; }
.batch-print-document { margin-bottom: 24px; }
.notification-row > span:last-child { display: flex; gap: 8px; align-items: center; }
.settings-sequence-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.sequence-form { min-width: 0; display: grid; grid-template-columns: minmax(130px, 1.2fr) repeat(3, minmax(95px, .8fr)) auto; gap: 10px; align-items: end; padding: 14px; border: 1px solid var(--line); border-radius: 8px; }
.sequence-form > strong { align-self: center; overflow-wrap: anywhere; }
.sequence-form label { min-width: 0; display: grid; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 750; }
.sequence-form input { width: 100%; min-width: 0; min-height: 38px; padding: 8px 9px; border: 1px solid var(--line); border-radius: 6px; }

@media (min-width: 1351px) {
  body.ui-sidebar .topbar { width: 232px; height: 100vh; position: fixed; inset: 0 auto 0 0; padding: 22px 14px; flex-direction: column; align-items: stretch; gap: 18px; overflow: visible; }
  body.ui-sidebar .topbar .brand { min-width: 0; padding: 0 8px; }
  body.ui-sidebar .topbar nav { width: 100%; min-height: 0; display: flex; flex: 1; flex-direction: column; align-items: stretch; align-self: stretch; overflow-y: auto; }
  body.ui-sidebar .topbar nav a { min-height: 42px; padding: 0 12px; place-items: center start; border: 0; border-left: 3px solid transparent; border-radius: 6px; }
  body.ui-sidebar .topbar nav a:hover, body.ui-sidebar .topbar nav a.active { border-left-color: white; }
  body.ui-sidebar .topbar .user-menu { width: 100%; margin: 0; }
  body.ui-sidebar .topbar .user-chip { width: 100%; margin: 0; padding: 8px; }
  body.ui-sidebar .user-menu-panel { left: calc(100% + 12px); right: auto; top: auto; bottom: 0; }
  body.ui-sidebar .shell { width: calc(100% - 232px); max-width: 1600px; margin-left: 232px; margin-right: 0; }
  body.ui-sidebar.report-detail-page .shell { max-width: 1840px; }
}

@media (max-width: 800px) {
  .timeline-row { grid-template-columns: 1fr; gap: 5px; }
  .help-directory-row { align-items: flex-start; }
  .relation-table table { table-layout: auto; }
  .settings-sequence-grid { grid-template-columns: 1fr; }
  .sequence-form { grid-template-columns: 1fr 1fr; }
  .sequence-form > strong, .sequence-form .button { grid-column: 1 / -1; }
}

/* Priorité finale du thème : les modules ajoutés après la couche Avex héritent
   eux aussi des surfaces sombres et le menu compte reste utilisable sur mobile. */
:root[data-theme="dark"] .panel,
:root[data-theme="dark"] .stat-card,
:root[data-theme="dark"] .kpi-card,
:root[data-theme="dark"] .myerp-status-strip > span,
:root[data-theme="dark"] .help-directory-row,
:root[data-theme="dark"] .command-palette,
:root[data-theme="dark"] .support-message,
:root[data-theme="dark"] .mobile-scan-feed article,
:root[data-theme="dark"] .table-wrap:not(.catalogue-table) tr,
:root[data-theme="dark"] input:not([type="checkbox"]):not([type="radio"]),
:root[data-theme="dark"] select,
:root[data-theme="dark"] textarea {
  color: var(--ink);
  background: var(--white);
  border-color: var(--line);
}
:root[data-theme="dark"] .help-directory-row:hover,
:root[data-theme="dark"] tbody tr:hover { background: var(--teal-soft); }

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .panel,
  :root:not([data-theme="light"]) .stat-card,
  :root:not([data-theme="light"]) .kpi-card,
  :root:not([data-theme="light"]) .myerp-status-strip > span,
  :root:not([data-theme="light"]) .help-directory-row,
  :root:not([data-theme="light"]) .command-palette,
  :root:not([data-theme="light"]) .support-message,
  :root:not([data-theme="light"]) .mobile-scan-feed article,
  :root:not([data-theme="light"]) .table-wrap:not(.catalogue-table) tr,
  :root:not([data-theme="light"]) input:not([type="checkbox"]):not([type="radio"]),
  :root:not([data-theme="light"]) select,
  :root:not([data-theme="light"]) textarea {
    color: var(--ink);
    background: var(--white);
    border-color: var(--line);
  }
}

@media (max-width: 520px) {
  .user-menu { display: block; flex: 0 0 44px; min-width: 44px; min-height: 44px; }
  .user-chip { width: 44px; min-width: 44px; min-height: 44px; padding: 5px; display: grid; place-items: center; }
  .user-chip > span:first-child { width: 34px; height: 34px; display: grid !important; }
  .user-menu-panel { width: min(300px, calc(100vw - 16px)); right: 0; }
}

/* Cibles tactiles du pilote : compte, tiroir, filtres et notifications. */
.menu-toggle,
.command-palette-head button { min-width: 44px; min-height: 44px; }
#notifications-app button,
#notifications-app input:not([type="checkbox"]):not([type="radio"]),
#notifications-app select { min-height: 44px !important; }
#notifications-app input[type="checkbox"],
#notifications-app input[type="radio"] { width: 20px !important; height: 20px !important; }
.checkbox-line { min-height: 44px; padding: 8px 0; align-items: center; }

@media (max-width: 800px) {
  .filter-bar input,
  .filter-bar select,
  .filterbar input,
  .filterbar select,
  .inline-form input,
  .inline-form select,
  .module-nav a,
  .purchase-nav a { min-height: 44px; }
}

/* Contraste de lecture et sémantique finale. Le vert signale une action ou un
   état positif ; le bleu porte l'information neutre. */
.dashboard-status-strip small { font-size: 11.5px; }
.dashboard-shortcuts a strong small { font-size: 11.5px; }
.report-kpi > small, .report-secondary-kpis small,
.list-row small, .data-row small { font-size: 12.5px; }
th { font-size: 11.5px; }
.sequence-form label { color: var(--muted); font-size: 11.5px; font-weight: 600; }
.help-step > span { background: var(--info); }
.module-icon, .rank-number { color: var(--info-dark); background: var(--info-soft); border-color: var(--info-line); }
.inline-flag.info, .mini-badge.info { color: var(--info-dark); background: var(--info-soft); border-color: var(--info-line); }
:root[data-theme="dark"] .help-directory-row:hover,
:root[data-theme="dark"] tbody tr:hover { background: var(--info-soft); }
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) .help-directory-row:hover,
  :root:not([data-theme="light"]) tbody tr:hover { background: var(--info-soft); }
}

@media (max-width: 620px) {
  .density-choice { grid-template-columns: 1fr; }
}

/* ============================================================
   Couche « Avex Premium » (2026-07-20) — navigation en 8 groupes
   déroulants et accueil distingué. Repose sur les jetons existants.
   ============================================================ */

.nav-groupes { display: flex; align-items: stretch; gap: 2px; }
.nav-groupes .nav-lien,
.nav-groupes .groupe-titre {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 0 13px; min-height: 40px; border-radius: 8px;
  color: var(--header-muted); font-weight: 550; font-size: 14px;
  text-decoration: none; border-bottom: 2px solid transparent;
  white-space: nowrap; transition: color .15s ease, background .15s ease;
}
.nav-groupes .nav-lien:hover, .nav-groupes .groupe-titre:hover { color: var(--header-ink); background: var(--header-hover); }
.nav-groupes .nav-lien.active,
.nav-groupes .nav-groupe.active > .groupe-titre {
  color: var(--header-ink); font-weight: 600;
  background: rgba(255,255,255,.10); border-bottom-color: var(--gold-bright);
}
.nav-groupe { position: relative; display: flex; }
.nav-groupe .chevron { width: 7px; height: 7px; border-right: 1.6px solid currentColor; border-bottom: 1.6px solid currentColor; transform: rotate(45deg) translateY(-2px); opacity: .55; }
.nav-groupe:hover .chevron, .nav-groupe:focus-within .chevron { transform: rotate(225deg) translateY(-1px); }

.groupe-panneau {
  position: absolute; top: calc(100% + 6px); left: 0; z-index: 80;
  min-width: 240px; padding: 10px;
  background: var(--white); color: var(--ink);
  border: 1px solid var(--line); border-radius: 12px;
  box-shadow: 0 10px 24px rgba(13,42,29,.14), 0 30px 60px rgba(13,42,29,.14);
  display: none;
}
.nav-groupe:hover > .groupe-panneau,
.nav-groupe:focus-within > .groupe-panneau { display: block; }
.nav-groupe.droite > .groupe-panneau { left: auto; right: 0; }
.nav-groupe.large > .groupe-panneau.colonnes {
  display: none; grid-template-columns: repeat(4, minmax(170px, 1fr)); gap: 4px 20px; min-width: 720px;
}
.nav-groupe.large:hover > .groupe-panneau.colonnes,
.nav-groupe.large:focus-within > .groupe-panneau.colonnes { display: grid; }

.groupe-panneau a {
  display: flex; align-items: center; justify-content: space-between; gap: 10px;
  padding: 8px 11px; border-radius: 8px; border: 0;
  color: var(--ink); font-size: 13.5px; font-weight: 500; text-decoration: none;
}
.groupe-panneau a:hover { background: var(--teal-soft); color: var(--teal-dark); }
.groupe-panneau a kbd {
  font: 600 10.5px var(--font-body); color: var(--muted);
  border: 1px solid var(--line); border-radius: 5px; padding: 1px 5px; background: transparent;
}
.groupe-panneau .panneau-section {
  margin: 8px 3px 2px; font-size: 10.5px; font-weight: 700;
  letter-spacing: .09em; text-transform: uppercase; color: var(--gold);
}
.groupe-panneau .panneau-action {
  background: linear-gradient(135deg,#2d8b5b,var(--teal) 62%,#17633d);
  color: #fff; font-weight: 600; margin-bottom: 6px;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.2), 0 3px 10px rgba(21,95,58,.22);
}
.groupe-panneau .panneau-action:hover { background: linear-gradient(135deg,#277d52,var(--teal-dark)); color: #fff; }
.groupe-panneau .panneau-action kbd { color: rgba(255,255,255,.85); border-color: rgba(255,255,255,.4); }

/* Grand écran : la barre horizontale tient désormais (8 groupes) —
   on ne bascule en menu empilé qu'en dessous de 1100 px. */
@media (min-width: 1100px) {
  body:not(.ui-sidebar) .topbar nav.nav-groupes {
    display: flex !important; position: static; max-height: none;
    padding: 0; flex-direction: row; align-items: stretch;
    background: none; border: 0; box-shadow: none; overflow: visible;
  }
  body:not(.ui-sidebar) .menu-toggle { display: none !important; }
}

/* Menu empilé (petits écrans) : les intitulés de groupe mènent à la page
   d'accueil du module, qui porte sa propre sous-navigation. */
@media (max-width: 1099.98px) {
  body:not(.ui-sidebar) .nav-groupes { flex-direction: column; }
  body:not(.ui-sidebar) .nav-groupe { display: block; }
  body:not(.ui-sidebar) .nav-groupes .nav-lien,
  body:not(.ui-sidebar) .nav-groupes .groupe-titre { min-height: 44px; width: 100%; }
  body:not(.ui-sidebar) .groupe-panneau { display: none !important; }
  body:not(.ui-sidebar) .nav-groupe .chevron { display: none; }
}

/* Mode barre latérale (préférence utilisateur) : groupes déroulés en liste. */
body.ui-sidebar .nav-groupes { flex-direction: column; gap: 2px; }
body.ui-sidebar .nav-groupe { display: block; }
body.ui-sidebar .groupe-panneau,
body.ui-sidebar .nav-groupe.large > .groupe-panneau.colonnes {
  display: block; position: static; min-width: 0; box-shadow: none;
  border: 0; background: none; padding: 0 0 4px 14px;
}
body.ui-sidebar .groupe-panneau a { color: var(--header-muted); }
body.ui-sidebar .groupe-panneau a:hover { color: var(--header-ink); background: var(--header-hover); }
body.ui-sidebar .groupe-panneau .panneau-section { color: var(--gold-bright); }
body.ui-sidebar .nav-groupe .chevron { display: none; }

/* Accueil distingué */
.dashboard-heading h1 {
  /* Segoe UI réelle (pas la Light) pour un vrai demi-gras, sans faux gras. */
  font-family: var(--font-body); font-weight: 600;
  font-size: clamp(26px, 3.4vw, 36px); letter-spacing: -.01em;
}
.dashboard-heading .bienvenue-date {
  margin-top: 2px; color: var(--muted); font-size: 14px;
  display: inline-flex; align-items: center; gap: 8px;
}
.dashboard-heading .bienvenue-date::before {
  content: ""; width: 22px; height: 2px; border-radius: 2px; background: var(--gold-bright);
}

/* ---- Page Utilisateurs ----------------------------------------------------
   Tableau des comptes large à gauche, carte de création étroite à droite,
   sélecteur de rôle compact et boutons du tableau tous de taille identique. */
.users-admin {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
  align-items: start;
}
@media (max-width: 1180px) {
  .users-admin { grid-template-columns: 1fr; }
  .creer-compte-panel { max-width: 460px; }
}

.badge { white-space: nowrap; }
.accounts-panel th { white-space: nowrap; }
.accounts-panel .row-actions { flex-wrap: nowrap; gap: 8px; }

.role-form { display: inline-flex; gap: 8px; align-items: center; }
.role-form select {
  width: auto; min-width: 0; max-width: 150px;
  padding: 8px 26px 8px 10px; font-size: 13px; border-radius: 8px;
}
/* Tous les boutons du tableau (Changer, Droits, Désactiver) : même gabarit. */
.accounts-panel .button {
  min-width: 100px;
  padding: 8px 12px;
  font-size: 13px;
  white-space: nowrap;
}


/* Historique des modifications de fiches (produits, fournisseurs, clients). */
.fiche-history { list-style: none; margin: 0; padding: 0; display: grid; gap: 14px; }
.fiche-history-entry { border-left: 3px solid var(--warning); padding-left: 12px; }
.fiche-history-meta { display: flex; align-items: center; gap: 10px; margin-bottom: 4px; }
.fiche-history-meta small { color: var(--muted); }
.fiche-history-changes { list-style: none; margin: 0; padding: 0; font-size: 13px; display: grid; gap: 2px; }
.fiche-history-changes span { color: var(--muted); }
.fiche-history-old {
  color: var(--danger);
  background: var(--danger-soft);
  border-radius: 4px;
  padding: 0 4px;
  text-decoration: line-through;
}