:root {
  --green-900: #0f5f55;
  --green-800: #167f72;
  --green-700: #218c4b;
  --green-600: #2b9348;
  --green-100: #e9f6ee;
  --lime: #8ac926;
  --ink: #17312b;
  --muted: #687d77;
  --line: #d9e7e2;
  --surface: #ffffff;
  --canvas: #f4f8f6;
  --warning: #a76505;
  --warning-bg: #fff5dc;
  --danger: #a62f33;
  --danger-bg: #ffebec;
  --shadow: 0 14px 34px rgba(21, 77, 64, 0.08);
  font-family: "Segoe UI", Tahoma, Arial, sans-serif;
  color: var(--ink);
  background: var(--canvas);
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
body { margin: 0; min-height: 100vh; background: var(--canvas); }
a { color: inherit; text-decoration: none; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }

.topbar {
  position: sticky;
  top: 0;
  z-index: 20;
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 30px;
  min-height: 74px;
  padding: 10px max(24px, calc((100vw - 1380px) / 2));
  background: rgba(255, 255, 255, 0.96);
  border-bottom: 1px solid var(--line);
  backdrop-filter: blur(14px);
}

.brand { display: flex; align-items: center; gap: 12px; font-weight: 800; color: var(--green-900); }
.brand img { width: 76px; height: 48px; object-fit: contain; }
.topbar nav { display: flex; gap: 8px; align-items: center; }
.topbar nav { overflow-x: auto; scrollbar-width: thin; }
.topbar nav a { flex: 0 0 auto; padding: 10px 11px; border-radius: 10px; font-size: 13px; color: #425b54; }
.topbar nav a:hover { background: var(--green-100); color: var(--green-900); }
.user-menu { display: flex; align-items: center; gap: 12px; font-size: 14px; font-weight: 700; }
.user-menu form { margin: 0; }
.user-identity { display: grid; gap: 2px; }
.user-identity small { color: var(--muted); font-size: 10px; font-weight: 600; }
.language-switch { display: inline-flex; direction: ltr; padding: 3px; border: 1px solid var(--line); border-radius: 10px; background: #f7fbf9; }
.language-switch a { padding: 6px 8px; border-radius: 7px; color: var(--muted); font-size: 11px; font-weight: 800; }
.language-switch a.active { color: white; background: var(--green-800); }
.guest-language-switch { position: fixed; z-index: 30; top: 18px; right: 20px; }

.app-shell { width: min(1380px, calc(100% - 40px)); margin: 0 auto; padding: 36px 0 70px; }
.login-shell { min-height: 100vh; display: grid; place-items: center; padding: 30px; background: radial-gradient(circle at 20% 20%, #dff2e5 0, transparent 34%), linear-gradient(145deg, #f8fbf9, #e8f3ee); }

.login-card {
  width: min(480px, 100%);
  display: grid;
  gap: 24px;
  padding: 40px;
  background: rgba(255, 255, 255, 0.98);
  border: 1px solid rgba(22, 127, 114, 0.16);
  border-radius: 24px;
  box-shadow: 0 28px 70px rgba(15, 95, 85, 0.14);
}
.login-logo { width: 180px; height: 108px; object-fit: contain; justify-self: center; }
.login-card h1 { margin: 4px 0 8px; font-size: 30px; }

.page-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 24px; }
.page-heading h1 { margin: 4px 0 6px; font-size: clamp(27px, 3vw, 38px); letter-spacing: -0.02em; }
.eyebrow { margin: 0; color: var(--green-700); font-size: 13px; font-weight: 800; letter-spacing: .05em; }
.muted { margin: 0; color: var(--muted); line-height: 1.7; }
.heading-actions { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

.button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 43px;
  padding: 9px 17px;
  border: 1px solid transparent;
  border-radius: 11px;
  font-weight: 800;
  transition: transform .15s ease, box-shadow .15s ease, background .15s ease;
}
.button:hover { transform: translateY(-1px); }
.button:disabled { cursor: not-allowed; opacity: .45; transform: none; }
.button-primary { color: white; background: linear-gradient(135deg, var(--green-800), var(--green-600)); box-shadow: 0 8px 18px rgba(22, 127, 114, .19); }
.button-secondary { background: white; border-color: var(--line); color: var(--green-900); }
.button-ghost { background: var(--green-100); color: var(--green-900); }
.button-danger { color: white; background: var(--danger); border-color: var(--danger); }
.button-small { min-height: 34px; padding: 6px 11px; font-size: 12px; }

.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 15px; margin-bottom: 22px; }
.stat-card { position: relative; overflow: hidden; padding: 22px; background: white; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow); }
.stat-card::after { content: ""; position: absolute; top: -25px; left: -25px; width: 78px; height: 78px; border-radius: 50%; background: var(--green-100); }
.stat-card span { display: block; color: var(--muted); font-size: 14px; }
.stat-card strong { display: block; margin-top: 8px; color: var(--green-900); font-size: 32px; }

.card { margin-bottom: 22px; padding: 22px; background: var(--surface); border: 1px solid var(--line); border-radius: 17px; box-shadow: var(--shadow); }
.card h2 { margin: 0 0 7px; font-size: 21px; }
.card-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.form-card { max-width: 1050px; }

.table-wrap { width: 100%; overflow-x: auto; border: 1px solid var(--line); border-radius: 12px; }
table { width: 100%; border-collapse: collapse; min-width: 760px; background: white; }
th { padding: 13px 12px; text-align: right; background: #eff7f3; color: var(--green-900); font-size: 13px; white-space: nowrap; }
td { padding: 12px; border-top: 1px solid var(--line); vertical-align: middle; font-size: 13px; }
tbody tr:hover { background: #fbfdfc; }
td small { display: block; margin-top: 5px; color: var(--muted); line-height: 1.45; }
.table-link { color: var(--green-800); font-weight: 800; }
.empty-cell { padding: 30px; text-align: center; color: var(--muted); }
.review-row { background: #fffaf0; }
.review-table select, .review-table input { min-width: 92px; width: 100%; padding: 8px; border: 1px solid var(--line); border-radius: 8px; background: white; }
.review-table .product-select { min-width: 270px; }
.product-match-control { display: grid; min-width: 310px; gap: 7px; }
.product-search { min-width: 270px !important; border-color: #9bc5b7 !important; background: #f8fcfa !important; }
.product-search-count { min-height: 0; margin: 0; color: var(--green-800); font-weight: 700; }
.product-suggestions { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; }
.product-suggestions button { padding: 4px 7px; color: var(--green-900); background: var(--green-100); border: 0; border-radius: 7px; font-size: 11px; }
.catalog-input { min-width: 145px; padding: 8px 9px; border-radius: 8px; }
.ltr-input { direction: ltr; text-align: left; }
.ltr-cell { direction: ltr; text-align: left; }
.access-select { min-width: 170px; padding: 8px 9px; border-radius: 8px; }
code { direction: ltr; display: inline-block; padding: 4px 7px; border-radius: 7px; color: var(--green-900); background: var(--green-100); font-family: Consolas, monospace; font-size: 12px; }

.badge { display: inline-flex; align-items: center; justify-content: center; padding: 5px 9px; border-radius: 999px; font-size: 12px; font-weight: 800; white-space: nowrap; }
.badge-success { color: #146133; background: #ddf4e5; }
.badge-info { color: #155f78; background: #e0f3f9; }
.badge-warning { color: var(--warning); background: var(--warning-bg); }
.badge-danger { color: var(--danger); background: var(--danger-bg); }
.badge-neutral { color: #52655f; background: #edf2f0; }

.alert { margin: 0 0 20px; padding: 14px 16px; border: 1px solid; border-radius: 12px; font-weight: 700; line-height: 1.6; }
.alert-success { color: #146133; background: #e5f7eb; border-color: #b9e5c7; }
.alert-warning { color: var(--warning); background: var(--warning-bg); border-color: #f1d99e; }
.alert-error { color: var(--danger); background: var(--danger-bg); border-color: #f3c2c4; }

.form-stack { display: grid; gap: 16px; }
.form-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.full-width { grid-column: 1 / -1; }
label { display: grid; gap: 8px; color: #345049; font-size: 14px; font-weight: 800; }
input, select, textarea { width: 100%; padding: 12px 13px; color: var(--ink); background: white; border: 1px solid #cdded8; border-radius: 10px; outline: none; }
input:focus, select:focus, textarea:focus { border-color: var(--green-800); box-shadow: 0 0 0 3px rgba(22, 127, 114, .12); }
textarea { resize: vertical; }
label small { color: var(--muted); font-weight: 500; }
.upload-box { padding: 20px; border: 1px dashed #9bc5b7; border-radius: 14px; background: #f7fbf9; }
.paste-order-box { padding: 0 20px 20px; border: 1px solid #badfca; border-radius: 14px; background: linear-gradient(145deg, #fff, #f5fbf7); }
.paste-divider { display: flex; align-items: center; gap: 12px; margin: -13px 0 12px; color: var(--green-800); font-size: 12px; font-weight: 900; }
.paste-divider::before, .paste-divider::after { content: ""; flex: 1; height: 1px; background: #badfca; }
.paste-divider span { padding: 5px 12px; background: var(--canvas); border: 1px solid #badfca; border-radius: 999px; }
.paste-order-box textarea { direction: rtl; font-family: "Segoe UI", Tahoma, Arial, sans-serif; line-height: 1.7; }
.form-actions { display: flex; gap: 10px; justify-content: flex-end; align-items: center; margin-top: 4px; }
.inline-form { display: inline-flex; margin: 0; }
.table-actions { display: flex; min-width: 180px; flex-wrap: wrap; gap: 6px; align-items: center; }
.product-create-card { border-color: #badfca; background: linear-gradient(145deg, #fff, #f5fbf7); }
.code-preview { display: grid; min-width: 190px; gap: 4px; padding: 12px 14px; border-radius: 12px; background: var(--green-100); direction: ltr; text-align: left; }
.code-preview span { color: var(--muted); font-size: 11px; }
.code-preview strong { color: var(--green-900); font-size: 22px; }
.form-note { padding: 10px 12px; border-radius: 10px; background: #fff8e8; font-size: 12px; }
.sticky-actions { position: sticky; bottom: 10px; padding: 14px; margin-top: 14px; background: rgba(255, 255, 255, .95); border: 1px solid var(--line); border-radius: 12px; backdrop-filter: blur(10px); }

.file-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 12px; margin-bottom: 22px; }
.file-card { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 9px; padding: 15px; background: white; border: 1px solid var(--line); border-radius: 13px; }
.file-card small { display: block; margin-top: 4px; color: var(--muted); }
.file-card .button { grid-column: 1 / -1; }
.file-warning { grid-column: 1 / -1; margin: 0; color: var(--danger); font-size: 12px; }

.approval-card { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 22px; color: white; background: linear-gradient(135deg, var(--green-900), var(--green-700)); border-radius: 17px; box-shadow: var(--shadow); }
.approval-card h2 { margin: 0 0 6px; }
.approval-card p { margin: 0; color: #d8eee7; }
.approval-card .button-primary { color: var(--green-900); background: white; box-shadow: none; }
.workflow-meta { margin: 8px 0 0; color: var(--muted); font-size: 12px; }

.search-form { display: grid; grid-template-columns: 1fr auto; gap: 10px; margin-bottom: 16px; }
.two-columns { display: grid; grid-template-columns: 1.25fr .75fr; gap: 20px; align-items: start; }
.roles-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 12px; }
.role-card { padding: 15px; border: 1px solid var(--line); border-radius: 12px; background: #f8fbf9; }
.role-card strong { color: var(--green-900); }
.role-card p { margin: 7px 0 0; color: var(--muted); font-size: 12px; line-height: 1.65; }
.role-checklist { display: grid; min-width: 210px; gap: 6px; }
.role-option { display: flex; align-items: center; gap: 8px; padding: 7px 9px; border: 1px solid var(--line); border-radius: 8px; background: #f8fbf9; font-size: 12px; font-weight: 700; }
.role-option:has(input:checked) { color: var(--green-900); border-color: #8ec6af; background: var(--green-100); }
.role-option input { flex: 0 0 auto; width: 16px; height: 16px; margin: 0; accent-color: var(--green-800); }
.field-label { display: block; margin-bottom: 8px; color: #345049; font-size: 14px; }
.field-help { display: block; margin-top: 8px; color: var(--muted); font-size: 12px; line-height: 1.5; }

.audit-count { padding: 9px 13px; color: var(--green-900); background: var(--green-100); border-radius: 999px; font-size: 13px; font-weight: 800; white-space: nowrap; }
.audit-filters { display: grid; grid-template-columns: minmax(190px, 1fr) minmax(220px, 1fr) auto; align-items: end; gap: 12px; margin-bottom: 18px; }
.filter-actions { display: flex; gap: 8px; }
.audit-table table { min-width: 980px; }
.audit-date { direction: ltr; white-space: nowrap; }

.executive-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 30px;
  overflow: hidden;
  margin-bottom: 22px;
  padding: 32px;
  color: white;
  background: radial-gradient(circle at 15% -30%, rgba(122, 211, 167, .45), transparent 45%), linear-gradient(135deg, #073e38, #0d7063 62%, #24935e);
  border-radius: 22px;
  box-shadow: 0 24px 55px rgba(7, 62, 56, .20);
}
.executive-hero::after { content: ""; position: absolute; z-index: -1; inset-inline-end: -70px; bottom: -110px; width: 330px; height: 330px; border: 55px solid rgba(255, 255, 255, .06); border-radius: 50%; }
.executive-hero h1 { margin: 5px 0 8px; font-size: clamp(28px, 4vw, 46px); letter-spacing: -.03em; }
.executive-hero p { margin: 0; color: #d9eee8; }
.executive-hero .eyebrow { color: #9fe2c1; }
.hero-actions { display: flex; flex-wrap: wrap; gap: 10px; }
.button-light { color: #0a5b50; background: white; box-shadow: 0 10px 24px rgba(0, 0, 0, .12); }

.executive-grid { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 14px; margin-bottom: 22px; }
.executive-grid.compact { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.executive-kpi { position: relative; min-height: 156px; overflow: hidden; padding: 22px; color: #163932; background: white; border: 1px solid #dbe8e3; border-radius: 17px; box-shadow: var(--shadow); }
.executive-kpi::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; background: #20866e; }
[dir="rtl"] .executive-kpi::before { inset: 0 0 0 auto; }
.executive-kpi span { display: block; max-width: calc(100% - 42px); color: var(--muted); font-size: 12px; font-weight: 800; line-height: 1.5; }
.executive-kpi strong { display: block; margin-top: 17px; color: #123e36; font-size: clamp(21px, 2vw, 29px); white-space: nowrap; }
.executive-kpi strong small { font-size: 11px; }
.executive-kpi > small { display: block; margin-top: 6px; color: var(--muted); line-height: 1.4; }
.kpi-icon { position: absolute; top: 16px; inset-inline-end: 16px; display: grid; width: 36px; height: 36px; place-items: center; color: #14715f; background: #e1f4ed; border-radius: 11px; font-size: 17px; font-weight: 900; }
.executive-kpi-navy::before { background: #315882; }.executive-kpi-navy .kpi-icon { color: #315882; background: #e8f0f7; }
.executive-kpi-teal::before { background: #0e8f9a; }.executive-kpi-teal .kpi-icon { color: #0e7680; background: #e0f4f5; }
.executive-kpi-amber::before { background: #c27a17; }.executive-kpi-amber .kpi-icon { color: #a6630b; background: #fff1d9; }
.executive-kpi-red::before { background: #b23a40; }.executive-kpi-red .kpi-icon { color: #a42d34; background: #fbe5e7; }

.dashboard-layout { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px; align-items: start; }
.dashboard-layout .card { height: 100%; margin: 0; }
.dashboard-wide { grid-column: span 2; }
.metric-inline { display: grid; text-align: end; color: var(--green-900); font-size: 20px; }
.metric-inline small { color: var(--muted); font-size: 10px; font-weight: 600; }
.chart-wrap { width: 100%; overflow: hidden; }
.sales-chart { display: block; width: 100%; min-height: 220px; }
.sales-chart text { fill: #758983; font-size: 10px; }
.chart-axis { stroke: #d5e4df; stroke-width: 1; }
.chart-line { fill: none; stroke: #167f72; stroke-width: 3; stroke-linecap: round; stroke-linejoin: round; }
.chart-point { fill: white; stroke: #167f72; stroke-width: 3; }
.empty-chart { display: grid; min-height: 235px; place-items: center; color: var(--muted); background: repeating-linear-gradient(0deg, #fbfdfc, #fbfdfc 39px, #edf4f1 40px); border-radius: 12px; }

.workflow-grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 10px; }
.workflow-grid a { display: grid; gap: 4px; padding: 17px; background: #f6faf8; border: 1px solid var(--line); border-radius: 13px; }
.workflow-grid strong { color: var(--green-900); font-size: 26px; }
.workflow-grid span { color: var(--muted); font-size: 12px; font-weight: 700; }
.rank-list { display: grid; gap: 13px; }
.rank-row { display: grid; grid-template-columns: 26px 1fr auto; align-items: center; gap: 10px; }
.rank-row > div { min-width: 0; }
.rank-row strong { display: block; overflow: hidden; font-size: 12px; text-overflow: ellipsis; white-space: nowrap; }
.rank-row small { display: block; margin: 3px 0 6px; color: var(--muted); font-size: 10px; }
.rank-row b { color: #244a42; font-size: 11px; white-space: nowrap; }
.rank-index { display: grid; width: 26px; height: 26px; place-items: center; color: var(--green-800); background: var(--green-100); border-radius: 8px; font-size: 11px; font-weight: 900; }
.rank-track { display: block; height: 5px; overflow: hidden; background: #e8efec; border-radius: 999px; }
.rank-track i { display: block; height: 100%; background: linear-gradient(90deg, #2ea66b, #167f72); border-radius: inherit; }
.rank-width-5 { width: 5%; }.rank-width-10 { width: 10%; }.rank-width-15 { width: 15%; }.rank-width-20 { width: 20%; }.rank-width-25 { width: 25%; }
.rank-width-30 { width: 30%; }.rank-width-35 { width: 35%; }.rank-width-40 { width: 40%; }.rank-width-45 { width: 45%; }.rank-width-50 { width: 50%; }
.rank-width-55 { width: 55%; }.rank-width-60 { width: 60%; }.rank-width-65 { width: 65%; }.rank-width-70 { width: 70%; }.rank-width-75 { width: 75%; }
.rank-width-80 { width: 80%; }.rank-width-85 { width: 85%; }.rank-width-90 { width: 90%; }.rank-width-95 { width: 95%; }.rank-width-100 { width: 100%; }
.empty-inline { margin: 12px 0; color: var(--muted); text-align: center; }
.alert-list { display: grid; gap: 5px; }
.alert-list a { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 10px 12px; border-radius: 10px; }
.alert-list a:hover { background: #f3f8f6; }
.alert-list strong { display: block; font-size: 12px; }.alert-list small { color: var(--muted); font-size: 10px; }.alert-list b { color: #9a6b10; font-size: 11px; white-space: nowrap; }.alert-list .negative, .negative { color: var(--danger); }
.positive { color: #147044; }
.data-health { display: grid; grid-template-columns: 2fr 1fr 1fr; align-items: center; gap: 18px; margin-top: 18px; background: linear-gradient(135deg, #f7fbf9, #eef7f3); }
.data-health h2 { margin: 0 0 5px; }.data-health p { margin: 0; color: var(--muted); line-height: 1.6; }.data-health > div:not(:first-child) { padding: 12px 16px; text-align: center; background: white; border: 1px solid var(--line); border-radius: 12px; }.data-health strong { display: block; color: var(--green-900); font-size: 24px; }.data-health span { color: var(--muted); font-size: 11px; }

.mini-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; margin-bottom: 20px; }
.mini-stats article { padding: 18px 20px; background: white; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 8px 22px rgba(21, 77, 64, .05); }
.mini-stats span { display: block; color: var(--muted); font-size: 12px; }.mini-stats strong { display: block; margin-top: 7px; color: var(--green-900); font-size: 24px; }.mini-stats small { font-size: 10px; }
.partner-code { min-width: 220px; padding: 18px 22px; color: white; background: linear-gradient(135deg, #0d685d, #24905d); border-radius: 16px; box-shadow: var(--shadow); direction: ltr; text-align: left; }
.partner-code span, .partner-code small { display: block; color: #d4eee5; font-size: 11px; }.partner-code strong { display: block; margin: 5px 0; font-family: Consolas, monospace; font-size: 24px; }
.partner-form { display: grid; gap: 18px; }
.form-section { padding: 24px; background: white; border: 1px solid var(--line); border-radius: 17px; box-shadow: var(--shadow); }
.form-section-title { display: flex; align-items: center; gap: 13px; margin-bottom: 22px; padding-bottom: 15px; border-bottom: 1px solid var(--line); }
.form-section-title > span { display: grid; width: 37px; height: 37px; place-items: center; color: white; background: var(--green-800); border-radius: 11px; font-weight: 900; }
.form-section-title h2 { margin: 0 0 3px; font-size: 19px; }.form-section-title p { margin: 0; color: var(--muted); font-size: 12px; }
.form-footer { position: sticky; z-index: 5; bottom: 10px; padding: 14px 18px; background: rgba(244, 248, 246, .94); border: 1px solid var(--line); border-radius: 14px; backdrop-filter: blur(12px); }
.inventory-movement-card { border-color: #b8ddcf; background: linear-gradient(145deg, #fff, #f5fbf8); }
.reorder-form { display: flex; min-width: 155px; gap: 5px; }.reorder-form input { min-width: 78px; padding: 7px; }
.stock-success { color: #167447; }.stock-warning { color: #a3680f; }.stock-danger { color: var(--danger); }
.report-tabs { display: flex; gap: 7px; overflow-x: auto; margin-bottom: 18px; padding: 6px; background: white; border: 1px solid var(--line); border-radius: 13px; }
.report-tabs a { flex: 1; min-width: 110px; padding: 10px 16px; text-align: center; border-radius: 9px; color: var(--muted); font-weight: 800; }
.report-tabs a.active { color: white; background: var(--green-800); box-shadow: 0 5px 14px rgba(22, 127, 114, .2); }
.report-columns { grid-template-columns: 1fr 1fr; }
.report-columns .card { min-width: 0; }
.forecast-card { border-top: 4px solid var(--green-800); }

.error-card { width: min(560px, 100%); margin: 70px auto; padding: 40px; text-align: center; background: white; border: 1px solid var(--line); border-radius: 20px; box-shadow: var(--shadow); }
.error-card > span { display: block; color: var(--green-800); font-size: 56px; font-weight: 900; }
.error-card h1 { margin: 5px 0 10px; }
.error-card p { color: var(--muted); }

.label-page { display: grid; justify-items: center; gap: 18px; }
.barcode-label { width: min(460px, 100%); min-height: 300px; padding: 24px; text-align: center; background: white; border: 2px solid #1e2c28; border-radius: 16px; }
.label-logo { width: 125px; height: 68px; object-fit: contain; }
.barcode-label h1 { margin: 8px 0; font-size: 22px; }
.barcode-label p { margin: 0 0 10px; color: var(--muted); }
.label-barcode { display: block; width: min(370px, 100%); min-height: 90px; margin: 12px auto; object-fit: contain; }
.label-code { display: block; direction: ltr; margin-top: 5px; font-family: Consolas, monospace; }
.label-actions { display: flex; flex-wrap: wrap; gap: 10px; }

[dir="ltr"] th { text-align: left; }
[dir="ltr"] .guest-language-switch { right: auto; left: 20px; }
[dir="ltr"] .workflow-meta, [dir="ltr"] .muted { text-align: left; }

@media (max-width: 980px) {
  .topbar { grid-template-columns: 1fr auto; }
  .topbar nav { grid-column: 1 / -1; overflow-x: auto; }
  .stats-grid { grid-template-columns: repeat(2, 1fr); }
  .two-columns { grid-template-columns: 1fr; }
  .audit-filters { grid-template-columns: 1fr 1fr; }
  .executive-grid, .executive-grid.compact { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-layout { grid-template-columns: 1fr 1fr; }
  .dashboard-wide { grid-column: 1 / -1; }
  .data-health { grid-template-columns: 1fr 1fr; }.data-health > div:first-child { grid-column: 1 / -1; }
  .report-columns { grid-template-columns: 1fr; }
  .filter-actions { grid-column: 1 / -1; }
}

@media (max-width: 680px) {
  .app-shell { width: min(100% - 24px, 1380px); padding-top: 24px; }
  .topbar { padding: 10px 14px; gap: 12px; }
  .brand span, .user-menu > span { display: none; }
  .language-switch a { padding-inline: 6px; }
  .page-heading, .approval-card { align-items: stretch; flex-direction: column; }
  .heading-actions { align-items: stretch; }
  .heading-actions .button { width: 100%; }
  .stats-grid, .form-grid { grid-template-columns: 1fr; }
  .audit-filters { grid-template-columns: 1fr; }
  .filter-actions { grid-column: auto; flex-direction: column; }
  .full-width { grid-column: auto; }
  .card { padding: 15px; }
  .executive-hero { align-items: stretch; flex-direction: column; padding: 24px 20px; }
  .executive-grid, .executive-grid.compact, .dashboard-layout, .data-health { grid-template-columns: 1fr; }
  .dashboard-wide, .data-health > div:first-child { grid-column: auto; }
  .executive-kpi { min-height: 138px; }
  .partner-code { width: 100%; }
  .form-section { padding: 18px 15px; }
  .login-card { padding: 28px 22px; }
}

@media print {
  .topbar, .button, .alert { display: none !important; }
  .app-shell { width: 100%; padding: 0; }
  .card { box-shadow: none; border: 0; }
  .label-actions { display: none !important; }
  .barcode-label { margin: 0; box-shadow: none; }
}

/* Version 4 — application shell and intelligence workspace */
.authenticated-body { min-height: 100vh; background: radial-gradient(circle at 82% 4%, rgba(68, 181, 122, .08), transparent 24%), #f3f7f5; }
.app-sidebar {
  position: fixed; z-index: 70; inset-block: 0; inset-inline-start: 0; display: flex; width: 270px; flex-direction: column;
  padding: 22px 16px 16px; overflow-y: auto; color: #eaf8f3; background: linear-gradient(178deg, #073d38 0%, #0a5149 48%, #073832 100%);
  border-inline-end: 1px solid rgba(255,255,255,.09); box-shadow: 16px 0 50px rgba(8, 52, 47, .13); transition: transform .28s ease;
}
.sidebar-brand { display: flex; align-items: center; gap: 12px; padding: 0 10px 18px; border-bottom: 1px solid rgba(255,255,255,.12); }
.sidebar-brand img { width: 60px; height: 48px; padding: 4px; object-fit: contain; background: #fff; border-radius: 12px; }
.sidebar-brand span { display: grid; gap: 2px; }.sidebar-brand strong { color: #fff; font-size: 19px; }.sidebar-brand small { color: #8acfb8; font-size: 8px; font-weight: 800; letter-spacing: .12em; }
.sidebar-nav { display: grid; gap: 3px; padding: 17px 0; }
.sidebar-section-label { padding: 14px 13px 6px; color: #74aa9b; font-size: 9px; font-weight: 900; letter-spacing: .09em; }
.sidebar-nav a { position: relative; display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 8px; min-height: 44px; padding: 8px 12px; color: #c9e1da; border-radius: 11px; font-size: 12px; font-weight: 700; transition: .18s ease; }
.sidebar-nav a i { display: grid; width: 26px; height: 26px; place-items: center; color: #82c4ae; background: rgba(255,255,255,.06); border-radius: 8px; font-style: normal; font-size: 14px; }
.sidebar-nav a:hover { color: #fff; background: rgba(255,255,255,.08); transform: translateX(calc(var(--dir-shift, 1) * 2px)); }
.sidebar-nav a.active { color: #fff; background: linear-gradient(100deg, rgba(73,190,132,.25), rgba(57,158,121,.12)); box-shadow: inset 3px 0 #75d29b; }
[dir="rtl"] .sidebar-nav a.active { box-shadow: inset -3px 0 #75d29b; }
.sidebar-nav a.active i { color: #fff; background: #299366; box-shadow: 0 6px 16px rgba(0,0,0,.16); }
.sidebar-count { display: grid; min-width: 20px; height: 20px; place-items: center; padding: 0 5px; color: #fff; background: #d74c4f; border-radius: 999px; font-size: 9px; }
.sidebar-user { display: flex; align-items: center; gap: 10px; margin-top: auto; padding: 13px; background: rgba(255,255,255,.07); border: 1px solid rgba(255,255,255,.08); border-radius: 13px; }
.sidebar-user > span { display: grid; width: 34px; height: 34px; flex: 0 0 auto; place-items: center; color: #075047; background: #dff5e8; border-radius: 10px; font-weight: 900; }
.sidebar-user div { min-width: 0; }.sidebar-user strong, .sidebar-user small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.sidebar-user strong { color: #fff; font-size: 11px; }.sidebar-user small { margin-top: 3px; color: #8fc8b7; font-size: 8px; }
.sidebar-overlay { position: fixed; z-index: 65; inset: 0; display: none; background: rgba(5,30,27,.46); backdrop-filter: blur(3px); }
.app-topbar { position: fixed; z-index: 60; top: 0; inset-inline: 270px 0; display: flex; height: 68px; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 32px; background: rgba(255,255,255,.91); border-bottom: 1px solid rgba(194,218,209,.8); backdrop-filter: blur(18px); }
.sidebar-toggle { display: none; width: 39px; height: 39px; color: var(--green-900); background: #edf7f3; border: 0; border-radius: 10px; font-size: 18px; }
.topbar-title { display: flex; align-items: center; gap: 10px; }.topbar-title span { color: var(--green-800); font-size: 10px; font-weight: 900; letter-spacing: .08em; }.topbar-title strong { font-size: 15px; }
.topbar-actions { display: flex; align-items: center; gap: 10px; }.topbar-actions form { margin: 0; }
.notification-button { position: relative; display: grid; width: 38px; height: 38px; place-items: center; color: var(--green-900); background: #edf7f3; border: 1px solid #d7e9e2; border-radius: 10px; font-size: 20px; }
.notification-button b { position: absolute; top: -5px; inset-inline-end: -5px; display: grid; min-width: 19px; height: 19px; place-items: center; padding: 0 4px; color: #fff; background: #d3484d; border: 2px solid #fff; border-radius: 999px; font-size: 8px; }
.authenticated-body .app-shell { width: auto; max-width: none; margin: 0; margin-inline-start: 270px; padding: 96px 34px 78px; }

.assistant-launcher { position: fixed; z-index: 85; inset-inline-end: 25px; bottom: 22px; display: flex; height: 52px; align-items: center; gap: 8px; padding: 7px 15px 7px 8px; color: #fff; background: linear-gradient(135deg, #075c51, #31a56f); border: 1px solid rgba(255,255,255,.3); border-radius: 999px; box-shadow: 0 15px 35px rgba(7,86,74,.3); transition: .2s ease; }
[dir="ltr"] .assistant-launcher { padding: 7px 8px 7px 15px; }
.assistant-launcher:hover, .assistant-launcher.active { transform: translateY(-3px); box-shadow: 0 20px 42px rgba(7,86,74,.36); }
.assistant-launcher > span { display: grid; width: 37px; height: 37px; place-items: center; background: rgba(255,255,255,.16); border-radius: 50%; font-size: 19px; animation: assistantPulse 3s ease-in-out infinite; }.assistant-launcher small { font-size: 11px; font-weight: 900; }
.assistant-panel { position: fixed; z-index: 90; inset-inline-end: 23px; bottom: 83px; width: min(410px, calc(100vw - 28px)); overflow: hidden; background: rgba(255,255,255,.98); border: 1px solid #cce1d9; border-radius: 20px; box-shadow: 0 30px 75px rgba(5,52,46,.25); transform-origin: bottom right; animation: assistantOpen .22s ease both; }
.assistant-panel > header { display: flex; align-items: center; justify-content: space-between; padding: 17px 18px; color: #fff; background: linear-gradient(120deg, #06483f, #178060); }.assistant-panel > header > div { display: grid; grid-template-columns: 30px 1fr; align-items: center; column-gap: 8px; }.assistant-panel > header > div > span { grid-row: 1 / 3; display: grid; width: 30px; height: 30px; place-items: center; background: rgba(255,255,255,.14); border-radius: 9px; }.assistant-panel header strong, .assistant-panel header small { display: block; }.assistant-panel header strong { font-size: 13px; }.assistant-panel header small { color: #bfe4d7; font-size: 9px; }.assistant-panel header > button { color: #fff; background: transparent; border: 0; font-size: 24px; }
.assistant-quick { display: flex; gap: 6px; padding: 11px 13px 4px; overflow-x: auto; }.assistant-quick button { flex: 0 0 auto; padding: 6px 9px; color: #176b59; background: #eaf7f1; border: 1px solid #cce6dc; border-radius: 999px; font-size: 9px; font-weight: 800; }
.assistant-messages { display: grid; align-content: start; gap: 9px; height: 320px; padding: 12px 14px; overflow-y: auto; background: linear-gradient(#fbfdfc, #f4f9f7); }.assistant-welcome { padding: 12px; color: #55746b; background: #fff; border: 1px solid #dfebe7; border-radius: 13px; font-size: 11px; line-height: 1.6; }.assistant-message { max-width: 88%; padding: 10px 12px; border-radius: 14px; white-space: pre-wrap; font-size: 11px; line-height: 1.75; }.assistant-message.user { justify-self: end; color: #fff; background: #1b8365; border-end-end-radius: 4px; }.assistant-message.assistant { justify-self: start; background: #fff; border: 1px solid #dbeae4; border-end-start-radius: 4px; }.assistant-message.loading { color: #668078; animation: softBlink 1.2s ease infinite; }.assistant-message.error { color: var(--danger); background: var(--danger-bg); }.assistant-feedback { display: flex; align-items: center; gap: 6px; color: #6a7f78; font-size: 9px; }.assistant-feedback button { display: grid; width: 24px; height: 24px; place-items: center; color: var(--green-900); background: #fff; border: 1px solid #d3e6df; border-radius: 7px; }
.assistant-panel > form { display: grid; grid-template-columns: 1fr auto; gap: 8px; padding: 12px; background: #fff; border-top: 1px solid #e1ece8; }.assistant-panel > form input[type="hidden"] { display: none; }.assistant-panel > form textarea { min-height: 48px; max-height: 110px; padding: 9px 11px; font-size: 11px; }.assistant-panel > form button { align-self: stretch; padding: 0 15px; color: #fff; background: #167f62; border: 0; border-radius: 10px; font-weight: 900; }

.manual-order-form { display: grid; gap: 20px; }.subsection-heading { margin: 6px 0 0; padding-top: 18px; border-top: 1px solid var(--line); }.manual-lines-table { min-width: 1060px; }.manual-lines-table td:first-child { min-width: 310px; }.manual-lines-table .product-search-input { margin-bottom: 7px; padding: 8px; background: #f6fbf9; }.manual-lines-table select { min-width: 105px; }.icon-button { display: grid; width: 32px; height: 32px; place-items: center; border: 0; border-radius: 9px; font-size: 18px; }.icon-button.danger { color: var(--danger); background: var(--danger-bg); }.priority-toggle { display: flex; align-items: center; gap: 10px; padding: 13px; background: #f3faf6; border: 1px solid #cfe7dc; border-radius: 11px; }.priority-toggle input { width: 18px; height: 18px; }.priority-toggle span { display: grid; }.priority-toggle small { color: var(--muted); font-size: 10px; }

.intelligence-hero, .customer-intelligence-hero { position: relative; display: flex; align-items: center; justify-content: space-between; gap: 28px; margin-bottom: 20px; padding: 32px 35px; overflow: hidden; color: #fff; background: radial-gradient(circle at 15% 20%, rgba(113,216,158,.2), transparent 30%), linear-gradient(125deg, #073e39, #0d685d 58%, #299268); border-radius: 22px; box-shadow: 0 18px 45px rgba(7,72,63,.2); }
.intelligence-hero::after, .customer-intelligence-hero::after { content: ""; position: absolute; width: 260px; height: 260px; inset-inline-end: -90px; bottom: -150px; border: 1px solid rgba(255,255,255,.17); border-radius: 50%; box-shadow: 0 0 0 35px rgba(255,255,255,.025), 0 0 0 70px rgba(255,255,255,.018); }.intelligence-hero > *, .customer-intelligence-hero > * { position: relative; z-index: 1; }.intelligence-hero h1, .customer-intelligence-hero h1 { margin: 5px 0 8px; font-size: clamp(27px,3vw,40px); }.intelligence-hero p, .customer-intelligence-hero p { margin: 0; color: #cae7de; }.intelligence-hero .eyebrow, .customer-intelligence-hero .eyebrow { color: #95e0b5; }.hero-orb { display: grid; width: 118px; height: 118px; flex: 0 0 auto; place-items: center; align-content: center; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.2); border-radius: 50%; backdrop-filter: blur(7px); }.hero-orb span { font-size: 36px; font-weight: 900; }.hero-orb small { color: #cde7df; font-size: 10px; }
.intelligence-tabs { display: flex; gap: 5px; margin-bottom: 20px; padding: 5px; overflow-x: auto; background: rgba(255,255,255,.86); border: 1px solid var(--line); border-radius: 13px; }.intelligence-tabs a { flex: 1; min-width: 110px; padding: 9px 12px; color: #60756f; text-align: center; border-radius: 9px; font-size: 10px; font-weight: 900; white-space: nowrap; }.intelligence-tabs a.active { color: #fff; background: #117463; box-shadow: 0 7px 16px rgba(17,116,99,.19); }
.smart-customer-strip { margin-bottom: 22px; padding: 20px; background: #fff; border: 1px solid var(--line); border-radius: 17px; box-shadow: var(--shadow); }.smart-customer-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(230px,1fr)); gap: 10px; }.smart-customer-card { display: grid; grid-template-columns: 32px 1fr auto; align-items: center; gap: 10px; padding: 14px; background: linear-gradient(135deg,#f5fbf8,#fff); border: 1px solid #d8ebe3; border-radius: 13px; transition: .18s ease; }.smart-customer-card:hover { border-color: #8fcbb4; transform: translateY(-2px); box-shadow: 0 10px 24px rgba(19,99,78,.09); }.smart-customer-card > span { display: grid; width: 31px; height: 31px; place-items: center; color: #a56a05; background: #fff4d8; border-radius: 9px; }.smart-customer-card strong, .smart-customer-card small { display: block; }.smart-customer-card strong { overflow: hidden; font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }.smart-customer-card small { margin-top: 4px; color: var(--muted); font-size: 9px; }.smart-customer-card b { color: #a25c05; font-size: 9px; white-space: nowrap; }
.intelligence-columns { grid-template-columns: 1.1fr .9fr; }.decision-list { display: grid; gap: 8px; }.decision-item { display: grid; grid-template-columns: 31px 1fr; gap: 10px; padding: 12px; background: #fbfdfc; border: 1px solid #e0ebe7; border-radius: 12px; }.decision-item > span { display: grid; width: 30px; height: 30px; place-items: center; color: #9b670e; background: #fff1ce; border-radius: 9px; font-weight: 900; }.decision-item.severity-high > span { color: var(--danger); background: var(--danger-bg); }.decision-item strong { font-size: 11px; }.decision-item p { margin: 4px 0 0; color: var(--muted); font-size: 10px; line-height: 1.6; }.positive-state { padding: 18px; color: #1a7450; background: #e8f7ee; border: 1px solid #c5e8d2; border-radius: 12px; font-weight: 800; }.forecast-mini-list { display: grid; gap: 5px; }.forecast-mini-list > div { display: grid; grid-template-columns: 1fr auto 42px; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid #e8f0ed; }.forecast-mini-list strong, .forecast-mini-list small { display: block; }.forecast-mini-list strong { font-size: 10px; }.forecast-mini-list small { margin-top: 3px; color: var(--muted); font-size: 8px; }.forecast-mini-list b { font-size: 10px; }.forecast-mini-list em { padding: 4px; color: #11634f; background: #e4f5ec; border-radius: 7px; font-size: 8px; font-style: normal; text-align: center; }
.filter-grid { display: grid; grid-template-columns: repeat(4,minmax(150px,1fr)) auto; align-items: end; gap: 12px; }.filter-actions { display: flex; align-items: end; }.compact-form { align-items: end; }.forecast-reason { min-width: 310px; max-width: 520px; color: #536d66; font-size: 10px; line-height: 1.7; }.confidence-chip { display: inline-flex; padding: 5px 8px; color: #176d55; background: #e4f5eb; border-radius: 999px; font-weight: 900; }
.accuracy-timeline { display: grid; gap: 10px; }.accuracy-timeline > div { display: grid; grid-template-columns: 75px 1fr 55px; align-items: center; gap: 10px; font-size: 10px; }.accuracy-timeline i { display: block; width: var(--accuracy); height: 9px; background: linear-gradient(90deg,#8ac926,#19876a); border-radius: 999px; }.accuracy-timeline strong { text-align: end; }.planning-columns { grid-template-columns: minmax(0,2fr) minmax(240px,.6fr); }.planning-summary { display: grid; grid-template-columns: auto 1fr; align-content: center; gap: 10px 14px; background: linear-gradient(145deg,#0d685d,#1c8a65); color: #fff; }.planning-summary span { font-size: 27px; font-weight: 900; }.planning-summary strong { align-self: center; color: #cce8df; font-size: 11px; }.matrix-wrap table { min-width: max-content; }.matrix-wrap th, .matrix-wrap td { min-width: 115px; text-align: center; }.matrix-wrap th:first-child, .matrix-wrap td:first-child { position: sticky; z-index: 2; inset-inline-start: 0; min-width: 210px; background: #fff; text-align: start; }.matrix-wrap th:first-child { background: #eff7f3; }
.note-category { display: inline-flex; padding: 5px 8px; color: #6c4e0b; background: #fff2ce; border-radius: 999px; font-size: 9px; font-weight: 900; }.data-quality-hero { display: flex; align-items: center; gap: 28px; margin-bottom: 22px; padding: 25px 30px; background: linear-gradient(135deg,#fff,#edf8f3); border: 1px solid #cee5dc; border-radius: 18px; }.quality-ring { display: grid; width: 130px; height: 130px; flex: 0 0 auto; place-items: center; align-content: center; background: radial-gradient(circle at center,#fff 58%,transparent 59%),conic-gradient(#25966b calc(var(--score) * 1%),#dbeae4 0); border-radius: 50%; }.quality-ring strong { color: #0d685d; font-size: 28px; }.quality-ring span { width: 78px; color: var(--muted); text-align: center; font-size: 8px; }.data-quality-hero h2 { margin: 0 0 7px; }.data-quality-hero p { margin: 0; color: var(--muted); }.quality-score { display: inline-flex; padding: 6px 9px; border-radius: 999px; font-weight: 900; }.score-good { color:#166843;background:#e2f5e9;}.score-medium{color:#95600b;background:#fff2d4;}.score-low{color:var(--danger);background:var(--danger-bg);}.issue-chip { display: inline-flex; margin: 2px; padding: 4px 7px; color: #8c5707; background: #fff3d8; border-radius: 999px; font-size: 8px; }
.customer-intelligence-hero .button-secondary { color: #fff; background: rgba(255,255,255,.12); border-color: rgba(255,255,255,.25); }.branch-profile-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(260px,1fr)); gap: 13px; margin-bottom: 22px; }.branch-profile { padding: 18px; background: #fff; border: 1px solid #d7e8e1; border-top: 3px solid #2c9a6a; border-radius: 15px; box-shadow: var(--shadow); }.branch-profile > div { display: flex; align-items: center; gap: 10px; }.branch-profile > div span { padding: 5px 8px; color: #176b55; background: #e6f5ed; border-radius: 7px; font: 700 9px Consolas,monospace; }.branch-profile h3 { margin: 0; font-size: 14px; }.branch-profile dl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 15px 0; }.branch-profile dl div { padding: 9px; background: #f6faf8; border-radius: 9px; }.branch-profile dt { color: var(--muted); font-size: 8px; }.branch-profile dd { margin: 4px 0 0; font-size: 11px; font-weight: 900; }.branch-profile > a { color: #13745b; font-size: 9px; font-weight: 900; }
.anomaly-panel { margin-bottom: 22px; padding: 20px; background: linear-gradient(135deg,#fff,#fffbf2); border: 1px solid #ecd9ab; border-radius: 17px; box-shadow: var(--shadow); }.order-anomaly-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(280px,1fr)); gap: 9px; }.order-anomaly { display: grid; grid-template-columns: 31px 1fr; gap: 10px; padding: 12px; background: #fff; border: 1px solid #eadfca; border-radius: 11px; }.order-anomaly > span { display: grid; width: 30px; height: 30px; place-items: center; color: #95600a; background: #fff1d2; border-radius: 8px; font-weight: 900; }.order-anomaly.severity-high > span { color: var(--danger); background: var(--danger-bg); }.order-anomaly strong { font-size: 10px; }.order-anomaly p { margin: 4px 0 0; color: var(--muted); font-size: 9px; line-height: 1.6; }
.notification-list { display: grid; gap: 10px; }.notification-card { display: grid; grid-template-columns: 42px 1fr auto; align-items: center; gap: 13px; padding: 17px; background: #fff; border: 1px solid var(--line); border-radius: 15px; box-shadow: 0 8px 22px rgba(21,77,64,.05); }.notification-card.is-unread { border-inline-start: 4px solid #249266; }.notification-symbol { display: grid; width: 40px; height: 40px; place-items: center; color: #76500b; background: #fff2d6; border-radius: 11px; font-weight: 900; }.notification-card.severity-high .notification-symbol { color: var(--danger); background: var(--danger-bg); }.notification-card h3 { margin: 0 0 4px; font-size: 13px; }.notification-card p { margin: 0; color: var(--muted); font-size: 10px; line-height: 1.6; }.notification-card small { color: #8ba098; font-size: 8px; }.notification-actions { display: flex; align-items: center; gap: 6px; }

@keyframes assistantPulse { 0%,100%{transform:scale(1)}50%{transform:scale(1.08);background:rgba(255,255,255,.23)} }
@keyframes assistantOpen { from{opacity:0;transform:translateY(15px) scale(.96)}to{opacity:1;transform:none} }
@keyframes softBlink { 0%,100%{opacity:.55}50%{opacity:1} }

@media (max-width: 1180px) {
  .app-sidebar { transform: translateX(-100%); }
  [dir="rtl"] .app-sidebar { transform: translateX(100%); }
  .app-sidebar.open { transform: translateX(0); }
  .sidebar-overlay.open { display: block; }
  .app-topbar { inset-inline-start: 0; padding-inline: 18px; }
  .sidebar-toggle { display: grid; place-items: center; }
  .authenticated-body .app-shell { margin-inline-start: 0; padding-inline: 22px; }
  .filter-grid { grid-template-columns: repeat(2,minmax(150px,1fr)); }.filter-actions { grid-column: 1 / -1; }
}
@media (max-width: 720px) {
  .authenticated-body .app-shell { width: auto; padding: 88px 12px 74px; }
  .app-topbar { height: 62px; padding-inline: 11px; }.topbar-title span, .topbar-actions .language-switch, .topbar-actions form { display: none; }.topbar-title strong { font-size: 12px; }
  .app-sidebar { width: min(285px,86vw); }.intelligence-hero,.customer-intelligence-hero { align-items: flex-start; flex-direction: column; padding: 25px 20px; }.hero-orb { width: 88px; height: 88px; }.hero-orb span { font-size: 27px; }
  .intelligence-columns,.planning-columns { grid-template-columns: 1fr; }.filter-grid { grid-template-columns: 1fr; }.filter-actions { grid-column: auto; }.smart-customer-grid { grid-template-columns: 1fr; }.data-quality-hero { align-items: flex-start; flex-direction: column; }.quality-ring { width: 105px; height: 105px; }
  .assistant-launcher { inset-inline-end: 13px; bottom: 12px; }.assistant-launcher small { display: none; }.assistant-launcher { width: 52px; padding: 7px; }.assistant-panel { inset-inline-end: 7px; bottom: 72px; width: calc(100vw - 14px); }.assistant-messages { height: 42vh; }
  .notification-card { grid-template-columns: 36px 1fr; }.notification-actions { grid-column: 2; flex-wrap: wrap; }
}
@media (prefers-reduced-motion: reduce) { *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; transition-duration: .01ms !important; } }
@media print { .app-sidebar,.app-topbar,.assistant-launcher,.assistant-panel,.sidebar-overlay { display:none !important; }.authenticated-body .app-shell { margin:0; padding:0; }.intelligence-tabs { display:none; } }

/* Version 3 — priority accounts, review editor, and two-stage delivery */
.priority-order { position: relative; background: #fffdf8; }
.priority-order td:first-child { border-inline-start: 4px solid #d59a24; }
.priority-pill { display: inline-flex; align-items: center; width: max-content; margin-top: 6px; padding: 4px 8px; border-radius: 999px; font-size: 10px; font-weight: 900; }
.priority-violet { --priority: #7651b5; --priority-bg: #f1ebfb; }.priority-emerald { --priority: #14855f; --priority-bg: #e5f6ef; }
.priority-amber { --priority: #b87312; --priority-bg: #fff1d8; }.priority-blue { --priority: #286cae; --priority-bg: #e7f1fb; }
.priority-pill.priority-violet, .priority-pill.priority-emerald, .priority-pill.priority-amber, .priority-pill.priority-blue { color: var(--priority); background: var(--priority-bg); }
.priority-customer-section { margin-bottom: 22px; padding: 22px; background: linear-gradient(135deg, #fdfefe, #edf6f2); border: 1px solid #d9e8e2; border-radius: 19px; box-shadow: var(--shadow); }
.priority-orders-panel { margin-bottom: 22px; padding: 22px; background: linear-gradient(135deg, #173d32, #0e6758); border-radius: 19px; box-shadow: 0 20px 42px rgba(13, 90, 73, .17); }.priority-orders-panel h2 { margin: 4px 0; color: white; }.priority-orders-panel .muted { color: #c9e1d9; }.priority-orders-panel .eyebrow { color: #9ce0b9; }
.priority-order-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }.priority-order-card { display: grid; gap: 7px; padding: 16px; background: white; border: 1px solid rgba(255,255,255,.25); border-top: 4px solid var(--priority); border-radius: 13px; transition: transform .2s ease; }.priority-order-card:hover { transform: translateY(-4px); }.priority-order-card > span { width: max-content; padding: 4px 7px; color: var(--priority); background: var(--priority-bg); border-radius: 999px; font-size: 10px; font-weight: 900; }.priority-order-card > strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }.priority-order-card > small { color: var(--muted); }.priority-order-card > div { display: flex; align-items: center; justify-content: space-between; gap: 6px; padding-top: 7px; border-top: 1px solid var(--line); }.priority-order-card b { color: var(--green-900); font-size: 11px; }
.priority-customer-section h2 { margin: 4px 0 0; }
.priority-customer-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 13px; }
.priority-customer-card { position: relative; overflow: hidden; padding: 19px; background: white; border: 1px solid color-mix(in srgb, var(--priority) 22%, white); border-radius: 15px; box-shadow: 0 10px 25px rgba(20, 65, 53, .06); }
.priority-customer-card::before { content: ""; position: absolute; inset: 0 0 auto; height: 4px; background: var(--priority); }
.priority-customer-card > div:first-child { display: grid; gap: 9px; }.priority-customer-card > div > span { color: var(--priority); font-weight: 900; }.priority-customer-card > div > strong { color: #173a32; font-size: 20px; }
.priority-customer-card dl { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; margin: 16px 0 12px; }
.priority-customer-card dl div { padding: 9px; background: var(--priority-bg); border-radius: 9px; }.priority-customer-card dt { color: #6d7d78; font-size: 10px; }.priority-customer-card dd { margin: 3px 0 0; color: var(--priority); font-size: 13px; font-weight: 900; }
.priority-customer-card > small { color: var(--muted); font-size: 10px; }
.delivery-performance { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.delivery-performance span { display: grid; gap: 3px; padding: 13px; color: var(--muted); background: #f5faf8; border: 1px solid var(--line); border-radius: 11px; font-size: 11px; }.delivery-performance b { color: var(--green-900); font-size: 24px; }
.history-import-card { max-width: 1050px; margin-top: 26px; border: 1px solid #dfc27f; background: linear-gradient(145deg, #fff, #fffaf0); }
.delete-line-toggle { display: flex; min-width: 105px; align-items: center; gap: 7px; padding: 8px; color: var(--danger); background: var(--danger-bg); border-radius: 9px; font-size: 11px; }
.delete-line-toggle input { width: 15px; min-width: 15px; margin: 0; accent-color: var(--danger); }
.review-editor-actions { display: flex; align-items: center; gap: 13px; padding-top: 14px; }.manual-review-row { background: #f0f8ff; }
.branch-edit-fields { display: grid; min-width: 150px; gap: 5px; }.branch-edit-fields input:last-child { background: #f7fbf9; font-size: 11px; }
.delivery-inline-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px; }
.delivery-inline-card { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding: 14px; background: #f6faf8; border: 1px solid var(--line); border-radius: 12px; transition: .2s ease; }.delivery-inline-card:hover { transform: translateY(-2px); border-color: #86bea9; }.delivery-inline-card strong, .delivery-inline-card small { display: block; }.delivery-inline-card small { margin-top: 4px; color: var(--muted); }

.delivery-heading { padding: 26px; color: white; background: linear-gradient(135deg, #0a554c, #16846a); border-radius: 20px; box-shadow: 0 22px 45px rgba(13, 91, 75, .18); }.delivery-heading .eyebrow { color: #a9e5c6; }.delivery-heading .muted { color: #d9eee8; }
.delivery-live { display: grid; grid-template-columns: auto auto; align-items: center; gap: 3px 8px; padding: 12px 17px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.2); border-radius: 14px; }.delivery-live i { width: 9px; height: 9px; background: #8ee39f; border-radius: 50%; box-shadow: 0 0 0 6px rgba(142,227,159,.15); animation: livePulse 1.8s infinite; }.delivery-live span { font-size: 11px; }.delivery-live b { grid-column: 1 / -1; font-size: 27px; }
.delivery-stats { display: grid; grid-template-columns: repeat(6, minmax(0, 1fr)); gap: 10px; margin-bottom: 20px; }.delivery-stats a { position: relative; overflow: hidden; padding: 15px; background: white; border: 1px solid var(--line); border-radius: 13px; box-shadow: 0 8px 20px rgba(21,77,64,.05); }.delivery-stats a.active { border-color: var(--green-700); box-shadow: 0 0 0 2px rgba(33,140,75,.12); }.delivery-stats span { display: block; color: var(--muted); font-size: 11px; }.delivery-stats strong { display: block; margin-top: 7px; color: var(--green-900); font-size: 25px; }.delivery-dot { position: absolute; top: 15px; inset-inline-end: 15px; width: 8px; height: 8px; border-radius: 50%; }.delivery-dot-ready { background: #3f92c4; }.delivery-dot-printed, .delivery-dot-confirming { background: #e29a27; }.delivery-dot-delivered { background: #27a66c; }.delivery-dot-rejected { background: #ba3b42; }
.delivery-customer { display: grid; gap: 2px; }.delivery-customer strong { color: #173f36; }.delivery-customer small { margin: 0; }.delivery-table-card table { min-width: 1000px; }.delivery-row-printed, .delivery-row-confirming { background: #fffaf0; }.delivery-row-rejected { background: #fff6f6; }
.delivery-job-hero { display: flex; align-items: center; justify-content: space-between; gap: 24px; margin-bottom: 18px; padding: 25px; background: white; border: 1px solid var(--line); border-radius: 18px; box-shadow: var(--shadow); }.delivery-job-hero > div:first-child { flex: 1; }.delivery-job-hero dl { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin: 18px 0 0; }.delivery-job-hero dl div { padding: 10px 12px; background: #f5faf8; border-radius: 10px; }.delivery-job-hero dt { color: var(--muted); font-size: 10px; }.delivery-job-hero dd { margin: 4px 0 0; color: var(--green-900); font-weight: 900; }.delivery-primary-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.delivery-timeline { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0; margin: 0 0 22px; padding: 22px; background: #103f36; border-radius: 18px; }.delivery-timeline article { position: relative; display: flex; align-items: flex-start; gap: 10px; color: #9eb9b1; }.delivery-timeline article::after { content: ""; position: absolute; top: 15px; inset-inline-start: 32px; width: calc(100% - 32px); height: 2px; background: #315f55; }.delivery-timeline article:last-child::after { display: none; }.delivery-timeline article > span { position: relative; z-index: 1; display: grid; flex: 0 0 30px; width: 30px; height: 30px; place-items: center; background: #315f55; border-radius: 50%; font-size: 11px; font-weight: 900; }.delivery-timeline article.done > span { color: #123c32; background: #8edaaa; }.delivery-timeline strong { display: block; color: white; font-size: 11px; line-height: 1.5; }.delivery-timeline small { display: block; margin-top: 4px; color: #9eb9b1; font-size: 9px; line-height: 1.5; }
.delivery-decision-card { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 30px; margin-bottom: 22px; padding: 28px; color: white; background: radial-gradient(circle at 10% 10%, rgba(139,211,157,.25), transparent 38%), linear-gradient(135deg, #0a574d, #123c35); border-radius: 19px; box-shadow: 0 20px 44px rgba(11,79,67,.18); }.delivery-decision-card span { color: #9fe0bd; font-size: 12px; font-weight: 900; }.delivery-decision-card h2 { margin: 6px 0; font-size: 26px; }.delivery-decision-card p { margin: 0; color: #cce4dc; line-height: 1.65; }.delivery-decision-actions { display: grid; gap: 10px; }.delivery-decision-actions form { margin: 0; }.delivery-decision-actions .button { width: 100%; }.delivery-decision-actions details { position: relative; }.delivery-decision-actions summary { list-style: none; }.delivery-decision-actions details form { display: grid; gap: 10px; margin-top: 10px; padding: 14px; background: white; border-radius: 12px; }.delivery-decision-actions details label { color: #4a514f; }
.delivery-rejection p { margin: 7px 0; }.delivery-rejection small { opacity: .8; }.final-delivery-card { border-top: 4px solid #26a46a; }.delivery-variance { background: #fff5e4 !important; }.delivery-items-table td strong { color: var(--green-900); }
.delivery-confirm-guide { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; margin-bottom: 20px; }.delivery-confirm-guide > div { display: flex; gap: 11px; padding: 16px; background: white; border: 1px solid var(--line); border-radius: 13px; }.delivery-confirm-guide span { display: grid; flex: 0 0 30px; width: 30px; height: 30px; place-items: center; color: white; background: var(--green-800); border-radius: 9px; font-weight: 900; }.delivery-confirm-guide p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }.delivery-confirm-guide strong { display: block; color: var(--ink); font-size: 12px; }.delivery-edit-table { min-width: 1160px; }.delivery-edit-table input, .delivery-edit-table select, .delivery-edit-table textarea { min-width: 110px; padding: 8px; }.delivery-edit-table td:first-child { min-width: 310px; }
@keyframes livePulse { 50% { box-shadow: 0 0 0 10px rgba(142,227,159,0); } }

/* Public Tazejah website */
.landing-body { --landing-green: #173324; --landing-mid: #2b9348; --landing-bright: #36b65e; --landing-orange: #f28d35; color: #173324; background: #fbfdf8; overflow-x: hidden; }
.landing-body main { overflow: hidden; }.landing-body h1, .landing-body h2, .landing-body h3, .landing-body p { text-wrap: balance; }
.landing-container { width: min(1180px, calc(100% - 48px)); margin-inline: auto; }
.landing-header { position: fixed; z-index: 100; top: 0; inset-inline: 0; display: flex; align-items: center; justify-content: space-between; gap: 30px; height: 92px; padding-inline: max(28px, calc((100vw - 1240px) / 2)); color: white; transition: height .3s ease, background .3s ease, box-shadow .3s ease; }
.landing-header.scrolled { height: 72px; color: var(--landing-green); background: rgba(255,255,255,.92); box-shadow: 0 10px 35px rgba(16,50,37,.11); backdrop-filter: blur(16px); }.landing-brand { display: flex; flex: 0 0 auto; width: 116px; height: 58px; padding: 5px 10px; background: white; border-radius: 13px; box-shadow: 0 8px 26px rgba(0,0,0,.08); }.landing-brand img { width: 100%; height: 100%; object-fit: contain; }.landing-header nav { display: flex; align-items: center; gap: 6px; }.landing-header nav a { position: relative; padding: 10px 12px; font-size: 13px; font-weight: 750; }.landing-header nav a::after { content: ""; position: absolute; inset-inline: 12px; bottom: 4px; height: 2px; background: var(--landing-orange); transform: scaleX(0); transition: transform .2s ease; }.landing-header nav a:hover::after { transform: scaleX(1); }
.landing-header-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 8px; }.landing-lang { display: grid; width: 39px; height: 39px; place-items: center; border: 1px solid rgba(255,255,255,.28); border-radius: 50%; font-weight: 900; }.landing-header.scrolled .landing-lang { border-color: #cbdcd3; }.landing-login { display: inline-flex; align-items: center; gap: 9px; padding: 11px 17px; color: var(--landing-green); background: white; border-radius: 11px; font-size: 12px; font-weight: 900; box-shadow: 0 8px 22px rgba(0,0,0,.08); }.landing-header.scrolled .landing-login { color: white; background: var(--landing-green); }.landing-menu-button { display: none; width: 42px; height: 42px; padding: 10px; background: transparent; border: 1px solid currentColor; border-radius: 10px; }.landing-menu-button span { display: block; height: 2px; margin: 4px 0; background: currentColor; }
.landing-hero { position: relative; display: grid; min-height: 780px; padding: 150px 0 80px; color: white; background: radial-gradient(circle at 10% 90%, rgba(80,174,92,.34), transparent 28%), radial-gradient(circle at 90% 10%, rgba(242,141,53,.16), transparent 24%), linear-gradient(135deg, #10291d, #173b28 60%, #1d4c31); }.hero-glow { position: absolute; border: 1px solid rgba(255,255,255,.07); border-radius: 50%; }.hero-glow-one { width: 520px; height: 520px; top: -260px; inset-inline-end: -120px; }.hero-glow-two { width: 290px; height: 290px; bottom: -120px; inset-inline-start: 12%; }.hero-grid { display: grid; grid-template-columns: 1.02fr .98fr; align-items: center; gap: 50px; }.landing-kicker { display: inline-flex; align-items: center; gap: 9px; color: #bfe2c7; font-size: 12px; font-weight: 800; }.landing-kicker i { width: 28px; height: 2px; background: var(--landing-orange); }.hero-copy h1 { max-width: 650px; margin: 17px 0 20px; font-size: clamp(42px, 5.5vw, 73px); line-height: 1.07; letter-spacing: -.045em; }.hero-copy h1 em { display: inline; color: #8ad68f; font-style: normal; }.hero-copy > p { max-width: 620px; margin: 0; color: #c9d9d0; font-size: 17px; line-height: 1.9; }.hero-buttons { display: flex; flex-wrap: wrap; gap: 11px; margin: 29px 0 22px; }.landing-cta { display: inline-flex; align-items: center; justify-content: center; gap: 12px; min-height: 52px; padding: 13px 23px; border-radius: 13px; font-size: 13px; font-weight: 900; transition: transform .2s ease, box-shadow .2s ease; }.landing-cta:hover { transform: translateY(-3px); }.landing-cta-primary { color: #163326; background: #91da98; box-shadow: 0 13px 32px rgba(84,181,96,.23); }.landing-cta-secondary { color: white; border: 1px solid rgba(255,255,255,.23); background: rgba(255,255,255,.05); }.hero-trust { display: flex; flex-wrap: wrap; gap: 17px; color: #aec8ba; font-size: 11px; }.hero-trust span::first-letter { color: #8ed695; }
.hero-visual { position: relative; min-height: 500px; transform: translate3d(var(--hero-x, 0), var(--hero-y, 0), 0); transition: transform .18s ease-out; }.hero-image-card { position: absolute; inset: 35px 10px 30px 30px; display: grid; place-items: center; overflow: hidden; background: radial-gradient(circle, rgba(77,163,87,.38), transparent 65%); border: 1px solid rgba(255,255,255,.08); border-radius: 46% 54% 42% 58% / 58% 44% 56% 42%; animation: heroFloat 6s ease-in-out infinite; }.hero-image-card img { width: 118%; height: 118%; object-fit: contain; filter: drop-shadow(0 28px 28px rgba(0,0,0,.2)); }.hero-orbit { position: absolute; border: 1px dashed rgba(151,218,153,.22); border-radius: 50%; animation: orbitSpin 24s linear infinite; }.hero-orbit-one { inset: 0; }.hero-orbit-two { inset: 65px; animation-direction: reverse; }.floating-badge { position: absolute; z-index: 2; display: flex; align-items: center; gap: 9px; padding: 10px 13px; color: #18372a; background: rgba(255,255,255,.93); border-radius: 12px; box-shadow: 0 13px 35px rgba(0,0,0,.17); font-size: 11px; font-weight: 900; animation: badgeFloat 4s ease-in-out infinite; }.floating-badge svg { width: 24px; color: #2d9850; }.floating-badge-quality { top: 54px; inset-inline-start: 0; }.floating-badge-cold { right: 0; bottom: 78px; animation-delay: -2s; }.hero-tomatoes { position: absolute; z-index: 3; width: 150px; inset-inline-end: -42px; bottom: 3px; filter: drop-shadow(0 16px 15px rgba(0,0,0,.22)); }.scroll-cue { position: absolute; bottom: 27px; left: 50%; display: grid; width: 28px; height: 43px; place-items: start center; padding-top: 7px; border: 1px solid rgba(255,255,255,.28); border-radius: 18px; transform: translateX(-50%); }.scroll-cue span { width: 4px; height: 8px; background: #91da98; border-radius: 5px; animation: scrollCue 1.7s infinite; }
.landing-numbers { padding: 90px 0; color: white; background: #1e4a30; }.section-heading { max-width: 750px; margin: 0 auto 42px; text-align: center; }.section-heading > span, .section-label { color: #319952; font-size: 12px; font-weight: 900; letter-spacing: .08em; }.section-heading h2, .about-copy h2 { margin: 9px 0 12px; font-size: clamp(29px, 4vw, 46px); line-height: 1.25; }.section-heading p { margin: 0; color: #6b7d74; line-height: 1.8; }.section-heading-light > span { color: #8cd895; }.section-heading-light h2 { color: white; }.number-grid { display: grid; grid-template-columns: repeat(4, 1fr); }.number-grid article { position: relative; display: grid; min-height: 150px; place-content: center; padding: 20px; text-align: center; border-inline-end: 1px solid rgba(255,255,255,.12); }.number-grid article:last-child { border: 0; }.number-grid strong { color: #9adfa0; font-size: clamp(34px, 4vw, 52px); }.number-grid strong b { font: inherit; }.number-grid span { margin-top: 8px; color: #c8d8cf; font-size: 12px; }.number-grid svg { width: 43px; margin: 0 auto 8px; color: #9adfa0; }
.landing-about { padding: 110px 0; background: #fbfdf8; }.about-grid { display: grid; grid-template-columns: .9fr 1.1fr; align-items: center; gap: 80px; }.about-visual { position: relative; min-height: 480px; }.about-visual::before { content: ""; position: absolute; inset: 20px 40px -20px -20px; background: #e7f4e5; border-radius: 45% 55% 62% 38% / 47% 35% 65% 53%; }.about-visual img { position: relative; width: 100%; height: 480px; object-fit: cover; border-radius: 43% 57% 48% 52% / 51% 40% 60% 49%; box-shadow: 0 26px 55px rgba(26,74,47,.18); }.about-stamp { position: absolute; right: -18px; bottom: 20px; display: grid; width: 120px; height: 120px; place-content: center; color: white; text-align: center; background: var(--landing-orange); border: 8px solid #fbfdf8; border-radius: 50%; transform: rotate(-7deg); }.about-stamp b { font-size: 25px; }.about-stamp span { font-size: 10px; }.about-copy > p { color: #60746a; font-size: 15px; line-height: 2; }.about-points { display: grid; gap: 12px; margin-top: 26px; }.about-points span { display: flex; align-items: center; gap: 12px; padding: 13px; background: white; border: 1px solid #e0ebe4; border-radius: 12px; }.about-points svg { width: 27px; color: #2d9850; }
.landing-products { padding: 105px 0; background: #f1f7ef; }.product-carousel-controls { display: flex; justify-content: flex-end; gap: 7px; margin-bottom: 14px; }.product-carousel-controls button { width: 42px; height: 42px; color: var(--landing-green); background: white; border: 1px solid #d9e5db; border-radius: 50%; }.landing-product-grid { display: grid; grid-auto-flow: column; grid-auto-columns: minmax(260px, 31%); gap: 15px; overflow-x: auto; padding: 5px 3px 20px; scroll-snap-type: x mandatory; scrollbar-color: #91c69c transparent; }.landing-product-card { overflow: hidden; background: white; border: 1px solid #dfe9df; border-radius: 18px; scroll-snap-align: start; box-shadow: 0 12px 28px rgba(32,85,48,.06); transition: transform .25s ease, box-shadow .25s ease; }.landing-product-card:hover { transform: translateY(-7px); box-shadow: 0 22px 38px rgba(32,85,48,.12); }.product-card-image { position: relative; height: 235px; overflow: hidden; background: var(--card-bg); }.product-card-image img { width: 100%; height: 100%; object-fit: cover; mix-blend-mode: multiply; transition: transform .5s ease; }.landing-product-card:hover img { transform: scale(1.07) rotate(1deg); }.product-card-image > span { position: absolute; top: 14px; inset-inline-start: 14px; display: grid; width: 34px; height: 34px; place-items: center; color: white; background: rgba(23,51,36,.84); border-radius: 50%; font-size: 10px; }.landing-product-card > div:last-child { padding: 19px; }.landing-product-card small { color: #4b9b5e; font-weight: 800; }.landing-product-card h3 { min-height: 52px; margin: 7px 0 14px; font-size: 19px; }.landing-product-card a { color: #2a7f45; font-size: 12px; font-weight: 900; }
.landing-why { padding: 110px 0; color: white; background: radial-gradient(circle at 80% 10%, rgba(75,159,81,.25), transparent 30%), #142e20; }.why-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 13px; }.why-grid article { position: relative; min-height: 280px; padding: 28px 23px; background: rgba(255,255,255,.045); border: 1px solid rgba(255,255,255,.09); border-radius: 17px; transition: background .25s ease, transform .25s ease; }.why-grid article:hover { transform: translateY(-6px); background: rgba(70,163,82,.14); }.why-grid svg { width: 43px; color: #8ed698; }.why-grid > article > span { position: absolute; top: 22px; inset-inline-end: 20px; color: rgba(255,255,255,.15); font-size: 28px; font-weight: 900; }.why-grid h3 { margin: 31px 0 11px; font-size: 19px; }.why-grid p { margin: 0; color: #aec1b6; font-size: 13px; line-height: 1.8; }
.landing-steps { padding: 110px 0; background: #fbfdf8; }.steps-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 24px; }.steps-grid article { display: grid; grid-template-columns: auto 1fr; gap: 14px; padding: 25px; background: white; border: 1px solid #dfe9df; border-radius: 17px; box-shadow: 0 11px 28px rgba(28,74,43,.06); }.steps-grid article > b { color: #d5e3d7; font-size: 29px; }.steps-grid svg { width: 38px; color: #2c9850; }.steps-grid h3 { margin: 13px 0 6px; }.steps-grid p { margin: 0; color: #687b70; font-size: 12px; line-height: 1.7; }
.landing-contact { padding: 0 0 110px; background: #fbfdf8; }.contact-card { display: flex; align-items: center; justify-content: space-between; gap: 40px; padding: 55px; color: white; background: radial-gradient(circle at 10% 0, rgba(108,195,113,.27), transparent 35%), #1b462e; border-radius: 26px; box-shadow: 0 28px 58px rgba(22,64,39,.18); }.contact-card span { color: #a4dda8; font-size: 12px; font-weight: 900; }.contact-card h2 { max-width: 700px; margin: 9px 0; font-size: clamp(28px, 4vw, 45px); }.contact-card p { margin: 0; color: #bed0c5; }.landing-cta-orange { color: white; background: var(--landing-orange); box-shadow: 0 12px 28px rgba(242,141,53,.25); }
.landing-footer { padding: 60px 0 0; color: #c6d5cc; background: #10271a; }.landing-footer > .landing-container { display: grid; grid-template-columns: 1.3fr .7fr 1fr; gap: 50px; padding-bottom: 45px; }.landing-footer img { width: 125px; height: 64px; object-fit: contain; padding: 5px; background: white; border-radius: 11px; }.landing-footer p { max-width: 400px; color: #8fa69a; font-size: 12px; line-height: 1.8; }.landing-footer nav { display: grid; align-content: start; gap: 13px; font-size: 13px; }.landing-footer > .landing-container > div:last-child { display: grid; align-content: start; gap: 8px; }.landing-footer b { color: white; font-size: 22px; direction: ltr; }.landing-footer > p { max-width: none; margin: 0; padding: 17px; text-align: center; border-top: 1px solid rgba(255,255,255,.07); }
[data-reveal] { opacity: 0; transform: translateY(26px); transition: opacity .7s ease var(--reveal-delay, 0ms), transform .7s cubic-bezier(.2,.7,.2,1) var(--reveal-delay, 0ms); }[data-reveal].revealed { opacity: 1; transform: translateY(0); }
@keyframes heroFloat { 50% { transform: translateY(-12px) rotate(1deg); } }@keyframes badgeFloat { 50% { transform: translateY(-8px); } }@keyframes orbitSpin { to { transform: rotate(360deg); } }@keyframes scrollCue { 70% { transform: translateY(14px); opacity: .15; } }

@media (max-width: 1050px) {
  .priority-customer-grid, .priority-order-grid { grid-template-columns: repeat(2, 1fr); }
  .delivery-stats { grid-template-columns: repeat(3, 1fr); }.delivery-timeline { grid-template-columns: 1fr 1fr; gap: 18px; }.delivery-timeline article::after { display: none; }
  .landing-header { padding-inline: 24px; }.landing-header nav { display: none; position: absolute; top: calc(100% - 4px); inset-inline: 20px; padding: 14px; color: var(--landing-green); background: white; border-radius: 14px; box-shadow: 0 18px 40px rgba(0,0,0,.15); }.landing-header nav.open { display: grid; }.landing-menu-button { display: block; }.landing-header-actions { margin-inline-start: auto; }
  .hero-grid { grid-template-columns: 1fr 1fr; gap: 25px; }.hero-copy h1 { font-size: clamp(38px, 5vw, 55px); }.about-grid { gap: 42px; }.why-grid { grid-template-columns: repeat(2, 1fr); }.landing-product-grid { grid-auto-columns: minmax(260px, 44%); }
}
@media (max-width: 760px) {
  .priority-customer-grid, .priority-order-grid, .delivery-confirm-guide, .delivery-decision-card { grid-template-columns: 1fr; }.priority-customer-section, .priority-orders-panel { padding: 16px; }.review-editor-actions { align-items: stretch; flex-direction: column; }
  .delivery-stats { grid-template-columns: repeat(2, 1fr); }.delivery-job-hero { align-items: stretch; flex-direction: column; }.delivery-job-hero dl { grid-template-columns: 1fr; }.delivery-primary-actions { flex-direction: column; }.delivery-timeline { grid-template-columns: 1fr; }
  .landing-container { width: min(100% - 30px, 1180px); }.landing-header { height: 75px; padding-inline: 15px; gap: 9px; }.landing-brand { width: 91px; height: 49px; }.landing-login { padding: 10px 12px; }.landing-lang { width: 35px; height: 35px; }.landing-menu-button { width: 38px; height: 38px; }
  .landing-hero { min-height: auto; padding: 120px 0 70px; }.hero-grid { grid-template-columns: 1fr; }.hero-copy { position: relative; z-index: 4; text-align: center; }.landing-kicker { justify-content: center; }.hero-copy h1 { margin-inline: auto; font-size: clamp(38px, 12vw, 55px); }.hero-copy > p { font-size: 14px; }.hero-buttons, .hero-trust { justify-content: center; }.hero-visual { min-height: 390px; }.hero-tomatoes { width: 105px; inset-inline-end: 0; }.floating-badge-quality { inset-inline-start: 5px; }.floating-badge-cold { right: 5px; }
  .landing-numbers, .landing-about, .landing-products, .landing-why, .landing-steps { padding-block: 75px; }.number-grid { grid-template-columns: 1fr 1fr; }.number-grid article:nth-child(2) { border: 0; }.number-grid article:nth-child(-n+2) { border-bottom: 1px solid rgba(255,255,255,.12); }.about-grid { grid-template-columns: 1fr; }.about-visual, .about-visual img { min-height: 360px; height: 360px; }.about-stamp { right: 4px; }.landing-product-grid { grid-auto-columns: minmax(250px, 85%); }.why-grid, .steps-grid { grid-template-columns: 1fr; }.contact-card { align-items: stretch; flex-direction: column; padding: 36px 25px; }.landing-footer > .landing-container { grid-template-columns: 1fr; gap: 27px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
  [data-reveal] { opacity: 1; transform: none; }
}

/* v4.0.1 — grouped key accounts and clearer delivery confirmation */
.priority-customer-card { padding: 0; }
.priority-customer-card > summary { display: block; padding: 19px; cursor: pointer; list-style: none; }
.priority-customer-card > summary::-webkit-details-marker { display: none; }
.priority-customer-card > summary:focus-visible { outline: 3px solid color-mix(in srgb, var(--priority) 35%, white); outline-offset: -3px; border-radius: 15px; }
.priority-customer-heading { display: grid; gap: 9px; }
.priority-customer-heading > span { color: var(--priority); font-size: 18px; font-weight: 900; }
.priority-customer-heading > strong { color: #173a32; font-size: 20px; }
.priority-customer-card > summary dl { grid-template-columns: repeat(3, minmax(0, 1fr)); margin-bottom: 10px; }
.priority-customer-card > summary > small { display: block; margin-top: 9px; color: var(--muted); font-size: 10px; }
.priority-expand-label { display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 8px 10px; color: var(--priority); background: color-mix(in srgb, var(--priority-bg) 70%, white); border-radius: 9px; font-size: 10px; font-weight: 900; }
.priority-expand-label i { display: grid; width: 21px; height: 21px; place-items: center; background: white; border-radius: 7px; font-size: 15px; font-style: normal; transition: transform .2s ease; }
.priority-customer-card[open] { grid-column: span 2; box-shadow: 0 16px 34px rgba(20,65,53,.12); }
.priority-customer-card[open] .priority-expand-label i { transform: rotate(180deg); }
.priority-branch-list { display: block !important; max-height: 310px; overflow: auto; padding: 0 12px 12px; border-top: 1px solid color-mix(in srgb, var(--priority) 18%, white); }
.priority-branch-list header { position: sticky; top: 0; z-index: 1; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 11px 4px 8px; color: #173a32; background: white; }
.priority-branch-list header span { color: var(--muted); font-size: 10px; }
.priority-branch-list > a { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 6px; padding: 10px; color: #173a32; background: #f7fbf9; border: 1px solid #deede7; border-radius: 10px; transition: .16s ease; }
.priority-branch-list > a:hover { border-color: var(--priority); background: white; transform: translateX(-2px); }
.priority-branch-list > a span, .priority-branch-list > a strong, .priority-branch-list > a small { display: block; min-width: 0; }
.priority-branch-list > a strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; }
.priority-branch-list > a small { margin-top: 3px; overflow: hidden; color: var(--muted); font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }
.priority-branch-list > a b { flex: 0 0 auto; color: var(--priority); font-size: 9px; }
.delivery-edit-table tr.delivery-variance { box-shadow: inset -4px 0 #e29a27; }
.delivery-edit-table tr:not(.delivery-variance) [data-variance-reason] { border-color: #dcebe5; background: #fbfdfc; }

@media (max-width: 980px) {
  .priority-customer-card[open] { grid-column: span 2; }
}
@media (max-width: 640px) {
  .priority-customer-card[open] { grid-column: span 1; }
  .priority-customer-card > summary dl { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

/* Version 4.1 — secure recovery and mobile hardening */
html { overflow-x: hidden; -webkit-text-size-adjust: 100%; text-size-adjust: 100%; }
body { overflow-x: hidden; }
.app-icon { display: block; width: 20px; height: 20px; flex: 0 0 auto; }
.sidebar-nav a i .app-icon { width: 17px; height: 17px; }
.sidebar-toggle .app-icon, .notification-button .app-icon, .sidebar-logout .app-icon { width: 20px; height: 20px; }
.sidebar-user { display: grid; grid-template-columns: 34px minmax(0, 1fr) 34px; }
.sidebar-user form { margin: 0; }
.sidebar-logout { display: grid; width: 34px; height: 34px; place-items: center; padding: 0; color: #d7eee7; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.1); border-radius: 10px; }
.sidebar-logout:hover { color: #fff; background: rgba(255,255,255,.16); }
.login-help-link { justify-self: center; color: var(--green-800); font-size: 13px; font-weight: 800; text-align: center; }
.login-help-link:hover { text-decoration: underline; }
.recovery-card { width: min(520px, 100%); }
.recovery-methods { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; }
.recovery-methods legend { margin-bottom: 9px; color: #345049; font-size: 14px; font-weight: 800; }
.recovery-methods label { display: flex; align-items: center; gap: 12px; min-height: 64px; padding: 12px 14px; background: #f7fbf9; border: 1px solid #d5e6df; border-radius: 12px; cursor: pointer; }
.recovery-methods input { width: 18px; height: 18px; flex: 0 0 auto; }
.recovery-methods span { display: grid; gap: 3px; }
.recovery-methods small { color: var(--muted); font-weight: 500; }
.recovery-code { direction: ltr; text-align: center; font-size: 24px; font-weight: 900; letter-spacing: .35em; }
.security-card { max-width: 620px; }
.users-table { min-width: 1080px; }
.recovery-cell { min-width: 290px; }
.compact-recovery-form { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.compact-recovery-form label { gap: 4px; font-size: 10px; }
.compact-recovery-form input { padding: 8px 9px; font-size: 12px; }
.compact-recovery-form .button { grid-column: 1 / -1; }
.user-admin-actions { display: grid; min-width: 190px; gap: 8px; }
.user-admin-actions details { width: 100%; }
.user-admin-actions summary { padding: 8px 10px; color: var(--green-900); background: #f2f8f5; border: 1px solid var(--line); border-radius: 9px; font-size: 11px; font-weight: 800; cursor: pointer; list-style-position: inside; }
.password-admin-form { display: grid; gap: 8px; margin-top: 8px; padding: 10px; background: #fff8f8; border: 1px solid #f1d2d3; border-radius: 10px; }
.password-admin-form input { padding: 8px 9px; font-size: 12px; }
.users-bottom-grid { grid-template-columns: .8fr 1.2fr; }
body.sidebar-open { overflow: hidden; }

@media (max-width: 720px) {
  .login-shell { place-items: start center; padding: max(22px, env(safe-area-inset-top)) 14px max(24px, env(safe-area-inset-bottom)); }
  .guest-language-switch { top: max(10px, env(safe-area-inset-top)); right: 10px; }
  [dir="ltr"] .guest-language-switch { right: auto; left: 10px; }
  .login-card { gap: 19px; padding: 26px 18px; border-radius: 19px; }
  .login-logo { width: 145px; height: 86px; }
  .login-card h1 { font-size: 25px; line-height: 1.25; }
  input, select, textarea { min-height: 46px; font-size: 16px; }
  textarea { min-height: 96px; }
  .button { min-height: 46px; }
  .button-small { min-height: 40px; }
  .authenticated-body .app-shell { padding-inline: 10px; padding-bottom: calc(82px + env(safe-area-inset-bottom)); }
  .app-topbar { padding-top: env(safe-area-inset-top); height: calc(62px + env(safe-area-inset-top)); }
  .topbar-title { min-width: 0; flex: 1; }
  .topbar-title strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
  .topbar-actions { flex: 0 0 auto; gap: 7px; }
  .sidebar-toggle, .notification-button { width: 42px; height: 42px; flex: 0 0 42px; }
  .app-sidebar { padding-top: calc(16px + env(safe-area-inset-top)); padding-bottom: calc(14px + env(safe-area-inset-bottom)); }
  .sidebar-nav a { min-height: 48px; font-size: 13px; }
  .sidebar-nav a i { width: 30px; height: 30px; }
  .page-heading { gap: 13px; margin-bottom: 17px; }
  .page-heading h1 { font-size: 27px; }
  .heading-actions, .form-actions, .label-actions { width: 100%; flex-direction: column; align-items: stretch; }
  .heading-actions .button, .heading-actions form, .heading-actions form .button, .form-actions .button, .label-actions .button { width: 100%; }
  .card, .priority-customer-section, .priority-orders-panel, .anomaly-panel { margin-bottom: 14px; padding: 14px; border-radius: 14px; }
  .card-heading { align-items: flex-start; flex-direction: column; gap: 10px; }
  .stats-grid { gap: 10px; }
  .stat-card { min-height: 118px; padding: 17px; }
  .stat-card strong { font-size: 28px; }
  .table-wrap { margin-inline: 0; overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior-inline: contain; scroll-snap-type: none; }
  table { min-width: 720px; }
  th, td { padding: 10px 9px; font-size: 12px; }
  .review-table, .manual-lines-table, .delivery-edit-table { min-width: 980px; }
  .product-match-control, .product-search, .review-table .product-select { min-width: 250px !important; }
  .role-checklist { min-width: 220px; }
  .compact-recovery-form { min-width: 270px; }
  .users-bottom-grid { grid-template-columns: 1fr; }
  .recovery-methods label { min-height: 70px; }
  .recovery-code { font-size: 22px; letter-spacing: .25em; }
  .assistant-panel { bottom: calc(72px + env(safe-area-inset-bottom)); }
  .assistant-launcher { bottom: calc(12px + env(safe-area-inset-bottom)); }
  .sticky-actions { position: sticky; z-index: 20; bottom: calc(8px + env(safe-area-inset-bottom)); padding: 10px; background: rgba(255,255,255,.96); border: 1px solid var(--line); border-radius: 12px; box-shadow: 0 12px 32px rgba(10,70,60,.15); }
}

@media (max-width: 390px) {
  .authenticated-body .app-shell { padding-inline: 8px; }
  .app-topbar { padding-inline: 8px; gap: 8px; }
  .topbar-title strong { font-size: 11px; }
  .card { padding: 12px; }
  .login-card { padding-inline: 15px; }
}

/* Version 4.1.1 — visible recovery contacts and mobile-first user management */
.recovery-service-panel { border-inline-start: 4px solid var(--green-700); }
.recovery-service-grid { display: flex; flex-wrap: wrap; gap: 10px; }
.service-status { display: inline-flex; align-items: center; gap: 8px; min-height: 38px; padding: 8px 12px; border-radius: 999px; font-size: 12px; font-weight: 900; }
.service-status > span { display: grid; width: 20px; height: 20px; place-items: center; border-radius: 50%; font-size: 12px; }
.service-status-enabled { color: #0b5f47; background: #e8f7f0; border: 1px solid #bfe4d4; }
.service-status-enabled > span { color: #fff; background: #168365; }
.service-status-disabled { color: #825717; background: #fff7e7; border: 1px solid #f2d89f; }
.service-status-disabled > span { color: #fff; background: #c88a25; }
.service-status-help { margin: 12px 0 0; padding: 10px 12px; color: #634a1d; background: #fffaf0; border: 1px solid #f1dfb9; border-radius: 10px; font-size: 12px; }
.service-status-help code { direction: ltr; unicode-bidi: isolate; }
.service-status-help.service-status-ready { color: #155f4c; background: #eff9f5; border-color: #cce9de; }
.user-accounts-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; margin-bottom: 18px; }
.user-account-card { min-width: 0; padding: 18px; background: #fff; border: 1px solid var(--line); border-radius: 16px; box-shadow: var(--shadow-sm); }
.user-account-header { display: flex; align-items: flex-start; justify-content: space-between; gap: 12px; padding-bottom: 14px; border-bottom: 1px solid var(--line); }
.user-account-title { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; }
.user-account-title h3 { margin: 0; font-size: 18px; }
.user-account-header code { display: inline-block; margin-top: 5px; color: var(--muted); font-size: 12px; direction: ltr; unicode-bidi: isolate; }
.current-account-badge, .account-state { display: inline-flex; align-items: center; min-height: 26px; padding: 4px 9px; border-radius: 999px; font-size: 10px; font-weight: 900; white-space: nowrap; }
.current-account-badge { color: #175e4d; background: #e8f5f0; }
.account-state-active { color: #0d674d; background: #e6f7ef; }
.account-state-disabled { color: #8b3035; background: #fdecee; }
.user-card-section { margin-top: 14px; padding: 14px; background: #f9fcfb; border: 1px solid #e3eee9; border-radius: 12px; }
.user-recovery-section { background: #f5fbf8; border-color: #cfe8de; }
.user-card-section-heading { margin-bottom: 12px; }
.user-card-section-heading h4 { margin: 0; font-size: 14px; }
.user-card-section-heading p { margin: 4px 0 0; color: var(--muted); font-size: 11px; }
.user-recovery-form, .user-access-form { display: grid; gap: 10px; }
.user-recovery-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.user-recovery-form label { min-width: 0; }
.user-recovery-form label span, .user-state-field span, .password-admin-form label span { display: block; margin-bottom: 5px; font-size: 11px; font-weight: 800; }
.user-recovery-form input { width: 100%; }
.user-recovery-form .button { grid-column: 1 / -1; }
.user-access-form .role-checklist { min-width: 0; }
.user-state-field { display: grid; gap: 5px; }
.user-password-reset { margin-top: 14px; }
.user-password-reset summary { padding: 11px 12px; color: var(--green-900); background: #f5f9f7; border: 1px solid var(--line); border-radius: 10px; font-size: 12px; font-weight: 900; cursor: pointer; }
.user-password-reset[open] summary { border-bottom-left-radius: 0; border-bottom-right-radius: 0; }
.user-password-reset .password-admin-form { margin-top: 0; border-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; }

@media (max-width: 1050px) {
  .user-accounts-grid { grid-template-columns: 1fr; }
}

@media (max-width: 720px) {
  .recovery-service-grid { display: grid; grid-template-columns: 1fr; }
  .service-status { width: 100%; border-radius: 11px; }
  .user-account-card { padding: 14px; border-radius: 14px; }
  .user-account-header { align-items: stretch; flex-direction: column; }
  .account-state { align-self: flex-start; }
  .user-recovery-form { grid-template-columns: 1fr; }
  .user-recovery-form .button { grid-column: auto; width: 100%; }
  .user-card-section { padding: 12px; }
  .user-access-form .button, .user-password-reset .button { width: 100%; }
}
.visually-hidden { position: absolute !important; width: 1px !important; height: 1px !important; padding: 0 !important; margin: -1px !important; overflow: hidden !important; clip: rect(0, 0, 0, 0) !important; white-space: nowrap !important; border: 0 !important; }

/* v4.2.0 — weekly pricing, sales, purchases, and finance */
.finance-stats .stat-card small { display: block; margin-top: 6px; color: var(--muted); font-weight: 700; }
.negative-value { color: var(--danger) !important; font-weight: 800; }
.row-actions { display: flex; flex-wrap: wrap; gap: 6px; }
.finance-form { max-width: none; }
.finance-lines-table { min-width: 980px; }
.finance-lines-table input, .finance-lines-table select { min-width: 92px; padding: 9px; }
.finance-lines-table td:first-child { min-width: 290px; }
.finance-lines-table td:first-child input { margin-bottom: 6px; }
.finance-lines-table output { display: inline-block; min-width: 80px; font-weight: 800; direction: ltr; }
.invoice-live-totals { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; margin: 18px 0; }
.invoice-live-totals > div, .invoice-totals-card > div { padding: 16px; background: #f3f9f6; border: 1px solid var(--line); border-radius: 12px; }
.invoice-live-totals span, .invoice-totals-card span, .document-summary span { display: block; margin-bottom: 6px; color: var(--muted); font-size: 12px; font-weight: 700; }
.invoice-live-totals strong, .invoice-totals-card strong { color: var(--green-900); font-size: 22px; direction: ltr; }
.invoice-totals-card { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 12px; margin-bottom: 22px; }
.document-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 14px; }
.document-summary > div { padding: 14px; background: #f6faf8; border: 1px solid var(--line); border-radius: 12px; }
.document-summary strong { display: block; margin-bottom: 4px; }
.document-summary small { color: var(--muted); }
.import-card { border-inline-start: 5px solid var(--green-600); }
.subsection-heading { margin-top: 22px; }

@media (max-width: 760px) {
  .finance-stats { grid-template-columns: 1fr 1fr; }
  .finance-stats .stat-card { padding: 16px; }
  .finance-stats .stat-card strong { font-size: 23px; }
  .invoice-live-totals { grid-template-columns: 1fr; }
  .invoice-totals-card { grid-template-columns: 1fr 1fr; }
  .invoice-totals-card > div:last-child { grid-column: 1 / -1; }
  .document-summary { grid-template-columns: 1fr; }
  .row-actions { min-width: 190px; }
  .finance-form .card-heading { align-items: stretch; flex-direction: column; }
  .finance-form .card-heading .button { width: 100%; }
  .finance-form .table-wrap { overflow: visible; border: 0; background: transparent; }
  .finance-lines-table { display: block; width: 100%; min-width: 0; }
  .finance-lines-table thead { display: none; }
  .finance-lines-table tbody { display: grid; gap: 12px; }
  .finance-lines-table tr { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; padding: 12px; background: #fbfdfc; border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 8px 20px rgba(18, 63, 51, .05); }
  .finance-lines-table td { display: flex; min-width: 0; padding: 4px; border: 0; flex-direction: column; gap: 5px; vertical-align: stretch; }
  .finance-lines-table td::before { color: var(--muted); font-size: 11px; font-weight: 800; }
  .finance-lines-table td:first-child { grid-column: 1 / -1; min-width: 0; }
  .finance-lines-table td:first-child::before { content: "المنتج"; }
  .finance-lines-table input, .finance-lines-table select { width: 100%; min-width: 0; }
  .finance-lines-table output { width: 100%; min-width: 0; padding: 11px; text-align: center; background: #eef8f3; border: 1px solid var(--line); border-radius: 10px; }
  .pricing-lines-table td:nth-child(2)::before { content: "الوحدة"; }
  .pricing-lines-table td:nth-child(3)::before { content: "السعر ر.س"; }
  .pricing-lines-table td:nth-child(4)::before { content: "ملاحظة"; }
  .pricing-lines-table td:nth-child(4) { grid-column: 1 / -1; }
  .pricing-lines-table td:nth-child(5), .invoice-lines-table td:nth-child(8) { align-items: flex-end; justify-content: flex-end; }
  .invoice-lines-table td:nth-child(2)::before { content: "الكمية"; }
  .invoice-lines-table td:nth-child(3)::before { content: "الوحدة"; }
  .invoice-lines-table td:nth-child(4)::before { content: "سعر/تكلفة الوحدة"; }
  .invoice-lines-table td:nth-child(5)::before { content: "الخصم %"; }
  .invoice-lines-table td:nth-child(6)::before { content: "الضريبة %"; }
  .invoice-lines-table td:nth-child(7)::before { content: "الإجمالي"; }
  .invoice-lines-table td:nth-child(7) { grid-column: 1 / -1; }
}