:root {
  color-scheme: light;
  --canvas: #f5f5f7;
  --surface: #fff;
  --ink: #202024;
  --muted: #64646e;
  --line: #dedee4;
  --soft-line: #ebebef;
  --brand: #e6001a;
  --brand-hover: #c90017;
  --brand-focus: #ff5266;
  --brand-soft: #fff1f3;
  --green: #287a48;
  --green-hover: #1f6339;
  --link: #1c5f98;
  --link-hover: #134979;
  --slate: #0a0a0b;
  --nav-active: #242426;
  --radius: 6px;
  --shadow: 0 1px 2px rgb(30 45 60 / 3%);
  font-family: Inter, 'Segoe UI', system-ui, -apple-system, BlinkMacSystemFont, sans-serif;
  font-size: 14px;
  font-synthesis: none;
  color: var(--ink);
  background: var(--canvas);
}

*, *::before, *::after { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-width: 320px; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
button:disabled { cursor: default; opacity: .55; }
a { color: var(--link); }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, textarea:focus-visible, [tabindex]:focus-visible { outline: 2px solid var(--brand-focus); outline-offset: 2px; }
h1, h2, h3, p { margin: 0; }
svg { display: block; }
.icon-library { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.icon { width: 19px; height: 19px; flex: none; fill: none; stroke: currentColor; stroke-width: 1.7; stroke-linecap: round; stroke-linejoin: round; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip-link { position: fixed; z-index: 20; top: 8px; left: 8px; transform: translateY(-160%); border-radius: 8px; padding: 8px 12px; background: #fff; }
.skip-link:focus { transform: none; }

.app-layout { min-height: 100vh; display: grid; grid-template-columns: minmax(0, 1fr) auto; grid-template-rows: 52px 1fr; }
.sidebar { min-width: 0; position: sticky; z-index: 8; top: 0; display: flex; align-items: stretch; gap: 0; padding-left: 19px; background: var(--slate); color: #fff; }
.brand { flex: none; display: flex; align-items: center; gap: 8px; color: #fff; text-decoration: none; margin-right: 22px; white-space: nowrap; }
.brand-mark { position: relative; width: 22px; height: 34px; flex: none; overflow: hidden; }
.brand-mark img { position: absolute; top: 0; left: 50%; width: 43px; max-width: none; transform: translateX(-50%); }
.brand-text { font-family: Arial, Helvetica, sans-serif; font-size: 19px; font-weight: 750; letter-spacing: -.045em; }
.brand-text > span { font-weight: 500; }
.brand-text small { margin-left: 3px; color: #b3b3bd; font-size: 10px; letter-spacing: .055em; }
.sidebar-nav { display: flex; align-items: stretch; }
.nav-link, .demo-trigger { display: flex; align-items: center; gap: 6px; position: relative; padding: 0 13px; border: 0; background: transparent; color: #e5e5eb; text-align: left; font-size: 13px; font-weight: 600; white-space: nowrap; }
.nav-link .icon, .demo-trigger .icon { width: 16px; height: 16px; color: #b3b3bd; }
.nav-link:hover, .demo-trigger:hover { background: var(--nav-active); color: #fff; }
.nav-link.is-active, .nav-link[aria-current='page'] { background: var(--nav-active); color: #fff; }
.nav-link.is-active::after { content: ''; position: absolute; inset: auto 0 0; height: 3px; background: var(--brand); }
.nav-link.is-active .icon { color: var(--brand-focus); }
.sidebar-footer { margin-left: auto; display: flex; align-items: center; gap: 7px; padding: 0 11px; }
.global-help-nav { display: flex; align-self: stretch; }
.global-help-nav .nav-link { border-radius: 0; }
.topbar .mobile-help { display: none; }
.trade-in-order-options > summary { cursor: pointer; font-weight: 600; }
.trade-in-order-options[open] > summary { margin-bottom: 10px; }
.trade-in-order-options > .form-grid { margin-bottom: 10px; }
.demo-trigger { min-height: 32px; border-radius: 4px; padding-inline: 8px; }
.workspace .logout-button { color: #e5e5eb; border-color: transparent; background: transparent; }
.workspace .logout-button:hover { background: var(--nav-active); color: #fff; }
.sidebar-scrim, .mobile-menu, .mobile-nav { display: none; }

.main-layout { min-width: 0; grid-column: 1 / -1; }
.topbar { position: sticky; z-index: 8; top: 0; display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 0 18px 0 8px; background: var(--slate); }
.topbar-location, .topbar-tools { display: flex; align-items: center; gap: 8px; min-width: 0; }
.topbar-location { display: none; }
.sync-label { display: inline-flex; align-items: center; gap: 6px; color: #dedee5; font-size: 12px; font-weight: 570; white-space: nowrap; }
.sync-label::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #adadb8; }
.sync-label[data-state='ready']::before { background: #75c58d; }
.sync-label[data-state='demo']::before { background: #e4ae56; }
.sync-label[data-kind='error']::before, .sync-label[data-state='error']::before { background: #ec8388; }
.icon-button { width: 32px; height: 32px; display: inline-grid; place-items: center; padding: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); color: var(--muted); }
.icon-button:hover { background: #f0f5fa; color: var(--link-hover); }
.icon-button .icon { width: 17px; height: 17px; }
.topbar .icon-button { border-color: #3b3b42; background: #202024; color: #e5e5eb; }
.topbar .icon-button:hover { background: #34343a; color: #fff; }
.section-tabs { min-height: 40px; padding: 0 20px; border-bottom: 1px solid var(--line); background: var(--surface); }
.section-tabs nav { display: flex; align-items: stretch; gap: 3px; }
.section-tabs button { position: relative; min-height: 40px; flex: none; padding: 0 13px; border: 0; background: transparent; color: var(--muted); font-size: 13px; font-weight: 570; white-space: nowrap; }
.section-tabs button:hover { background: var(--brand-soft); color: var(--brand-hover); }
.section-tabs button.is-active, .section-tabs button[aria-current='page'] { color: var(--brand-hover); font-weight: 690; }
.section-tabs button.is-active::after, .section-tabs button[aria-current='page']::after { content: ''; position: absolute; height: 2px; inset: auto 0 0; background: var(--brand); }

.main-content { margin: 0 auto; padding: 19px 20px 34px; }
.main-content:focus { outline: 0; }
.page-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; margin-bottom: 15px; }
.page-heading { min-width: 0; }
.page-heading h1 { font-size: clamp(22px, 2.05vw, 28px); font-weight: 710; line-height: 1.15; letter-spacing: -.027em; }
.page-heading p { margin-top: 4px; color: var(--muted); line-height: 1.4; font-size: 13px; }
.page-tools, #page-actions { display: flex; align-items: center; gap: 10px; }
.today-label { white-space: nowrap; display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 12px; font-weight: 650; margin-right: 4px; }
.today-label .icon { width: 16px; height: 16px; }
.button { min-height: 32px; display: inline-flex; align-items: center; justify-content: center; gap: 6px; width: fit-content; border: 1px solid transparent; border-radius: var(--radius); padding: 5px 10px; background: var(--surface); color: var(--ink); font-size: 13px; font-weight: 620; line-height: 1.35; text-align: center; white-space: nowrap; text-decoration: none; }
.button .icon { width: 16px; height: 16px; }
.button.primary, .button-primary { padding-inline: 11px; background: var(--brand); color: #fff; }
.button.primary:hover, .button-primary:hover { background: var(--brand-hover); }
.button.secondary, .button-secondary { border-color: var(--line); background: var(--surface); color: var(--ink); }
.button.secondary:hover, .button-secondary:hover, .button[aria-expanded='true'], .button[aria-pressed='true'] { border-color: #9db8d0; background: #ecf4fb; color: var(--link-hover); }
.button.danger, .button-danger { border-color: #f1d3d7; color: #a92c3d; }
.button.danger:hover, .button-danger:hover { background: #fff2f4; }
.text-button { display: inline-flex; align-items: center; gap: 4px; padding: 1px 0; border: 0; background: transparent; color: var(--link); font-size: 13px; font-weight: 590; line-height: 1.4; text-align: left; }
.text-button:hover { text-decoration: underline; text-underline-offset: 3px; }
.text-button .icon { width: 14px; height: 14px; }
.text-button.danger { color: #aa3444; }
.loading-state { min-height: 120px; display: grid; place-items: center; padding: 22px; color: var(--muted); }
.demo-banner { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-bottom: 14px; border: 1px solid #e9d7aa; border-radius: var(--radius); padding: 5px 9px; background: #fff8e7; color: #704e16; font-size: 13px; }

.overview { display: grid; gap: 13px; }
.metrics { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.metric-card { min-width: 0; min-height: 104px; border: 1px solid var(--line); border-radius: var(--radius); padding: 11px 13px; background: var(--surface); box-shadow: var(--shadow); }
.metric-revenue { border-top: 2px solid #609e73; }
.metric-heading { display: flex; align-items: center; justify-content: space-between; gap: 4px; }
.metric-heading h2 { font-size: 13px; font-weight: 650; color: #526171; }
.metric-icon { display: grid; place-items: center; width: 29px; height: 29px; flex: none; border-radius: var(--radius); background: #e7f3ea; color: #297048; }
.metric-orders .metric-icon { background: #ebf2fa; color: #315f8a; }
.metric-products .metric-icon { background: #fff0dc; color: #a56419; }
.metric-customers .metric-icon { background: #e6f5ed; color: #21785e; }
.metric-icon .icon { width: 17px; height: 17px; }
.metric-value { margin: 6px 0 4px; color: var(--ink); font-size: clamp(21px, 2.15vw, 30px); font-weight: 710; line-height: 1.08; letter-spacing: -.035em; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.metric-note { color: var(--muted); font-size: 12px; line-height: 1.4; }

.insight-grid { display: grid; grid-template-columns: minmax(0, 1.9fr) minmax(245px, 1fr); gap: 13px; align-items: stretch; }
.panel { min-width: 0; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow); }
.panel-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 9px; padding: 13px 14px 0; }
.panel-header h2 { font-size: 16px; font-weight: 680; letter-spacing: -.015em; line-height: 1.2; }
.panel-header p { color: var(--muted); margin-top: 5px; font-size: 12px; line-height: 1.4; }
.sales-panel { overflow: hidden; }
.period-select { position: relative; flex: none; }
.period-select select { min-height: 31px; appearance: none; padding: 4px 26px 4px 9px; border: 1px solid var(--line); border-radius: var(--radius); background: var(--surface); color: var(--ink); font-size: 12px; font-weight: 630; cursor: pointer; }
.period-select .icon { position: absolute; width: 13px; height: 13px; top: 50%; right: 8px; transform: translateY(-50%); pointer-events: none; color: var(--muted); }
.sales-summary { display: flex; align-items: baseline; flex-wrap: wrap; gap: 9px; margin: 8px 14px 0; }
.sales-summary strong { font-size: 21px; letter-spacing: -.03em; font-weight: 690; }
.chart-legend { display: inline-flex; align-items: center; gap: 5px; color: var(--muted); font-size: 11px; font-weight: 600; }
.chart-legend::before { content: ''; width: 7px; height: 7px; border-radius: 50%; background: #3376a9; }
.sales-chart { min-height: 204px; padding: 2px 17px 9px; }
.sales-svg { display: block; width: 100%; height: 202px; overflow: visible; }
.chart-axis { fill: var(--muted); font-family: inherit; }
.chart-line, .chart-dot { stroke: #3376a9; }
#sales-area stop { stop-color: #3376a9; }

.stock-panel { display: flex; flex-direction: column; }
.stock-heading-icon { display: grid; place-items: center; flex: none; width: 29px; height: 29px; border-radius: var(--radius); background: #fff2df; color: #99601d; }
.stock-heading-icon .icon { width: 17px; height: 17px; }
.stock-list { display: grid; flex: 1; align-content: start; min-height: 144px; padding: 7px 14px 4px; }
.stock-item { min-height: 42px; display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 8px; padding: 5px 0; border-bottom: 1px solid var(--soft-line); }
.stock-item:last-child { border-bottom: 0; }
.stock-icon { width: 28px; height: 28px; display: grid; place-items: center; border-radius: var(--radius); background: #ebf2fa; color: #496b8b; }
.stock-icon .icon { width: 16px; height: 16px; }
.stock-name { display: block; font-weight: 700; font-size: 13px; line-height: 1.3; overflow-wrap: anywhere; }
.stock-detail { display: block; margin-top: 2px; color: var(--muted); font-size: 11px; line-height: 1.3; overflow-wrap: anywhere; }
.stock-count { min-width: 44px; width: fit-content; border-radius: 6px; padding: 4px 6px; color: #8c5314; background: #fff0db; text-align: center; font-size: 11px; font-weight: 700; white-space: nowrap; }
.stock-count[data-empty='true'] { color: #8e354c; background: #fae9ee; }
.stock-footer { margin-top: auto; padding: 8px 14px; border-top: 1px solid var(--soft-line); }
.stock-list .empty-state { align-self: center; min-height: 144px; padding: 14px 4px; }
.recent-panel { overflow: hidden; }
.recent-panel .panel-header { align-items: center; padding-bottom: 10px; }
.recent-link { min-height: 30px; font-size: 12px; }

.table-wrap { width: 100%; overflow-x: auto; }
table { width: 100%; border-collapse: collapse; text-align: left; font-size: 13px; font-variant-numeric: tabular-nums; }
thead { background: #ecf0f4; color: #4a5c6d; }
th { font-size: 12px; font-weight: 650; white-space: nowrap; }
th, td { padding: 7px 10px; border-bottom: 1px solid var(--soft-line); vertical-align: middle; }
th { border-bottom-color: #d6dfe7; }
th:first-child, td:first-child { padding-left: 13px; }
th:last-child, td:last-child { padding-right: 13px; }
tbody tr:last-child td { border-bottom: 0; }
tbody tr:nth-child(even) { background: #fafbfd; }
tbody tr:hover { background: #eef5fc; }
tbody tr.is-selected { background: #e5f1fb; }
.record-primary { display: block; color: var(--link); font-weight: 610; }
.record-primary.text-button { text-align: left; }
.record-secondary { display: block; margin-top: 2px; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.muted { color: var(--muted); }
.row-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 4px; }
.row-actions .button { min-height: 27px; padding-block: 3px; font-size: 12px; }
.row-actions .icon-button { width: 28px; height: 28px; border-color: transparent; background: transparent; }
.row-actions .icon-button:hover { border-color: #bdd0e0; background: #f0f5fa; }
.row-actions .icon-button .icon { width: 15px; height: 15px; }
.badge { display: inline-flex; align-items: center; gap: 4px; width: fit-content; border-radius: 3px; padding: 3px 6px; background: #edf1f5; color: #4e6070; font-size: 11px; font-weight: 650; white-space: nowrap; }
.badge[data-status='new'], .badge.status-new, .badge.new { background: #eaeffe; color: #3e54a2; }
.badge[data-status='processing'], .badge.status-processing, .badge.processing { background: #fff0d9; color: #84520d; }
.badge[data-status='completed'], .badge.status-completed, .badge.completed { background: #e4f5ed; color: #1a694d; }
.badge[data-status='cancelled'], .badge.status-cancelled, .badge.cancelled { background: #fae9ee; color: #8e354c; }
.badge[data-status='stock-low'] { background: #fff0d9; color: #84520d; }
.badge[data-status='stock-ok'] { background: #e4f5ed; color: #1a694d; }
.badge[data-status='payment-paid'], .badge[data-status='received'] { background: #e4f5ed; color: #1a694d; }
.badge[data-status='payment-partial'], .badge[data-status='partial'] { background: #fff0d9; color: #84520d; }
.cell-detail { display:block; color:var(--muted, #566578); margin-top:3px; }
.inbox-text { white-space:pre-wrap; overflow-wrap:anywhere; }
.badge[data-status='payment-unpaid'] { background: #fae9ee; color: #8e354c; }
.badge[data-status='payment-overpaid'] { background: #eaeffe; color: #3e54a2; }
.order-payment-summary { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 18px; margin-bottom: 12px; padding: 8px 10px; border: 1px solid var(--line); background: #f4f7fa; }
.finance-balances { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; margin-bottom: 12px; }
.finance-balances .panel { display: grid; align-content: start; gap: 5px; padding: 12px; }
.finance-balances .panel span { color: var(--muted); font-size: 12px; }
.finance-balances .panel strong { color: var(--ink); font-size: clamp(15px, 2.1vw, 23px); font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.finance-balances .panel:last-child { border-color: #8ab99e; background: #f4faf6; }
.cash-overview { margin-bottom: 16px; }
.cash-overview-table { width: 100%; font-variant-numeric: tabular-nums; }
.cash-overview-table :is(th, td):not(:first-child) { text-align: right; }
.cash-overview-table th small { color: var(--muted); margin-inline-start: 4px; }
.cash-overview-note { margin: 6px 0 0; color: var(--muted); font-size: 12px; }
.cash-accounts { margin-top: 12px; }
.cash-accounts header { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 12px; }
.cash-accounts h2 { font-size: 15px; }
.cash-accounts ul { margin: 0; padding: 0; list-style: none; }
.cash-accounts [data-cash-account-rows] > li { display: flex; flex-wrap: wrap; align-items: center; gap: 5px 14px; border-top: 1px solid var(--line); padding: 9px 12px; }
.cash-accounts [data-cash-account-rows] > li > span { flex: 1 0 160px; min-width: 0; overflow-wrap: anywhere; }
.cash-accounts li small { display: block; color: var(--muted); }
.cash-accounts li ul { display: flex; flex-wrap: wrap; gap: 5px 12px; font-variant-numeric: tabular-nums; }
.finance-in { color: #1a694d; font-variant-numeric: tabular-nums; }
.finance-out { color: #8e354c; font-variant-numeric: tabular-nums; }
.finance-details { display: grid; grid-template-columns: minmax(95px, 0.6fr) minmax(0, 1.4fr); gap: 9px; margin: 0; }
.finance-details dt { color: var(--muted); }
.finance-details dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
.finance-transfer-help { margin-top: 12px; color: var(--muted); font-size: 13px; }
.transfer-side { display: grid; align-content: start; gap: 8px; min-width: 0; margin: 0; padding: 9px; border: 1px solid var(--line); border-radius: var(--radius); }
.transfer-side legend { padding-inline: 4px; font-size: 13px; font-weight: 650; }
.finance-currency-choices { display: flex; flex-wrap: wrap; gap: 9px 16px; }
.transfer-side input[readonly] { background: var(--canvas); }
.document-dialog .form-actions { flex-wrap: wrap; }
.document-dialog .dialog-body .form-grid .badge { justify-self: start; }
.empty-state { display: grid; justify-items: center; align-content: center; gap: 6px; min-height: 108px; padding: 18px; text-align: center; color: var(--muted); font-size: 13px; line-height: 1.4; }
.empty-state > .icon, .empty-icon { box-sizing: content-box; width: 21px; height: 21px; border-radius: var(--radius); background: #eaf0f6; color: #4c6c8b; padding: 8px; margin-bottom: 3px; }
.empty-state strong, .empty-state h3 { color: var(--ink); font-size: 14px; }
.empty-state .button, .empty-state .text-button { margin-top: 4px; }

.toolbar { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; padding: 9px 11px; border-bottom: 1px solid var(--line); }
.toolbar > * { min-width: 0; }
.toolbar label { display: inline-flex; align-items: center; gap: 7px; color: var(--muted); font-size: 13px; }
.toolbar select, .search-input { min-height: 32px; border: 1px solid #cdd6df; border-radius: var(--radius); padding: 5px 8px; background: var(--surface); color: var(--ink); font-size: 13px; }
.search-input { display: inline-flex; align-items: center; gap: 7px; width: min(290px, 100%); }
.search-input .icon { width: 17px; height: 17px; }
.search-input input { width: 100%; min-width: 0; border: 0; padding: 0; color: var(--ink); background: transparent; }
.search-input input:focus-visible { outline: 0; }
.search-input:focus-within { outline: 2px solid #2875b4; outline-offset: 1px; }
.directory-controls, .directory-tools { display: flex; align-items: center; flex-wrap: wrap; gap: 7px; }
.filter-panel { padding: 10px 11px; border-bottom: 1px solid var(--line); background: #f4f7fa; }
.filter-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(145px, 1fr)); gap: 8px; max-width: 980px; }
.filter-panel .field { font-weight: 590; }
.filter-panel .field input, .filter-panel .field select { min-height: 32px; }
.filter-panel .button { align-self: end; }
.table-sort { display: inline-flex; align-items: center; gap: 4px; padding: 0; border: 0; background: transparent; color: inherit; font-weight: inherit; text-align: left; white-space: nowrap; }
.product-directory-table td { overflow-wrap: anywhere; }
.table-sort:hover, th[aria-sort='ascending'] .table-sort, th[aria-sort='descending'] .table-sort { color: var(--link); }
.table-sort .icon { width: 13px; height: 13px; }
.table-check { width: 15px; height: 15px; margin: 0; vertical-align: middle; accent-color: var(--green); }
.directory-mobile-sort { display: none !important; }
.directory-footer, .entity-summary { padding: 8px 11px; border-top: 1px solid var(--line); color: var(--muted); background: #f7f9fb; font-size: 12px; }
.directory-footer { display: flex; align-items: center; flex-wrap: wrap; justify-content: space-between; gap: 8px; }
.directory-footer .entity-summary { padding: 0; border: 0; background: transparent; }

.order-view-switch { display: inline-flex; align-items: center; }
.order-view-switch .button { border-radius: 0; }
.order-view-switch .button:first-child { border-radius: var(--radius) 0 0 var(--radius); }
.order-view-switch .button:last-child { margin-left: -1px; border-radius: 0 var(--radius) var(--radius) 0; }
.order-view-switch .button[aria-pressed='true'] { position: relative; z-index: 1; }
.calendar-header { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 8px; padding: 9px 11px; border-bottom: 1px solid var(--line); }
.calendar-header h2 { font-size: 16px; font-weight: 680; }
.calendar-navigation { display: flex; align-items: center; gap: 5px; }
.calendar-weekdays, .calendar-grid { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); margin: 0; padding: 0; list-style: none; }
.calendar-weekdays { background: #ecf0f4; color: #4a5c6d; font-size: 12px; font-weight: 650; }
.calendar-weekdays > * { padding: 6px 9px; }
.calendar-day { min-width: 0; min-height: 90px; padding: 7px 8px; border: solid var(--line); border-width: 1px 1px 0 0; }
.calendar-day:nth-child(7n) { border-right: 0; }
.calendar-day.is-outside { background: #f5f7f9; color: #74808e; }
.calendar-day.is-today { background: #f0f7fc; }
.calendar-date { display: inline-flex; align-items: center; min-height: 20px; color: #48596b; font-weight: 630; font-variant-numeric: tabular-nums; }
.calendar-day.is-today .calendar-date { border-radius: 3px; padding: 0 5px; background: #dceefa; color: #1e5b8e; }
.calendar-date-long { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.calendar-empty { padding: 8px 11px; border-top: 1px solid var(--line); color: var(--muted); }
.calendar-day-orders { display: grid; gap: 4px; padding: 0; margin: 4px 0 0; list-style: none; }
.calendar-order { width: 100%; display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px; padding: 4px 5px; border: 1px solid #cce0f0; border-left: 3px solid #82abcc; border-radius: 3px; background: #eff7fd; color: var(--link); font-size: 12px; text-align: left; overflow-wrap: anywhere; }
.calendar-order:hover { border-color: #8db6d5; background: #e6f2fc; }
.calendar-order[data-status='processing'] { border-left-color: #c69148; }
.calendar-order[data-status='completed'] { border-left-color: #62a381; }
.calendar-order[data-status='cancelled'] { border-left-color: #bf7c89; }
.calendar-order > * { min-width: 0; }
.calendar-unscheduled { padding: 9px 11px; border-top: 1px solid var(--line); background: #f7f9fb; }
.calendar-unscheduled summary { width: fit-content; cursor: pointer; color: var(--link); font-weight: 620; }
.calendar-unscheduled ul { display: grid; gap: 4px; padding: 0; margin: 7px 0 0; list-style: none; }
.calendar-unscheduled .calendar-order { max-width: 460px; }

.editor-dialog { width: min(760px, calc(100% - 26px)); max-height: min(88dvh, 900px); border: 1px solid var(--line); border-radius: 6px; padding: 0; color: var(--ink); background: var(--surface); box-shadow: 0 18px 60px rgb(24 39 54 / 26%); }
.editor-dialog::backdrop { background: rgb(24 39 54 / 50%); }
.editor-dialog form { max-height: min(88dvh, 900px); display: flex; flex-direction: column; }
.dialog-header, .form-actions { flex: none; display: flex; align-items: center; justify-content: space-between; gap: 9px; padding: 9px 13px; background: #f3f6f9; }
.dialog-header { border-bottom: 1px solid var(--line); }
.dialog-header h2 { font-size: 19px; font-weight: 680; line-height: 1.25; letter-spacing: -.02em; }
.dialog-body { overflow: auto; padding: 13px; }
.document-dialog .dialog-body > .table-wrap { margin-block: 11px; border: 1px solid var(--line); border-radius: var(--radius); }
.document-dialog .dialog-body > p { overflow-wrap: anywhere; }
.form-actions { justify-content: flex-end; border-top: 1px solid var(--line); }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 11px; }
.form-grid > .field:has(textarea), .form-grid > .full-width, .form-grid > .line-items { grid-column: 1 / -1; }
.field { display: grid; align-content: start; gap: 5px; min-width: 0; font-size: 13px; font-weight: 620; }
.field > small { color: var(--muted); font-weight: 500; }
.field input, .field select, .field textarea { width: 100%; min-height: 34px; border: 1px solid #ccd6e0; border-radius: var(--radius); padding: 5px 8px; background: var(--surface); color: var(--ink); font-weight: 500; }
.field textarea { min-height: 68px; resize: vertical; }
.quick-product-editor { display: grid; gap: 13px; }
.quick-product-options { border: 1px solid var(--line); border-radius: var(--radius); padding: 8px 10px; }
.quick-product-options > summary { cursor: pointer; font-weight: 650; }
.quick-product-options > summary span { color: var(--muted); font-weight: 550; }
.quick-product-options[open] > summary { margin-bottom: 10px; }
.quick-product-options [data-store-publication] { grid-column: 1 / -1; }
.quick-product-prices { grid-template-columns: minmax(94px, 1fr) minmax(160px, 2fr); align-items: start; }
.quick-product-prices [data-product-sale-price] { grid-column: auto; }
.quick-device-scan { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: end; gap: 7px; }
.quick-device-scan > output { grid-column: 1 / -1; font-size: 12px; color: var(--muted); }
.quick-device-scan > output:empty { display: none; }
[data-quick-product-search] { position: relative; display: grid; gap: 6px; }
[data-quick-product-results] { display: grid; gap: 2px; max-height: 190px; overflow: auto; margin: 0; padding: 4px; list-style: none; border: 1px solid var(--line); border-radius: var(--radius); }
[data-quick-product-results] > li { display: flex; gap: 4px; }
[data-quick-product-choice] { display: flex; align-items: baseline; flex-wrap: wrap; gap: 4px 9px; width: 100%; min-height: 35px; text-align: left; }
[data-quick-product-intake] { flex-shrink: 0; }
[data-quick-product-choice] small { color: var(--muted); }
[data-quick-product-manual], [data-quick-product-barcode], [data-quick-product-status] { justify-self: start; }
@media (max-width: 540px) {
  .quick-product-prices [data-product-sale-price] { grid-template-columns: minmax(0, 1fr); }
}
.product-device-unit { border: 1px solid var(--line); border-radius: var(--radius); min-width: 0; padding: 10px; margin: 0 0 10px; }
.product-device-unit legend { padding-inline: 5px; font-weight: 620; }
.product-device-unit [data-imei-fields] { grid-column: 1 / -1; }
.device-part-options { display: flex; flex-wrap: wrap; gap: 5px 12px; margin-top: 6px; }
[data-device-tracking] { margin-top: 12px; }
[data-device-tracking] input[type="checkbox"], [data-store-publication] input[type="checkbox"] { width: 16px; height: 16px; min-height: 0; vertical-align: middle; }
[data-store-publication] { margin-top: 12px; }
.line-items { display: grid; gap: 9px; margin-top: 15px; }
.line-items + .field { margin-top: 15px; }
#order-items, [data-warehouse-lines] { display: grid; gap: 8px; }
.item-header { display: flex; justify-content: space-between; align-items: center; gap: 9px; font-weight: 700; }
.item-row { display: grid; grid-template-columns: minmax(0, 2.1fr) minmax(65px, .7fr) minmax(84px, 1fr) auto; align-items: end; gap: 8px; border: 1px solid var(--line); border-radius: var(--radius); padding: 7px; background: #f8fafc; }
.item-row:has(.item-subtotal) { grid-template-columns: minmax(0, 2.1fr) minmax(65px, .7fr) minmax(84px, 1fr) minmax(75px, .85fr) auto; }
.item-row.warehouse-line { grid-template-columns: minmax(0, 2fr) minmax(80px, .65fr) auto; }
.item-row.warehouse-priced-line { grid-template-columns: minmax(0, 2fr) minmax(80px, .65fr) minmax(130px, 1fr) auto; }
.item-row .icon-button { margin-bottom: 1px; }
.order-serial-field { grid-column: 1 / -1; }
.item-subtotal { min-height: 34px; display: grid; align-content: center; gap: 3px; font-size: 13px; font-variant-numeric: tabular-nums; white-space: nowrap; }
.item-subtotal > span { color: var(--muted); font-size: 12px; }
.item-total { text-align: right; margin-top: 7px; font-size: 15px; font-weight: 750; }
.item-total span { color: var(--muted); font-size: 13px; font-weight: 600; }
.delete-confirm { line-height: 1.5; overflow-wrap: anywhere; }
.error { margin-top: 12px; border: 1px solid #f1d3d7; border-radius: 8px; padding: 8px 10px; color: #a42f42; background: #fff2f4; font-size: 13px; }
.toast { position: fixed; z-index: 9; bottom: 17px; right: 19px; max-width: min(380px, calc(100vw - 32px)); border: 1px solid #425769; border-radius: var(--radius); padding: 10px 13px; background: var(--slate); color: #fff; box-shadow: 0 8px 24px rgb(24 39 54 / 20%); font-size: 13px; }
.toast[data-kind='success'] { border-color: #215942; background: #205940; }
.toast[data-kind='error'] { border-color: #802e43; background: #802e43; }

.retail-shift-bar { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 10px; padding: 12px 14px; margin-bottom: 12px; }
.retail-shift-meta, .retail-shift-actions { display: flex; align-items: center; flex-wrap: wrap; gap: 7px 10px; }
.retail-shift-meta > span:not(.badge) { color: var(--muted); }
.retail-shift-actions .button { min-height: 38px; }
.retail-fiscal-bar { display: flex; justify-content: space-between; align-items: center; gap: 10px; flex-wrap: wrap; padding: 10px 14px; margin-bottom: 12px; }
.retail-fiscal-heading { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 3px; }
.retail-fiscal-bar p, .retail-fiscal-hint { color: var(--muted); font-size: 13px; line-height: 1.4; overflow-wrap: anywhere; }
.retail-fiscal-hint { max-width: 245px; }
.retail-fiscal-hint.full-width { max-width: none; }
.retail-register { display: grid; grid-template-columns: minmax(0, 1fr) minmax(330px, 1.05fr); align-items: start; gap: 13px; }
.retail-catalog, .retail-cart { min-width: 0; }
.retail-pane-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 10px; padding: 13px 14px; border-bottom: 1px solid var(--soft-line); }
.retail-pane-head h2 { font-size: 17px; font-weight: 680; line-height: 1.2; letter-spacing: -.02em; }
.retail-pane-head p { color: var(--muted); font-size: 12px; }
.retail-catalog .retail-pane-head form { flex: 1 1 210px; }
.retail-catalog .search-input { width: 100%; min-height: 40px; }
.retail-product-list { display: grid; align-content: start; max-height: max(280px, 52dvh); overflow: auto; }
.retail-product { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, auto) auto; align-items: center; gap: 10px; padding: 9px 14px; border-bottom: 1px solid var(--soft-line); }
.retail-product:last-child { border-bottom: 0; }
.retail-product:hover { background: #f8fbfd; }
.retail-product-copy { min-width: 0; display: grid; gap: 3px; overflow-wrap: anywhere; }
.retail-product-copy strong { color: var(--ink); font-size: 14px; line-height: 1.25; }
.retail-product-copy small, .retail-product-copy span { color: var(--muted); font-size: 12px; line-height: 1.3; }
.retail-product-details, .retail-device-identifiers { display: flex; flex-wrap: wrap; gap: 2px 10px; }
.retail-device-list { display: grid; gap: 4px; margin-top: 3px; }
.retail-device-list > details > summary { color: var(--link); cursor: pointer; font-size: 12px; }
.retail-device-list > details > .retail-device-identifiers { margin-top: 4px; }
.retail-device-identifiers { font-size: 12px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.retail-history-items { min-width: 100px; max-width: 28rem; margin-top: 4px; }
.retail-history-items summary { color: var(--muted); cursor: pointer; font-size: 12px; }
.retail-history-items ul { display: grid; gap: 6px; margin: 4px 0 0; padding: 0; list-style: none; }
.retail-history-items li { display: grid; gap: 2px; white-space: normal; overflow-wrap: anywhere; }
.retail-return-device { display: flex; align-items: flex-start; white-space: normal; gap: 6px; }
.retail-return-device + .retail-return-device { margin-top: 5px; }
.retail-cart-devices { grid-column: 1 / -1; display: grid; gap: 4px; color: var(--muted); font-size: 12px; }
.retail-cart-devices:empty { display: none; }
.retail-device-warning { color: var(--muted); margin: 8px 14px; font-size: 12px; }
.retail-product-price { justify-self: end; font-weight: 670; font-variant-numeric: tabular-nums; text-align: right; overflow-wrap: anywhere; }
.retail-product-add { min-width: 42px; min-height: 40px; font-size: 16px; }
.retail-cart-lines { display: grid; align-content: start; min-height: 118px; }
.retail-cart-line { display: grid; grid-template-columns: minmax(0, 1fr) minmax(55px, .35fr) minmax(84px, .56fr) minmax(65px, auto) auto; align-items: end; gap: 8px; padding: 10px 12px; border-bottom: 1px solid var(--soft-line); }
.retail-cart-line > :first-child { align-self: center; min-width: 0; overflow-wrap: anywhere; }
.retail-cart-line .field input { min-height: 40px; font-variant-numeric: tabular-nums; }
.retail-cart-line > .icon-button { width: 40px; height: 40px; }
.retail-line-total { align-self: center; min-width: 0; font-size: 13px; font-variant-numeric: tabular-nums; text-align: right; overflow-wrap: anywhere; }
.retail-cart-footer { display: grid; align-content: start; gap: 10px; padding: 13px 14px; background: #f4f8f5; }
.retail-total { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; color: var(--ink); font-size: 14px; font-variant-numeric: tabular-nums; }
.retail-total strong { font-size: clamp(22px, 2.3vw, 29px); font-weight: 710; line-height: 1.12; text-align: right; overflow-wrap: anywhere; }
.retail-cart-footer .button.primary { min-height: 43px; width: 100%; font-size: 14px; }
.retail-report-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin-block: 12px; }
.retail-report-grid > div { min-width: 0; display: grid; align-content: start; gap: 4px; padding: 9px 10px; border: 1px solid var(--line); border-radius: var(--radius); background: #f8fafc; overflow-wrap: anywhere; }
.retail-report-grid dt, .retail-amounts > div span { color: var(--muted); font-size: 12px; }
.retail-report-grid dd { margin: 0; font-size: 16px; font-weight: 680; font-variant-numeric: tabular-nums; }
.retail-shift-totals { display: flex; justify-content: space-between; gap: 9px; padding: 10px; margin-top: 10px; border-radius: var(--radius); background: #ecf4fb; }
.retail-payment-options { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; border: 0; margin: 13px 0 12px; }
.retail-payment-options legend { padding: 0; margin-bottom: 7px; color: var(--muted); font-size: 12px; font-weight: 620; }
.retail-payment-options label { flex: 1 1 90px; min-height: 44px; display: flex; align-items: center; gap: 6px; padding: 6px 8px; border: 1px solid var(--line); border-radius: var(--radius); cursor: pointer; }
.retail-payment-options label:has(:checked) { border-color: #7ba98a; background: #e8f4ec; color: var(--green-hover); }
.retail-payment-options input { width: 16px; height: 16px; margin: 0; accent-color: var(--green); }
.retail-amounts { margin-block: 11px; }
.retail-amounts > div { display: grid; align-content: center; gap: 4px; padding: 7px 9px; border-radius: var(--radius); background: #f2f6fa; }
.retail-amounts > div strong { font-variant-numeric: tabular-nums; }

.retail-receipt-dialog { width: min(520px, calc(100% - 28px)); }
.retail-receipt-preview { --receipt-width: 80mm; background: #edf0f3; }
.retail-receipt-preview[data-paper='58'] { --receipt-width: 58mm; }
.retail-receipt-preview[data-paper='a4'] { --receipt-width: 160mm; }
.retail-receipt-paper { width: min(100%, var(--receipt-width)); margin-inline: auto; padding: 12px; background: #fff; color: #111; font-size: 12px; line-height: 1.35; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.retail-receipt-preview .retail-receipt-paper { box-shadow: 0 1px 4px rgb(30 45 60 / 15%); }
.retail-receipt-heading { display: grid; justify-items: center; gap: 3px; text-align: center; }
.store-document-logo { display: block; width: auto; max-width: 100%; object-fit: contain; }
.retail-receipt-heading .store-document-logo { height: 48px; margin-bottom: 3px; }
.retail-receipt-heading h3 { font-size: 15px; line-height: 1.22; }
.retail-receipt-demo { font-size: 10px; font-weight: 750; letter-spacing: .045em; }
.retail-receipt-details { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 3px 6px; margin: 9px 0; }
.retail-receipt-details dt, .retail-receipt-details dd { margin: 0; }
.retail-receipt-details dd { text-align: right; }
.retail-receipt-lines { list-style: none; display: grid; gap: 5px; padding: 7px 0; margin: 0; border-block: 1px dashed currentColor; }
.retail-receipt-lines li { display: grid; gap: 2px; break-inside: avoid; }
.retail-receipt-lines li div { display: flex; justify-content: space-between; align-items: baseline; gap: 5px; }
.retail-receipt-lines li strong { flex: none; }
.retail-receipt-product { font-weight: 650; }
.retail-receipt-lines small { font-size: .85em; }
.retail-receipt-lines .retail-device-identifiers { font-size: .85em; }
.retail-receipt-lines .retail-product-details > span,
.retail-receipt-lines .retail-device-identifiers > span { max-width: 100%; overflow-wrap: anywhere; }
.retail-receipt-totals { margin-bottom: 0; break-inside: avoid; }
.retail-receipt-totals :is(dt, dd):nth-child(-n + 2) { font-size: 1.15em; font-weight: 740; }
.retail-receipt-footer { margin-top: 8px; padding-top: 6px; border-top: 1px dashed currentColor; text-align: center; font-weight: 600; break-inside: avoid; }
.retail-receipt-actions { flex-wrap: wrap; }
.retail-receipt-actions .field { margin-right: auto; }
.retail-print-sheet, .business-print-sheet { display: none; }

@media (max-width: 1130px) and (min-width: 901px) {
  .sidebar { padding-left: 12px; }
  .sidebar .brand { margin-right: 13px; }
  .nav-link { padding-inline: 8px; }
  .sidebar-footer { padding-inline: 7px; }
}

@media (max-width: 1030px) and (min-width: 901px) {
  .nav-link .icon { display: none; }
}

@media (max-width: 900px) {
  .finance-balances { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .app-layout { display: block; }
  .sidebar { position: fixed; z-index: 12; inset: 0 auto 0 0; display: flex; flex-direction: column; width: min(257px, calc(100vw - 45px)); padding: 17px 12px; overflow-y: auto; transform: translateX(-100%); visibility: hidden; transition: transform .2s ease, visibility .2s; }
  .sidebar.is-open { transform: translateX(0); visibility: visible; }
  .sidebar .brand { margin: 0 8px 16px; }
  .sidebar-nav { flex-direction: column; gap: 3px; }
  .nav-link { min-height: 43px; border-radius: var(--radius); }
  .nav-link.is-active::after { inset: 0 auto 0 0; width: 3px; height: auto; }
  .sidebar-footer { margin: auto 0 0; padding: 0 6px; justify-content: space-between; }
  .global-help-nav .nav-link { border-radius: var(--radius); }
  .topbar .mobile-help { display: inline-grid; }
  .sidebar-scrim { display: block; position: fixed; z-index: 11; inset: 0; width: 100%; height: 100%; border: 0; background: rgb(10 10 11 / 55%); }
  .topbar { min-height: 52px; padding: 0 13px; }
  .topbar-location { display: flex; }
  .mobile-brand { margin-right: 0; }
  .icon-button.mobile-menu { display: inline-grid; }
  .mobile-nav { position: fixed; z-index: 6; inset: auto 0 0; display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 3px; padding: 4px 6px calc(4px + env(safe-area-inset-bottom)); border-top: 1px solid var(--line); background: var(--surface); box-shadow: 0 -2px 12px rgb(30 45 60 / 6%); }
  .mobile-nav button { min-height: 45px; display: grid; justify-items: center; align-content: center; gap: 3px; padding: 2px; border: 0; border-radius: var(--radius); background: transparent; color: var(--muted); font-size: 10px; font-weight: 670; white-space: nowrap; }
  .mobile-nav button.is-active, .mobile-nav button[aria-current='page'] { background: var(--brand-soft); color: var(--brand-hover); }
  .mobile-nav button .icon { width: 18px; height: 18px; }
  .main-content { padding-bottom: calc(73px + env(safe-area-inset-bottom)); }
  .toast { bottom: calc(62px + env(safe-area-inset-bottom)); }
}

@media (max-width: 650px) {
  .section-tabs { padding-inline: 6px; overflow-x: auto; }
  .section-tabs button { min-height: 42px; padding-inline: 9px; }
  .section-tabs [data-section-tabs='purchases'] button { flex: 1 1 auto; padding-inline: 6px; white-space: normal; }
  .section-tabs [data-section-tabs='retail'] button { flex: 1 1 auto; padding-inline: 5px; white-space: normal; }
  .main-content { padding-inline: 11px; padding-top: 13px; }
  .page-header { align-items: flex-start; flex-wrap: wrap; gap: 9px; margin-bottom: 11px; }
  .page-heading { flex: 1 1 200px; }
  .page-heading h1 { font-size: 23px; }
  .page-heading p { margin-top: 3px; font-size: 12px; }
  .page-tools, #page-actions { flex-wrap: wrap; }
  .page-tools:has(.today-label:not([hidden])) { flex: 1 1 100%; justify-content: space-between; }
  .button { min-height: 37px; }
  .overview { gap: 10px; }
  .metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
  .metric-card { min-height: 92px; padding: 8px 9px; }
  .metric-heading h2 { font-size: 12px; }
  .metric-icon { width: 26px; height: 26px; }
  .metric-icon .icon { width: 15px; height: 15px; }
  .metric-value { margin-top: 6px; }
  .metric-note { font-size: 11px; }
  .insight-grid { grid-template-columns: minmax(0, 1fr); }
  .panel-header { padding: 11px 12px 0; }
  .panel-header h2 { font-size: 15px; }
  .sales-summary { margin-inline: 13px; }
  .sales-chart { min-height: 187px; padding-inline: 10px; }
  .sales-svg { height: 181px; }
  .stock-list { min-height: 120px; padding-inline: 13px; }
  .stock-list .empty-state { min-height: 105px; }
  .stock-footer { padding-inline: 13px; }
  .recent-link { padding-inline: 7px; font-size: 11px; }
  .recent-link .icon { width: 12px; height: 12px; }
  th, td { padding-inline: 9px; }
  th:first-child, td:first-child { padding-left: 12px; }
  th:last-child, td:last-child { padding-right: 12px; }
  .toolbar { padding-inline: 12px; }
  .toolbar .search-input { flex: 1 1 180px; }
  .toolbar .search-input, .toolbar select, .filter-panel .field input, .filter-panel .field select { min-height: 37px; }
  .directory-mobile-sort { display: inline-flex !important; gap: 5px; }
  .calendar-weekdays, .calendar-date-short, .calendar-day.is-outside, .calendar-day.is-empty { display: none; }
  .calendar-grid { display: block; }
  .calendar-date-long { position: static; width: auto; height: auto; overflow: visible; clip-path: none; white-space: normal; }
  .calendar-day { min-height: 0; border-width: 0 0 1px; padding: 8px 11px; }
  .calendar-day:last-child { border-bottom: 0; }
  .calendar-order { min-height: 34px; align-items: center; }
  .table-wrap table:has(td[data-label]) thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .table-wrap table:has(td[data-label]) tbody, .table-wrap table:has(td[data-label]) tr, .table-wrap table:has(td[data-label]) td { display: block; }
  .table-wrap table:has(td[data-label]) tbody tr { border-bottom: 1px solid var(--line); padding: 6px 12px; }
  .table-wrap table:has(td[data-label]) tbody tr:last-child { border-bottom: 0; }
  .table-wrap table:has(td[data-label]) td { border: 0; padding: 5px 0; }
  .table-wrap table td[data-label]:not([data-label='']) { display: grid; grid-template-columns: minmax(90px, .6fr) minmax(0, 1fr); gap: 2px 8px; align-items: baseline; overflow-wrap: anywhere; }
  .table-wrap table td[data-label]:not([data-label=''])::before { content: attr(data-label); grid-column: 1; grid-row: 1; color: var(--muted); font-weight: 600; font-size: 12px; }
  .table-wrap table td[data-label]:not([data-label='']) > * { grid-column: 2; justify-self: start; }
  .cash-overview-table :is(th, td):not(:first-child) { text-align: left; }
  .cash-overview-table tbody th { display: block; text-align: left; padding-inline: 0; }
  .row-actions .icon-button { width: 39px; height: 39px; }
  .retail-register { grid-template-columns: minmax(0, 1fr); gap: 10px; }
  .retail-shift-bar, .retail-pane-head, .retail-cart-footer { padding-inline: 11px; }
  .retail-product-list { max-height: min(295px, 40dvh); }
  .retail-product { padding-inline: 11px; }
  .retail-product-add { min-width: 44px; min-height: 44px; }
  .retail-report-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 440px) {
  .today-label { font-size: 11px; margin: 0; }
  .today-label .icon { width: 14px; height: 14px; }
  .page-tools { flex-wrap: wrap; }
  .sync-label { max-width: 105px; font-size: 11px; }
  .demo-banner { font-size: 12px; }
  .demo-banner .button { min-height: 31px; padding-inline: 6px; font-size: 12px; }
  .item-row, .item-row:has(.item-subtotal) { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .item-row.warehouse-line { grid-template-columns: minmax(0, 1fr) auto; }
  .item-row.warehouse-priced-line { grid-template-columns: repeat(2, minmax(0, 1fr)) auto; }
  .item-row .field:first-child { grid-column: 1 / -1; }
  .item-row .icon-button { justify-self: end; width: 40px; height: 40px; }
  .field input, .field select { min-height: 40px; }
  .dialog-header, .dialog-body, .form-actions { padding-inline: 12px; }
  .form-grid { grid-template-columns: minmax(0, 1fr); }
  .field input, .field select, .field textarea, .search-input input, .directory-mobile-sort select { font-size: 16px; }
  .retail-cart-line { grid-template-columns: minmax(0, .66fr) minmax(0, 1fr) minmax(58px, auto) auto; }
  .retail-cart-line > :first-child { grid-column: 1 / -1; }
  .retail-receipt-actions .field { flex-basis: 100%; }
}

@media (max-width: 360px) {
  .mobile-nav { gap: 2px; padding-inline: 4px; }
  .mobile-nav button { font-size: 9px; }
}

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

@page retail-a4 { size: A4; margin: 12mm; }

.sidebar-nav { min-width: 0; overflow-x: auto; scrollbar-width: thin; }
.sidebar-nav .nav-link { flex-shrink: 0; }
.section-tabs { overflow-x: auto; }
.business-layout { display: grid; gap: 12px; }
.business-subhead { padding: 13px 12px 6px; }
.business-copy { padding: 0 12px 8px; margin: 0; color: var(--muted); }
.business-material { display: grid; grid-template-columns: minmax(0,1fr) minmax(70px,.3fr) auto; align-items: end; gap: 8px; margin-block: 8px; }
.business-document-paper {
  margin-bottom: 10px;
  padding: clamp(12px, 4vw, 24px);
  border: 1px solid #dedee3;
  border-top: 3px solid #d11331;
  border-radius: 6px;
  background: #fff;
  color: #18181a;
  font-size: 13px;
  line-height: 1.45;
  font-variant-numeric: tabular-nums;
  overflow-wrap: anywhere;
}
.business-document-header { display: flex; align-items: center; gap: 16px; }
.business-document-header .store-document-logo { flex: none; height: 66px; }
.business-document-header h3 { margin: 2px 0; font-size: clamp(17px, 2.7vw, 24px); line-height: 1.25; }
.business-document-header p { color: #54545c; }
.business-document-parties { display: flex; flex-wrap: wrap; gap: 6px 30px; margin: 14px 0; padding-top: 12px; border-top: 1px solid #dedee3; }
.business-document-parties dt { color: #54545c; }
.business-document-parties dd { margin: 1px 0 0; font-weight: 650; }
.business-document-table-wrap { overflow-x: auto; }
.business-document-table { width: 100%; min-width: 410px; border-collapse: collapse; table-layout: fixed; color: inherit; font: inherit; }
.business-document-table th, .business-document-table td { padding: 7px 5px; border-bottom: 1px solid #dedee3; vertical-align: top; white-space: normal; text-align: left; }
.business-document-table th { border-top: 1px solid #dedee3; border-bottom-color: currentColor; font-weight: 650; }
.business-document-table :is(th, td):first-child { width: 7%; }
.business-document-table :is(th, td):nth-child(3) { width: 10%; text-align: right; }
.business-document-table :is(th, td):nth-child(n + 4) { width: 19%; text-align: right; }
.business-document-table small, .business-document-total small { display: block; color: #54545c; }
.business-document-total { display: flex; justify-content: space-between; gap: 12px; width: min(100%, 250px); margin: 14px 0 0 auto; padding-top: 6px; border-top: 2px solid currentColor; }
.business-document-total dt { font-weight: 650; }
.business-document-total dd { margin: 0; text-align: right; }
.business-trade-in { margin-top: 12px; padding: 10px; border: 1px solid var(--line); border-radius: var(--radius); }
.business-trade-in input[name="tradeIn"] { width: 16px; height: 16px; min-height: 0; vertical-align: middle; }
.business-trade-in [data-trade-in-fields] { margin-top: 10px; }
.business-trade-in .business-copy { padding: 0; }
.trade-in-return-checks { display: grid; gap: 9px; }
.trade-in-return-checks input[type="checkbox"] { margin-right: 4px; vertical-align: middle; }
.business-document-trade-in { margin-top: 14px; padding-top: 9px; border-top: 1px solid currentColor; break-inside: avoid; }
.business-document-trade-in h4 { margin: 0 0 4px; }
.business-document-trade-in p { font-size: 12px; overflow-wrap: anywhere; }
.trade-in-document-totals { display: grid; grid-template-columns: 1fr auto; gap: 4px 12px; margin: 7px 0 0; }
.trade-in-document-totals dd { margin: 0; text-align: end; font-variant-numeric: tabular-nums; }
.business-document-note { margin: 10px 0; color: #54545c; white-space: pre-wrap; }
.business-document-signatures { display: grid; grid-template-columns: 1fr 1fr; gap: clamp(16px, 5vw, 32px); margin-top: 36px; }
.business-document-signatures div { padding-top: 4px; border-top: 1px solid currentColor; }
.inventory-controls { align-items: end; }
.inventory-controls .field { min-width: 0; }
.inventory-controls select { max-width: 250px; }
.inventory-note { padding-top: 6px; }
.inventory-totals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; margin: 0; padding: 8px 12px 12px; }
.inventory-totals > div { padding: 8px 10px; border: 1px solid var(--line); border-radius: var(--radius); background: #f4f7fa; }
.inventory-totals dt { color: var(--muted); font-size: 12px; }
.inventory-totals dd { margin: 2px 0 0; font-weight: 650; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.inventory-product-caption { color: var(--muted); overflow-wrap: anywhere; }
@media (max-width: 650px) {
  .inventory-controls { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .inventory-controls .search-input { grid-column: 1 / -1; }
  .inventory-controls select { max-width: 100%; }
  .inventory-totals { gap: 4px; }
  .inventory-totals > div { padding-inline: 5px; }
}
@page retail-roll { size: auto; margin: 0; }
@page business-a4 { size: A4; margin: 15mm; }

@media print {
  body.printing-document { min-width: 0; margin: 0; background: #fff; }
  body.printing-document > :not(.retail-print-sheet, .business-print-sheet) { display: none !important; }
  body.printing-document dialog::backdrop { display: none; }
  .retail-print-sheet { --receipt-width: 76mm; display: block; page: retail-roll; }
  .retail-print-sheet[data-paper='58'] { --receipt-width: 54mm; }
  .retail-print-sheet[data-paper='a4'] { --receipt-width: 160mm; page: retail-a4; }
  .retail-print-sheet .retail-receipt-paper { margin-inline: 0; padding: 2mm; font-size: 9pt; }
  .retail-print-sheet[data-paper='58'] .retail-receipt-paper { font-size: 8pt; }
  .retail-print-sheet[data-paper='a4'] .retail-receipt-paper { margin-inline: auto; padding: 0; font-size: 11pt; }
  .retail-print-sheet .retail-receipt-heading { break-inside: avoid; }
  .retail-print-sheet .store-document-logo { height: 13mm; filter: grayscale(1) contrast(2); }
  .retail-print-sheet[data-paper='a4'] .store-document-logo { height: 18mm; filter: none; }
  .business-print-sheet { display: block; page: business-a4; }
  .business-print-sheet .business-document-paper { margin: 0; padding: 0; border: 0; color: #000; font-size: 10pt; }
  .business-print-sheet .business-document-header { padding-top: 3mm; border-top: 1mm solid #d11331; }
  .business-print-sheet .business-document-header .store-document-logo { height: 18mm; }
  .business-print-sheet .business-document-table-wrap { overflow: visible; }
  .business-print-sheet .business-document-table { min-width: 0; }
  .business-print-sheet .business-document-table thead { display: table-header-group; }
  .business-print-sheet :is(.business-document-header, .business-document-parties, tr, .business-document-total, .business-document-signatures) { break-inside: avoid; }
}