/* ===== css/design-system.css ===== */
/* ═════════════════════════════════════════════════════════
   DELMON OPERATION SYSTEM ✦ EDITORIAL ELITE
   Premium executive-grade design system
   Typography: Reem Kufi (display) · Tajawal (body) · 
               Playfair Display (numerals) · IBM Plex Mono (data)
═════════════════════════════════════════════════════════ */

/* ─── DESIGN TOKENS ─── */
:root {
  /* Surface · warm editorial palette */
  --bg:           #F8F5F0;
  --bg-deep:      #EFEAE2;
  --surface:      #FFFFFF;
  --surface-2:    #FDFCFA;
  --surface-3:    #F4EFE8;
  
  /* Ink · refined typography hierarchy */
  --ink:    #0A0B0D;
  --ink-2:  #3A3D40;
  --ink-3:  #6E7174;
  --ink-4:  #A8ABAE;
  --ink-5:  #D4D6D8;
  
  /* Delmon Brand · official red */
  --brand:        #D4212A;
  --brand-deep:   #8B0A12;
  --brand-darker: #5A0008;
  --brand-soft:   rgba(212,33,42,0.05);
  --brand-medium: rgba(212,33,42,0.12);
  --brand-glow:   rgba(212,33,42,0.18);
  
  /* Editorial Accents */
  --gold:      #B8924D;
  --gold-2:    #8C6E36;
  --gold-soft: rgba(184,146,77,0.10);
  --sage:      #5F7A4D;
  --sage-soft: rgba(95,122,77,0.10);
  --slate:     #475569;
  
  /* Semantic */
  --success: #15803D; --success-soft: rgba(21,128,61,0.08);
  --warn:    #B45309; --warn-soft:    rgba(180,83,9,0.08);
  --danger:  #B91C1C; --danger-soft:  rgba(185,28,28,0.08);
  --info:    #1E40AF; --info-soft:    rgba(30,64,175,0.08);
  --purple:  #6D28D9; --purple-soft:  rgba(109,40,217,0.08);
  
  /* Compatibility aliases for rebuilt modules */
  --coral: var(--danger);
  --coral-dim: var(--danger-soft);
  --purple-dim: var(--purple-soft);
  --green: var(--success);
  --text2: var(--ink-2);
  --text3: var(--ink-3);
  --border: var(--hair);
  --brand-dim: var(--brand-soft);
  
  /* Hairlines */
  --hair:   rgba(10,11,13,0.06);
  --hair-2: rgba(10,11,13,0.09);
  --hair-3: rgba(10,11,13,0.14);
  
  /* Shape */
  --r-xs: 6px; --r-sm: 8px; --r: 12px; --r-lg: 16px; --r-xl: 24px;
  
  /* Elevation · multi-layered shadows */
  --sh-1: 0 1px 2px rgba(10,11,13,.04), 0 1px 1px rgba(10,11,13,.03);
  --sh-2: 0 2px 6px rgba(10,11,13,.05), 0 1px 2px rgba(10,11,13,.04);
  --sh-3: 0 8px 24px rgba(10,11,13,.08), 0 2px 6px rgba(10,11,13,.04);
  --sh-4: 0 24px 56px rgba(10,11,13,.12), 0 8px 16px rgba(10,11,13,.06);
  --sh-brand: 0 8px 24px rgba(212,33,42,.18), 0 2px 6px rgba(212,33,42,.10);
  
  /* Motion */
  --ease:   cubic-bezier(.4,0,.2,1);
  --ease-o: cubic-bezier(.16,1,.3,1);
  --ease-b: cubic-bezier(.34,1.56,.64,1);
  
  /* Fonts */
  --f-display: 'Noto Kufi Arabic', 'IBM Plex Sans Arabic', system-ui, sans-serif;
  --f-sans:    'IBM Plex Sans Arabic', 'Noto Kufi Arabic', system-ui, sans-serif;
  --f-serif:   'Playfair Display', 'Markazi Text', Georgia, serif;
  --f-mono:    'IBM Plex Mono', 'JetBrains Mono', monospace;
}

/* ─── RESET ─── */
*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
html { scroll-behavior: smooth; -webkit-text-size-adjust: 100%; }
body {
  font-family: var(--f-sans);
  background: var(--bg);
  color: var(--ink);
  font-size: 14px;
  line-height: 1.65;
  min-height: 100vh;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  font-feature-settings: 'kern','liga','calt';
  position: relative;
  font-weight: 400;
}

/* Atmospheric layered background */
body::after {
  content: ''; position: fixed; inset: 0;
  pointer-events: none; z-index: 0;
  background-image: 
    radial-gradient(circle at 12% 8%, rgba(212,33,42,.04) 0%, transparent 32%),
    radial-gradient(circle at 88% 92%, rgba(184,146,77,.035) 0%, transparent 32%),
    radial-gradient(circle at 50% 50%, rgba(95,122,77,.018) 0%, transparent 50%);
}

/* Premium top accent gradient */
body::before {
  content: ''; position: fixed; top: 0; left: 0; right: 0;
  height: 2px; z-index: 2000; opacity: .85;
  background: linear-gradient(90deg,
    var(--gold) 0%, var(--brand) 20%, var(--brand-deep) 50%,
    var(--brand) 80%, var(--gold) 100%);
}

/* Selection */
::selection { background: var(--brand-medium); color: var(--brand-deep); }

/* Scrollbar */
::-webkit-scrollbar { width: 6px; height: 6px; }
::-webkit-scrollbar-track { background: transparent; }
::-webkit-scrollbar-thumb { background: var(--hair-2); border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: var(--hair-3); }

/* ─── APP LAYOUT ─── */
.app {
  display: flex; flex-direction: row;
  direction: ltr; min-height: 100vh;
  position: relative; z-index: 1;
}
.sidebar {
  order: 2; direction: rtl;
  width: 248px; flex-shrink: 0;
  background: var(--surface);
  border-right: 1px solid var(--hair);
  display: flex; flex-direction: column;
  position: sticky; top: 0; height: 100vh;
  overflow-y: auto; overflow-x: hidden;
  box-shadow: -1px 0 0 var(--hair);
}
.main {
  order: 1; direction: rtl;
  flex: 1; width: calc(100% - 248px);
  padding: 36px 44px 60px;
  overflow-y: auto;
  background: transparent;
  min-width: 0;
}

/* ─── LOGO IMAGE CLASS ─── */
.delmon-logo {
  background-image: var(--logo-url);
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  display: block;
}

/* ─── SIDEBAR ELEMENTS ─── */
.logo {
  padding: 26px 22px 22px;
  border-bottom: 1px solid var(--hair);
  position: relative;
}
.logo::after {
  content: ''; position: absolute;
  bottom: -1px; right: 22px; width: 30px; height: 1px;
  background: var(--brand);
}
.logo-inner {
  display: flex; align-items: center;
  justify-content: center;
  margin-bottom: 14px;
}
.logo-version {
  display: flex; align-items: center; gap: 7px;
  font-family: var(--f-mono); font-size: 10px;
  color: var(--ink-3); letter-spacing: .08em;
  text-transform: uppercase;
  padding-top: 8px;
  border-top: 1px dashed var(--hair-2);
}
.logo-pulse {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--success);
  box-shadow: 0 0 0 0 rgba(21,128,61,.5);
  animation: pulse 2.5s var(--ease) infinite;
}
@keyframes pulse {
  0%,100% { box-shadow: 0 0 0 0 rgba(21,128,61,.4); }
  50%     { box-shadow: 0 0 0 6px rgba(21,128,61,0); }
}

/* Section labels */
.nav-section {
  padding: 18px 22px 6px;
  font-family: var(--f-display);
  font-size: 10px; font-weight: 600;
  color: var(--ink-4);
  letter-spacing: .15em; text-transform: uppercase;
  position: relative;
}

/* Nav items */
.nav-item {
  display: flex; align-items: center; gap: 11px;
  padding: 9px 22px; font-size: 13px;
  color: var(--ink-2); cursor: pointer;
  border: none; background: none; width: 100%;
  text-align: right; transition: all .15s var(--ease);
  position: relative; border-radius: 0;
  font-family: inherit; font-weight: 500;
}
.nav-item:hover {
  color: var(--ink); background: var(--surface-3);
}
.nav-item.active {
  color: var(--brand);
  background: linear-gradient(90deg, var(--brand-soft) 0%, transparent 100%);
  font-weight: 600;
}
.nav-item.active::before {
  content: ''; position: absolute;
  right: 0; top: 8px; bottom: 8px; width: 2px;
  background: var(--brand); border-radius: 2px 0 0 2px;
}
.nav-icon {
  width: 18px; height: 18px; flex-shrink: 0;
  display: inline-flex; align-items: center; justify-content: center;
  color: currentColor; opacity: .65;
  transition: opacity .15s, transform .2s var(--ease-b);
}
.nav-item.active .nav-icon { opacity: 1; }
.nav-item:hover .nav-icon { opacity: .9; transform: scale(1.08); }
.nav-icon svg { width: 100%; height: 100%; stroke: currentColor; }

/* User card at bottom */
.clock-wrap {
  padding: 18px 22px 22px;
  border-top: 1px solid var(--hair);
  margin-top: auto;
  background: var(--surface-2);
}
.clock-time {
  font-family: var(--f-mono); font-size: 15px;
  color: var(--ink); font-weight: 600;
  letter-spacing: .03em;
  display: flex; align-items: center; gap: 7px;
}
.clock-time::before {
  content: ''; width: 5px; height: 5px;
  border-radius: 50%; background: var(--success);
  animation: pulse 2s infinite;
}
.clock-date { font-size: 11px; color: var(--ink-3); margin-top: 3px; }
.user-pill {
  display: flex; align-items: center; gap: 10px;
  margin-top: 12px; padding: 10px 12px;
  border-radius: var(--r); background: var(--surface);
  border: 1px solid var(--hair);
  font-size: 12px; color: var(--ink-2);
  box-shadow: var(--sh-1);
}
.user-avatar {
  width: 28px; height: 28px; border-radius: 50%;
  background: linear-gradient(135deg, var(--brand) 0%, var(--brand-deep) 100%);
  color: #fff; display: flex; align-items: center; justify-content: center;
  font-size: 12px; font-weight: 700; flex-shrink: 0;
  font-family: var(--f-display);
  box-shadow: 0 2px 4px rgba(212,33,42,.25);
}

/* ─── PAGES ─── */
.page { display: none; }
.page.active {
  display: block;
  animation: pageEnter .35s var(--ease-o) both;
}
@keyframes pageEnter {
  from { opacity: 0; transform: translateY(8px); }
  to   { opacity: 1; transform: translateY(0); }
}

.page-header { margin-bottom: 32px; }
.page-header-row {
  display: flex; align-items: flex-start;
  justify-content: space-between; gap: 16px;
  margin-bottom: 28px;
}
.page-title {
  font-family: var(--f-display);
  font-size: 28px; font-weight: 600;
  color: var(--ink); letter-spacing: -.01em;
  line-height: 1.2; margin-bottom: 4px;
}
.page-sub {
  font-size: 13px; color: var(--ink-3);
  font-weight: 400;
}
.page-sub::before {
  content: '— '; color: var(--ink-4);
}

/* ─── CARDS · Editorial elevation ─── */
.card {
  background: var(--surface);
  border: 1px solid var(--hair);
  border-radius: var(--r-lg);
  padding: 24px 26px;
  margin-bottom: 18px;
  box-shadow: var(--sh-1);
  transition: box-shadow .25s var(--ease), transform .25s var(--ease);
  position: relative;
  overflow: hidden;
}
.card:hover { box-shadow: var(--sh-2); }
.card::before {
  content: ''; position: absolute;
  top: 0; right: 0; width: 60px; height: 1px;
  background: var(--brand); opacity: 0;
  transition: opacity .25s var(--ease);
}
.card:hover::before { opacity: .4; }

.card-title {
  font-family: var(--f-display);
  font-size: 13px; font-weight: 600;
  color: var(--ink); margin-bottom: 18px;
  display: flex; align-items: center; gap: 10px;
  letter-spacing: -.005em;
}
.dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: var(--brand); flex-shrink: 0;
  box-shadow: 0 0 0 3px var(--brand-soft);
}

/* ─── STATS · Bloomberg-grade ─── */
.stats {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 14px; margin-bottom: 26px;
}
.stat-card {
  background: var(--surface);
  border: 1px solid var(--hair);
  border-radius: var(--r-lg);
  padding: 20px 22px;
  box-shadow: var(--sh-1);
  position: relative; overflow: hidden;
  transition: all .3s var(--ease);
}
.stat-card::after {
  content: ''; position: absolute;
  top: 0; right: 0; bottom: 0; width: 2px;
  background: var(--brand); opacity: 0;
  transition: opacity .25s var(--ease);
}
.stat-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-3);
  border-color: var(--hair-2);
}
.stat-card:hover::after { opacity: 1; }
.stat-label {
  font-size: 10.5px; color: var(--ink-3);
  margin-bottom: 8px;
  font-weight: 600; letter-spacing: .08em;
  text-transform: uppercase;
}
.stat-value {
  font-family: var(--f-serif);
  font-size: 30px; font-weight: 700;
  color: var(--ink); line-height: 1;
  letter-spacing: -.02em;
}
.stat-meta {
  font-size: 11px; color: var(--ink-4);
  margin-top: 5px; font-weight: 500;
}
.sv-purple { color: var(--purple); }
.sv-green  { color: var(--success); }
.sv-amber  { color: var(--warn); }
.sv-blue   { color: var(--info); }
.sv-coral  { color: var(--danger); }

/* ─── FORMS · Premium inputs ─── */
.fg  { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.fg3 { display: grid; grid-template-columns: 1fr 1fr 1fr; gap: 16px; }
.form-group { display: flex; flex-direction: column; gap: 6px; }
.form-group.full { grid-column: 1 / -1; }
.form-label {
  font-size: 11px; color: var(--ink-2);
  font-weight: 600; letter-spacing: .02em;
}

input, select, textarea {
  background: var(--surface);
  border: 1.5px solid var(--hair-2);
  border-radius: var(--r-sm);
  padding: 10px 13px;
  font-family: inherit; font-size: 13px;
  color: var(--ink);
  transition: all .15s var(--ease);
  outline: none; width: 100%;
  -webkit-appearance: none;
  font-weight: 500;
}
input:hover, select:hover, textarea:hover { border-color: var(--hair-3); }
input:focus, select:focus, textarea:focus {
  border-color: var(--brand);
  box-shadow: 0 0 0 4px var(--brand-soft);
  background: #fff;
}
input::placeholder { color: var(--ink-4); font-weight: 400; }
input[type="date"] {
  font-family: var(--f-mono); font-size: 12px;
}

.scan-wrap { position: relative; z-index: 5; }
.scan-wrap:focus-within { z-index: 500; }
.scan-wrap input {
  padding-left: 42px;
  font-family: var(--f-mono);
  font-size: 13px; letter-spacing: .04em;
}
.scan-icon {
  position: absolute; left: 14px; top: 50%;
  transform: translateY(-50%);
  color: var(--brand); font-size: 14px;
  pointer-events: none;
  width: 18px; height: 18px;
  display: flex; align-items: center; justify-content: center;
}

/* ─── AUTOCOMPLETE ─── */
.ac-menu {
  display: none; position: absolute;
  top: calc(100% + 6px); right: 0;
  width: min(640px, calc(100vw - 32px));
  min-width: 100%;
  background: var(--surface);
  border: 1px solid var(--hair-2);
  border-radius: var(--r);
  box-shadow: var(--sh-4);
  z-index: 9999;
  max-height: 360px; overflow-y: auto;
  padding: 6px;
  animation: dropIn .18s var(--ease-o);
}
@keyframes dropIn {
  from { opacity: 0; transform: translateY(-6px); }
  to   { opacity: 1; transform: translateY(0); }
}
.ac-menu.open { display: block; }
.ac-item {
  display: grid; grid-template-columns: 96px 1fr;
  gap: 10px; align-items: center;
  padding: 10px 12px; border-radius: var(--r-sm);
  cursor: pointer;
  border-bottom: 1px solid var(--hair);
  transition: background .12s var(--ease);
}
.ac-item:last-child { border-bottom: none; }
.ac-item:hover, .ac-item.sel { background: var(--brand-soft); }
.ac-code {
  font-family: var(--f-mono); font-size: 11px;
  color: var(--brand); direction: ltr;
  font-weight: 600;
}
.ac-name { font-size: 12.5px; font-weight: 600; color: var(--ink); }
.ac-meta { font-size: 10.5px; color: var(--ink-3); margin-top: 2px; }

/* ─── PRODUCT PREVIEW ─── */
.prod-prev {
  display: none; align-items: center; gap: 11px;
  padding: 10px 14px; border-radius: var(--r);
  background: var(--brand-soft);
  border: 1px solid var(--brand-medium);
  margin-top: 8px;
  transition: all .2s var(--ease);
}
.prod-prev.vis {
  display: flex;
  animation: dropIn .2s var(--ease-o);
}
.prod-prev.nf { background: var(--danger-soft); border-color: rgba(185,28,28,.2); }
.pp-code { font-family: var(--f-mono); font-size: 10.5px; color: var(--brand); font-weight: 600; flex-shrink: 0; }
.pp-name { font-size: 13px; font-weight: 600; color: var(--ink); }
.pp-cat  { font-size: 10.5px; color: var(--ink-3); margin-top: 2px; }

/* ─── BUTTONS · Executive-grade ─── */
.btn {
  display: inline-flex; align-items: center; gap: 7px;
  padding: 10px 20px; border-radius: var(--r-sm);
  font-family: inherit; font-size: 13px; font-weight: 600;
  cursor: pointer; border: 1px solid transparent;
  transition: all .15s var(--ease);
  white-space: nowrap;
  letter-spacing: -.005em;
  position: relative;
}
.btn:disabled { opacity: .5; pointer-events: none; }
.btn-primary {
  background: linear-gradient(135deg, var(--brand) 0%, var(--brand-deep) 100%);
  color: #fff;
  box-shadow: var(--sh-2), inset 0 1px 0 rgba(255,255,255,.15);
}
.btn-primary:hover {
  transform: translateY(-1px);
  box-shadow: var(--sh-brand), inset 0 1px 0 rgba(255,255,255,.2);
}
.btn-primary:active { transform: translateY(0); }
.btn-secondary {
  background: var(--surface);
  border: 1.5px solid var(--hair-2);
  color: var(--ink-2);
  box-shadow: var(--sh-1);
}
.btn-secondary:hover {
  color: var(--ink); border-color: var(--brand);
  background: var(--surface);
  box-shadow: var(--sh-2);
}
.btn-danger {
  background: var(--surface);
  border: 1.5px solid rgba(185,28,28,.25);
  color: var(--danger);
}
.btn-danger:hover {
  background: var(--danger-soft);
  border-color: var(--danger);
}
.btn-ghost { background: transparent; color: var(--ink-3); border: none; }
.btn-ghost:hover { background: var(--surface-3); color: var(--ink); }
.btn-sm { padding: 6px 13px; font-size: 11.5px; font-weight: 600; }
.btn-row { display: flex; gap: 10px; margin-top: 20px; flex-wrap: wrap; }

/* ─── TABLES · Editorial data ─── */
.table-wrap {
  overflow-x: auto;
  border-radius: var(--r);
  border: 1px solid var(--hair);
  background: var(--surface);
}
table { width: 100%; border-collapse: collapse; }
th {
  font-family: var(--f-display);
  font-size: 10.5px; font-weight: 600;
  color: var(--ink-3);
  padding: 12px 14px; text-align: right;
  border-bottom: 1px solid var(--hair);
  white-space: nowrap;
  background: var(--surface-2);
  position: sticky; top: 0;
  letter-spacing: .04em; text-transform: uppercase;
}
td {
  padding: 12px 14px; font-size: 13px;
  border-bottom: 1px solid var(--hair);
  color: var(--ink-2); vertical-align: middle;
  transition: background .12s var(--ease);
}
tr:last-child td { border-bottom: none; }
tr:hover td { background: var(--brand-soft); }
.tc { font-family: var(--f-mono); font-size: 11px; color: var(--ink-3); font-weight: 500; }
.tn { color: var(--ink); font-weight: 600; }
.tq { font-family: var(--f-mono); font-weight: 700; font-feature-settings: 'tnum'; }
.t-br { color: var(--brand); }
.t-gr { color: var(--success); }
.t-am { color: var(--warn); }
.t-bl { color: var(--info); }
.t-pu { color: var(--purple); }
.t-co { color: var(--danger); }
tr.row-warn td { background: var(--warn-soft); }
tr.row-err  td { background: var(--danger-soft); }
tr.row-ok   td { background: var(--success-soft); }

/* ─── BADGES · Refined chips ─── */
.badge {
  display: inline-flex; align-items: center;
  font-size: 10px; font-weight: 700;
  padding: 3px 9px; border-radius: 20px;
  white-space: nowrap;
  letter-spacing: .02em;
  border: 1px solid transparent;
}
.b-br { background: var(--brand-soft);  color: var(--brand);   border-color: var(--brand-medium); }
.b-gr { background: var(--success-soft); color: var(--success); border-color: rgba(21,128,61,.2); }
.b-am { background: var(--warn-soft);    color: var(--warn);    border-color: rgba(180,83,9,.2); }
.b-bl { background: var(--info-soft);    color: var(--info);    border-color: rgba(30,64,175,.2); }
.b-pu { background: var(--purple-soft);  color: var(--purple);  border-color: rgba(109,40,217,.2); }
.b-co { background: var(--danger-soft);  color: var(--danger);  border-color: rgba(185,28,28,.2); }
.b-gy { background: rgba(110,113,116,.08); color: var(--ink-3); border-color: var(--hair-2); }

/* ─── SESSION LOG ─── */
.log-wrap { max-height: 320px; overflow-y: auto; padding-right: 4px; }
.log-item {
  display: flex; align-items: center; gap: 12px;
  padding: 11px 0;
  border-bottom: 1px solid var(--hair);
  font-size: 12.5px;
  animation: slideIn .25s var(--ease-o);
}
@keyframes slideIn {
  from { opacity: 0; transform: translateX(8px); }
  to   { opacity: 1; transform: translateX(0); }
}
.log-item:last-child { border-bottom: none; }
.log-code { font-family: var(--f-mono); color: var(--ink-3); font-size: 10.5px; width: 112px; flex-shrink: 0; font-weight: 600; }
.log-name { flex: 1; color: var(--ink); font-weight: 500; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.log-qty  { font-family: var(--f-mono); color: var(--brand); font-weight: 700; width: 60px; text-align: center; font-size: 13px; }
.log-time { font-family: var(--f-mono); color: var(--ink-4); font-size: 10px; width: 68px; }
.log-del {
  background: none; border: none; color: var(--ink-4);
  cursor: pointer; padding: 4px 8px; border-radius: var(--r-xs);
  font-size: 13px; transition: all .15s var(--ease);
}
.log-del:hover { color: var(--danger); background: var(--danger-soft); }
.log-edit {
  background: none; border: none; color: var(--ink-4);
  cursor: pointer; padding: 4px 8px; border-radius: var(--r-xs);
  font-size: 12px; transition: all .15s var(--ease);
}
.log-edit:hover { color: var(--info); background: var(--info-soft); }

/* ─── TOAST · Refined notifications ─── */
.toast {
  position: fixed; bottom: 32px; left: 50%;
  transform: translateX(-50%) translateY(100px);
  background: var(--ink);
  border-radius: var(--r);
  padding: 12px 24px;
  font-size: 13px; color: #fff;
  font-weight: 500;
  transition: transform .35s var(--ease-b), opacity .25s;
  z-index: 9999; pointer-events: none;
  white-space: nowrap;
  box-shadow: var(--sh-4);
  display: flex; align-items: center; gap: 10px;
  border: 1px solid rgba(255,255,255,.08);
}
.toast.show { transform: translateX(-50%) translateY(0); }
.toast.success {
  background: #fff;
  color: var(--success);
  border: 1px solid rgba(21,128,61,.25);
  box-shadow: var(--sh-3), 0 0 0 1px rgba(21,128,61,.1);
}
.toast.error {
  background: #fff;
  color: var(--danger);
  border: 1px solid rgba(185,28,28,.25);
  box-shadow: var(--sh-3), 0 0 0 1px rgba(185,28,28,.1);
}
.toast-icon { font-size: 16px; line-height: 1; }

/* ─── SALESMAN GRID ─── */
.sm-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 8px; }
.sm-btn {
  padding: 10px 6px; text-align: center;
  border: 1.5px solid var(--hair-2);
  border-radius: var(--r-sm);
  cursor: pointer;
  background: var(--surface);
  font-family: var(--f-mono); font-size: 11.5px; font-weight: 700;
  color: var(--ink-2);
  transition: all .15s var(--ease);
  letter-spacing: .02em;
}
.sm-btn:hover {
  border-color: var(--brand);
  color: var(--brand);
  background: var(--brand-soft);
  transform: translateY(-1px);
  box-shadow: var(--sh-1);
}
.sm-btn.sel {
  border-color: var(--brand);
  background: linear-gradient(135deg, var(--brand-soft), var(--brand-medium));
  color: var(--brand);
  box-shadow: var(--sh-2);
}

/* ─── STEP INDICATOR ─── */
.steps {
  display: flex; gap: 10px; align-items: center;
  margin-bottom: 26px;
}
.step-dot {
  width: 32px; height: 32px; border-radius: 50%;
  border: 1.5px solid var(--hair-2);
  background: var(--surface);
  display: flex; align-items: center; justify-content: center;
  font-size: 12px; color: var(--ink-3);
  font-family: var(--f-mono); font-weight: 700;
  transition: all .25s var(--ease-b); flex-shrink: 0;
  box-shadow: var(--sh-1);
}
.step-dot.done {
  background: var(--brand-soft);
  border-color: var(--brand); color: var(--brand);
}
.step-dot.cur {
  background: var(--brand);
  border-color: var(--brand); color: #fff;
  transform: scale(1.1);
  box-shadow: var(--sh-brand);
}
.step-line { flex: 1; height: 2px; background: var(--hair); border-radius: 1px; }
.step-line.done { background: var(--brand); }
.return-step { display: none; }
.return-step.active { display: block; animation: pageEnter .3s var(--ease-o); }

/* ─── TABS ─── */
.tabs { display: flex; gap: 6px; margin-bottom: 20px; flex-wrap: wrap; }
.tab {
  padding: 8px 16px; border-radius: 100px;
  font-size: 12px; font-weight: 600;
  cursor: pointer;
  border: 1.5px solid var(--hair-2);
  background: var(--surface);
  color: var(--ink-2);
  transition: all .15s var(--ease);
  letter-spacing: -.005em;
}
.tab:hover { border-color: var(--ink-3); color: var(--ink); }
.tab.t-br { border-color: var(--brand);  background: var(--brand-soft);  color: var(--brand); }
.tab.t-pu { border-color: var(--purple); background: var(--purple-soft); color: var(--purple); }
.tab.t-gr { border-color: var(--success); background: var(--success-soft); color: var(--success); }
.tab.t-am { border-color: var(--warn);   background: var(--warn-soft);   color: var(--warn); }
.tab.t-bl { border-color: var(--info);   background: var(--info-soft);   color: var(--info); }
.tab.t-co { border-color: var(--danger); background: var(--danger-soft); color: var(--danger); }

/* ─── KPI CARDS ─── */
.kpi-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 14px; }
.kpi-card {
  background: var(--surface);
  border: 1px solid var(--hair);
  border-radius: var(--r-lg);
  padding: 22px 20px; text-align: center;
  position: relative; overflow: hidden;
  box-shadow: var(--sh-1);
  transition: all .3s var(--ease);
}
.kpi-card:hover {
  transform: translateY(-2px);
  box-shadow: var(--sh-3);
}
.kpi-card::before {
  content: ''; position: absolute;
  top: 0; left: 0; right: 0; height: 3px;
  background: linear-gradient(90deg, var(--brand), var(--brand-deep));
  opacity: .8;
}
.kpi-value {
  font-family: var(--f-serif);
  font-size: 36px; font-weight: 700;
  line-height: 1; color: var(--ink);
  letter-spacing: -.025em;
}
.kpi-label {
  font-size: 11px; color: var(--ink-3);
  margin-top: 8px; font-weight: 500;
  letter-spacing: .02em;
}

/* ─── INVENTORY ─── */
.inv-check { width: 22px; height: 22px; accent-color: var(--success); cursor: pointer; flex-shrink: 0; }
tr.inv-checked td { background: var(--success-soft); }

/* ─── SECTION HEADER ─── */
.sec-hdr {
  display: flex; align-items: center;
  justify-content: space-between;
  margin-bottom: 18px; flex-wrap: wrap; gap: 10px;
}
.sec-title { font-size: 13px; font-weight: 600; color: var(--ink-2); }
.sep { border: none; border-top: 1px solid var(--hair); margin: 18px 0; }
.empty {
  text-align: center; padding: 48px 20px;
  color: var(--ink-4); font-size: 13px;
  font-style: italic;
}
.empty-icon { font-size: 28px; margin-bottom: 10px; opacity: .35; display: block; }

/* ─── SUMMARY PANEL ─── */
.summary-panel {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px,1fr));
  gap: 10px; margin-bottom: 18px;
}
.sum-item {
  background: var(--surface);
  border: 1px solid var(--hair);
  border-radius: var(--r);
  padding: 12px 14px; text-align: center;
  box-shadow: var(--sh-1);
}
.sum-val {
  font-family: var(--f-serif); font-size: 22px;
  font-weight: 700; color: var(--brand);
  letter-spacing: -.02em;
}
.sum-lbl { font-size: 10px; color: var(--ink-3); margin-top: 3px; font-weight: 500; }

/* ─── LOGIN · Hero statement ─── */
body.locked .app { display: none; }
.login-screen {
  min-height: 100vh; padding: 0;
  display: grid;
  grid-template-columns: 1.1fr 1fr;
  background: var(--bg);
  position: relative;
  overflow: hidden;
}

/* Hero left panel — brand storytelling */
.login-hero {
  background: linear-gradient(135deg, #0F0F11 0%, #1A0A0C 60%, #2D0A0E 100%);
  position: relative;
  display: flex; flex-direction: column;
  justify-content: space-between;
  padding: 56px 64px;
  overflow: hidden;
  color: #fff;
  direction: rtl;
}
.login-hero::before {
  content: ''; position: absolute; inset: 0;
  background:
    radial-gradient(circle at 30% 20%, rgba(212,33,42,.25) 0%, transparent 45%),
    radial-gradient(circle at 70% 80%, rgba(184,146,77,.12) 0%, transparent 40%),
    radial-gradient(circle at 90% 30%, rgba(212,33,42,.15) 0%, transparent 35%);
  pointer-events: none;
}
.login-hero::after {
  content: ''; position: absolute; inset: 0;
  background-image:
    repeating-linear-gradient(0deg, transparent, transparent 47px, rgba(255,255,255,.015) 47px, rgba(255,255,255,.015) 48px),
    repeating-linear-gradient(90deg, transparent, transparent 47px, rgba(255,255,255,.015) 47px, rgba(255,255,255,.015) 48px);
  pointer-events: none;
}
.hero-top {
  position: relative; z-index: 2;
  display: flex; align-items: center; gap: 14px;
}
.hero-top .delmon-logo {
  width: 130px; height: 95px;
  filter: brightness(1.05) drop-shadow(0 8px 24px rgba(212,33,42,.4));
  background-color: #fff;
  padding: 14px 16px;
  border-radius: var(--r-lg);
  box-shadow: 0 12px 36px rgba(0,0,0,.3);
}
.hero-badge {
  display: inline-flex; align-items: center; gap: 6px;
  padding: 5px 11px; border-radius: 100px;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.12);
  font-family: var(--f-mono); font-size: 10px;
  letter-spacing: .12em; text-transform: uppercase;
  color: rgba(255,255,255,.85);
  backdrop-filter: blur(10px);
}
.hero-badge-dot {
  width: 5px; height: 5px; border-radius: 50%;
  background: var(--success);
  animation: pulse 2s infinite;
}

.hero-content { position: relative; z-index: 2; }
.hero-tag {
  font-family: var(--f-mono);
  font-size: 11px;
  color: rgba(255,255,255,.5);
  letter-spacing: .25em;
  text-transform: uppercase;
  margin-bottom: 18px;
  display: flex; align-items: center; gap: 12px;
}
.hero-tag::before {
  content: ''; width: 24px; height: 1px;
  background: var(--brand);
}
.hero-title {
  font-family: var(--f-display);
  font-size: 52px; font-weight: 700;
  line-height: 1.1; color: #fff;
  letter-spacing: -.025em;
  margin-bottom: 20px;
}
.hero-title .accent {
  background: linear-gradient(135deg, #FF8B95 0%, #D4212A 100%);
  -webkit-background-clip: text;
  background-clip: text;
  color: transparent;
}
.hero-desc {
  font-size: 16px; line-height: 1.6;
  color: rgba(255,255,255,.65);
  max-width: 460px;
  margin-bottom: 36px;
  font-weight: 400;
}
.hero-stats {
  display: grid; grid-template-columns: repeat(3,1fr); gap: 24px;
  padding-top: 28px;
  border-top: 1px solid rgba(255,255,255,.1);
}
.hero-stat-val {
  font-family: var(--f-serif);
  font-size: 28px; font-weight: 700;
  color: #fff; letter-spacing: -.02em;
  line-height: 1;
}
.hero-stat-lbl {
  font-size: 11px; color: rgba(255,255,255,.5);
  margin-top: 6px; font-weight: 500;
  letter-spacing: .04em;
}

.hero-footer {
  position: relative; z-index: 2;
  display: flex; align-items: center; justify-content: space-between;
  font-family: var(--f-mono); font-size: 10.5px;
  color: rgba(255,255,255,.4);
  letter-spacing: .08em;
}
.hero-footer-meta { display: flex; gap: 14px; }

/* Login form right panel */
.login-form-panel {
  display: flex; align-items: center; justify-content: center;
  padding: 60px 56px;
  background: var(--bg);
  position: relative;
}
.login-form-panel::before {
  content: ''; position: absolute; inset: 0;
  background:
    radial-gradient(circle at 70% 30%, rgba(212,33,42,.04) 0%, transparent 40%);
  pointer-events: none;
}
.login-card {
  width: 100%; max-width: 420px;
  position: relative; z-index: 2;
}
.login-card-header {
  margin-bottom: 32px;
}
.login-title {
  font-family: var(--f-display);
  font-size: 32px; font-weight: 700;
  color: var(--ink); letter-spacing: -.02em;
  margin-bottom: 8px;
}
.login-sub {
  font-size: 14px; color: var(--ink-3);
  line-height: 1.5;
}
.login-err {
  display: none; margin-top: 14px; padding: 12px 14px;
  border-radius: var(--r-sm);
  background: var(--danger-soft);
  color: var(--danger);
  border: 1px solid rgba(185,28,28,.2);
  font-size: 12.5px; font-weight: 500;
}
.login-err.show { display: flex; align-items: center; gap: 8px; animation: shake .4s; }
@keyframes shake {
  0%,100% { transform: translateX(0); }
  20%,60% { transform: translateX(-4px); }
  40%,80% { transform: translateX(4px); }
}
.login-hint {
  margin-top: 22px;
  padding: 14px 16px;
  background: var(--surface-3);
  border-radius: var(--r-sm);
  border: 1px solid var(--hair);
  font-size: 11.5px; color: var(--ink-3);
  line-height: 1.9;
}
.login-hint b { color: var(--ink); font-weight: 700; font-family: var(--f-mono); font-size: 11px; }

/* ─── PERMISSIONS ─── */
.perm-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px,1fr)); gap: 8px; margin-top: 8px; }
.perm-pill {
  display: flex; align-items: center; gap: 9px;
  padding: 9px 12px;
  border: 1.5px solid var(--hair-2);
  border-radius: var(--r-sm);
  background: var(--surface);
  font-size: 12px; color: var(--ink-2);
  cursor: pointer;
  transition: all .15s var(--ease);
  font-weight: 500;
}
.perm-pill input { width: auto; accent-color: var(--brand); }
.perm-pill:has(input:checked) {
  border-color: var(--brand);
  background: var(--brand-soft);
  color: var(--brand);
  font-weight: 600;
}

/* ─── DIFF COLORS ─── */
.d-ok   { color: var(--success); font-family: var(--f-mono); font-weight: 700; }
.d-warn { color: var(--warn);    font-family: var(--f-mono); font-weight: 700; }
.d-err  { color: var(--danger);  font-family: var(--f-mono); font-weight: 700; }

/* ─── FARM TABS ─── */
.farm-tabs { display: flex; gap: 8px; flex-wrap: wrap; margin-bottom: 18px; }
.farm-tab {
  padding: 9px 18px; border-radius: 100px;
  font-size: 12.5px; font-weight: 600;
  border: 1.5px solid var(--hair-2);
  background: var(--surface);
  color: var(--ink-2);
  cursor: pointer;
  font-family: inherit;
  transition: all .15s var(--ease);
}
.farm-tab:hover { border-color: var(--ink-3); }
.farm-tab.active {
  border-color: var(--brand);
  background: var(--brand);
  color: #fff;
  box-shadow: var(--sh-brand);
}

/* ─── SALES VIEWS ─── */
.sales-view { display: none; }
.sales-view.active { display: block; animation: pageEnter .3s var(--ease-o); }

/* ─── RESPONSIVE ─── */
@media (max-width: 1100px) and (min-width: 769px) {
  .sidebar { width: 220px; }
  .main { width: calc(100% - 220px); padding: 28px 28px 50px; }
  .stats { grid-template-columns: repeat(2,1fr); }
  .fg3 { grid-template-columns: repeat(2,1fr); }
}
@media (max-width: 900px) {
  .login-screen { grid-template-columns: 1fr; }
  .login-hero { padding: 40px 32px; min-height: 320px; }
  .hero-title { font-size: 36px; }
  .hero-stats { display: none; }
}
/* ─── Mobile sidebar toggle (visible only on mobile) ─── */
.mobile-toggle {
  display: none;
  position: fixed;
  top: 14px; right: 14px;
  width: 44px; height: 44px;
  border-radius: 12px;
  background: var(--surface);
  border: 1px solid var(--hair-2);
  color: var(--ink);
  align-items: center; justify-content: center;
  cursor: pointer;
  z-index: 1100;
  box-shadow: var(--sh-2);
  font-family: inherit;
  padding: 0;
  transition: all .2s var(--ease);
}
.mobile-toggle:hover { background: var(--surface-2); }
.mobile-toggle:active { transform: scale(.94); }
.mobile-toggle svg { width: 22px; height: 22px; stroke: currentColor; }
.mobile-overlay {
  display: none;
  position: fixed; inset: 0;
  background: rgba(10,11,13,.42);
  z-index: 1050;
  opacity: 0;
  transition: opacity .25s var(--ease);
  backdrop-filter: blur(2px);
}
.mobile-overlay.show { display: block; opacity: 1; }
.sidebar-close {
  display: none;
  position: absolute;
  top: 16px; left: 16px;
  width: 38px; height: 38px;
  border-radius: 10px;
  background: var(--surface-3);
  border: 1px solid var(--hair);
  color: var(--ink-2);
  align-items: center; justify-content: center;
  cursor: pointer; padding: 0;
  z-index: 10;
  transition: all .15s var(--ease);
}
.sidebar-close:hover { background: var(--brand-soft); color: var(--brand); }
.sidebar-close svg { width: 20px; height: 20px; stroke: currentColor; }

@media (max-width: 900px) {
  .mobile-toggle { display: inline-flex; }
  .sidebar-close { display: inline-flex; }
  
  html, body { width: 100%; overflow-x: hidden; }
  body::before { height: 1px; }
  .app { display: block; direction: rtl; }
  .main {
    width: 100%; padding: 64px 14px 24px;
    overflow-x: hidden;
  }
  
  /* Sidebar slides in from RIGHT */
  .sidebar {
    order: initial;
    width: min(300px, 86vw);
    height: 100vh;
    position: fixed;
    top: 0; right: 0; bottom: 0; left: auto;
    z-index: 1100;
    display: flex; flex-direction: column;
    padding: 56px 0 20px;
    overflow-y: auto;
    background: var(--surface);
    border-right: none;
    border-left: 1px solid var(--hair-2);
    box-shadow: -16px 0 48px rgba(10,11,13,.18);
    transform: translateX(100%);
    transition: transform .32s var(--ease-o);
  }
  .sidebar.open { transform: translateX(0); }
  
  /* All sidebar elements visible normally on mobile */
  .logo { padding: 0 22px 18px; }
  .nav-section { padding: 14px 22px 4px; }
  .clock-wrap { display: block !important; padding: 16px 22px; }
  
  .stats { grid-template-columns: repeat(2,1fr) !important; gap: 10px; }
  .stat-value { font-size: 24px; }
  .kpi-grid { grid-template-columns: repeat(2,1fr) !important; }
  .kpi-value { font-size: 28px; }
  .summary-panel { grid-template-columns: repeat(2,1fr) !important; }
  .fg, .fg3 { grid-template-columns: 1fr !important; }
  .form-group.full { grid-column: 1; }
  .sm-grid { grid-template-columns: repeat(3,1fr) !important; }
  .btn-row .btn-primary { flex: 1 1 140px; }
  input, select, textarea { min-height: 44px; font-size: 16px !important; }
  .page-title { font-size: 22px; }
  .toast { bottom: 24px; width: calc(100% - 24px); left: 12px; right: 12px; transform: translateY(120px); }
  .toast.show { transform: translateY(0); }
}


/* ─── MOBILE SIDEBAR FIX ─────────────────────────────
   The app wrapper used z-index and created a stacking context.
   On mobile this made the overlay sit above the sidebar, so the
   menu appeared blurred and could not be clicked. These rules keep
   the overlay behind the drawer and make the drawer fully selectable.
────────────────────────────────────────────────────── */
@media (max-width: 900px) {
  .app { position: relative; z-index: auto !important; }
  .mobile-overlay {
    z-index: 1000 !important;
    background: rgba(10,11,13,.48) !important;
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }
  .mobile-toggle { z-index: 1300 !important; }
  .sidebar {
    z-index: 1250 !important;
    visibility: hidden;
    opacity: 0;
    transform: translate3d(100%,0,0) !important;
    will-change: transform;
    pointer-events: none;
  }
  .sidebar.open {
    visibility: visible;
    opacity: 1;
    transform: translate3d(0,0,0) !important;
    pointer-events: auto;
  }
  .sidebar-close { z-index: 1260 !important; }
  body.sidebar-open .mobile-toggle { opacity: 0; pointer-events: none; }
  body.sidebar-open .main { filter: none !important; -webkit-filter: none !important; }
}

@media (max-width: 420px) {
  .main { padding: 60px 10px 24px; }
  .sm-grid { grid-template-columns: repeat(2,1fr) !important; }
}
@media (min-width: 769px) {
  input, select, textarea, button { font-size: 13px; }
}


/* ═══════════════════════════════════════════════════════════════
   FROZEN WAREHOUSE HUB — مخازن المجمد
═══════════════════════════════════════════════════════════════ */
.fwh-tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:18px}
.fwh-tab{border:1.5px solid var(--hair-2);background:var(--surface);color:var(--ink-2);border-radius:999px;padding:9px 15px;font-family:inherit;font-weight:700;font-size:12px;cursor:pointer;transition:all .16s var(--ease)}
.fwh-tab:hover{border-color:var(--purple);color:var(--purple);background:var(--purple-soft)}
.fwh-tab.active{background:linear-gradient(135deg,var(--purple),#4c1d95);color:#fff;border-color:var(--purple);box-shadow:0 8px 22px rgba(109,40,217,.18)}
.fwh-panel{display:none;animation:pageEnter .24s var(--ease-o)}
.fwh-panel.active{display:block}
.fwh-actions{display:flex;gap:8px;flex-wrap:wrap;align-items:center;margin-top:12px}
.fwh-link{display:inline-flex;align-items:center;gap:7px;text-decoration:none}
.fwh-grid{display:grid;grid-template-columns:1fr 1fr;gap:16px}
.fwh-textarea{min-height:170px;font-family:var(--f-mono);font-size:12px!important;direction:ltr;text-align:left;white-space:pre}
.fwh-note{font-size:11px;color:var(--ink-3);line-height:1.8;margin-top:6px}
.fwh-pill-row{display:flex;gap:8px;flex-wrap:wrap;margin:10px 0 0}
.fwh-pill{display:inline-flex;align-items:center;gap:6px;border:1px solid var(--hair-2);background:var(--surface-2);border-radius:999px;padding:5px 10px;font-size:11px;color:var(--ink-3);font-weight:700}
.fwh-kpi{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:14px 0}
.fwh-kpi .sum-item{background:linear-gradient(180deg,#fff,var(--surface-2))}
.fwh-mini-code{font-family:var(--f-mono);direction:ltr;text-align:left}
.fwh-status-ok{color:var(--success);font-weight:800}
.fwh-status-warn{color:var(--warn);font-weight:800}
.fwh-status-err{color:var(--danger);font-weight:800}
.fwh-stock-table th{background:#ef1b24!important;color:#fff!important;font-family:var(--f-display);font-size:12px;text-transform:none}
.fwh-stock-table td{padding:8px 10px}
.fwh-cat-row td{background:#ef1b24!important;color:#fff!important;font-weight:900;text-align:center;font-family:var(--f-display);font-size:13px;border-color:#b30f17!important}
.fwh-total-row td{background:#f9cfd3!important;color:#111!important;font-weight:900}
.fwh-grand-row td{background:#fff!important;color:#ef1b24!important;font-weight:900;border-top:2px solid #ef1b24!important}
.fwh-stock-code{direction:ltr;text-align:left;font-family:var(--f-mono);font-weight:700;color:#111}
.fwh-code-box{direction:ltr;text-align:left;background:#0d1117;color:#d6e2ff;border-radius:var(--r);padding:14px;max-height:320px;overflow:auto;font-size:11px;line-height:1.65;font-family:var(--f-mono);border:1px solid rgba(255,255,255,.08)}
@media (max-width:900px){
  .fwh-grid{grid-template-columns:1fr}
  .fwh-kpi{grid-template-columns:repeat(2,1fr)}
  .fwh-tab{flex:1 1 140px}
}


/* ═══════════════════════════════════════════════════════════════
   SALES DISTRIBUTION TABLE — DL1 / RTN1
═══════════════════════════════════════════════════════════════ */
.sales-dist-toolbar{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap}
.sales-dist-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.sales-dist-note{font-size:11.5px;color:var(--ink-3);line-height:1.8;margin-top:8px}
.sales-dist-table{min-width:1580px;border-collapse:collapse;background:#fff}
.sales-dist-table th,.sales-dist-table td{border:1px solid #202020!important;padding:4px 6px!important;text-align:center;vertical-align:middle;font-size:11px;white-space:nowrap}
.sales-dist-table th{position:static;background:#f3f3f3!important;color:#111!important;font-family:var(--f-sans);font-weight:800;text-transform:none;letter-spacing:0}
.sales-dist-table .sd-title-row th{background:#ef1b24!important;color:#fff!important;font-weight:900;font-size:13px}
.sales-dist-table .sd-cat-row td{background:#ef1b24!important;color:#fff!important;font-weight:900;text-align:right;font-size:12px}
.sales-dist-table .sd-total-row td{background:#bfbfbf!important;color:#d4212a!important;font-weight:900}
.sales-dist-table .sd-summary-row td{background:#fff!important;font-weight:900}
.sales-dist-table .sd-product{background:#fff!important;text-align:right!important;min-width:210px;font-weight:800;color:#111}
.sales-dist-table .sd-qty{background:#fff200!important;min-width:70px}
.sales-dist-table .sd-fresh{background:#c6e0b4!important;min-width:70px}
.sales-dist-table .sd-online{background:#d9d9d9!important;min-width:70px}
.sales-dist-table .sd-internal{background:#ffd966!important;min-width:70px}
.sales-dist-table .sd-balance,.sales-dist-table .sd-distributed{background:#fff200!important;min-width:78px;font-weight:900}
.sales-dist-table .sd-code{direction:ltr;font-family:var(--f-mono);font-size:9.5px;color:#6b7280;margin-top:2px;font-weight:600}
.sales-dist-input{width:100%;min-width:52px;height:24px!important;min-height:24px!important;border:0!important;background:transparent!important;text-align:center!important;font-family:var(--f-mono)!important;font-size:11px!important;padding:0!important;box-shadow:none!important;color:#111!important}
.sales-dist-input:focus{outline:2px solid var(--brand)!important;background:#fff!important;border-radius:3px!important}
.sales-dist-num{font-family:var(--f-mono);font-weight:900;color:#111}
.sales-dist-input.sd-dynamic-source{background:rgba(109,40,217,.08)!important;color:var(--purple)!important;font-weight:900!important;cursor:not-allowed!important}
.sales-dist-input.sd-dynamic-source:focus{outline:2px solid var(--purple)!important;background:rgba(109,40,217,.10)!important}
@media(max-width:900px){.sales-dist-table{min-width:1450px}.sales-dist-toolbar{align-items:flex-start}.sales-dist-meta{width:100%}}

/* ─── PRINT ─── */


/* ═══════════════════════════════════════════════════════════════
   DASHBOARD ✦ "AURORA" — Cinematic Operations Intelligence
   Dark mission-control aesthetic · Living motion · Executive grade
═══════════════════════════════════════════════════════════════ */

/* Full-bleed dashboard - takes over the main area */
#page-dashboard {
  padding: 0; position: relative;
  margin: -36px -44px -60px;
  min-height: calc(100vh - 0px);
  background: #08070A;
  background-image:
    radial-gradient(ellipse at top right, rgba(45,15,20,0.9) 0%, transparent 60%),
    radial-gradient(ellipse at bottom left, rgba(20,15,10,0.8) 0%, transparent 50%),
    linear-gradient(180deg, #0A0908 0%, #0F0D0B 100%);
  color: #F5F2EB;
  isolation: isolate;
  overflow: hidden;
  padding: 32px 40px 60px;
}

/* Floating gradient orbs — ambient motion */
.aurora-orbs { position: absolute; inset: 0; pointer-events: none; z-index: 0; overflow: hidden; }
.aurora-orb {
  position: absolute; border-radius: 50%;
  filter: blur(90px); will-change: transform;
}
.aurora-orb-1 {
  width: 720px; height: 720px;
  background: radial-gradient(circle, rgba(255,62,71,0.40) 0%, rgba(212,33,42,0) 65%);
  top: -260px; right: -200px;
  animation: drift1 28s ease-in-out infinite;
}
.aurora-orb-2 {
  width: 580px; height: 580px;
  background: radial-gradient(circle, rgba(212,168,92,0.30) 0%, rgba(212,168,92,0) 70%);
  bottom: -180px; left: -160px;
  animation: drift2 34s ease-in-out infinite;
}
.aurora-orb-3 {
  width: 480px; height: 480px;
  background: radial-gradient(circle, rgba(143,176,105,0.18) 0%, rgba(143,176,105,0) 70%);
  top: 35%; left: 35%;
  animation: drift3 40s ease-in-out infinite;
}
@keyframes drift1 {
  0%,100% { transform: translate(0,0) scale(1); }
  50%     { transform: translate(-90px, 70px) scale(1.08); }
}
@keyframes drift2 {
  0%,100% { transform: translate(0,0) scale(1); }
  50%     { transform: translate(110px, -50px) scale(1.05); }
}
@keyframes drift3 {
  0%,100% { transform: translate(0,0) scale(0.95); opacity: .8; }
  50%     { transform: translate(-60px, 90px) scale(1.15); opacity: 1; }
}

/* Grid noise overlay — subtle premium texture */
#page-dashboard::after {
  content: ''; position: absolute; inset: 0; z-index: 0; pointer-events: none;
  background-image:
    linear-gradient(rgba(255,255,255,0.012) 1px, transparent 1px),
    linear-gradient(90deg, rgba(255,255,255,0.012) 1px, transparent 1px);
  background-size: 56px 56px;
  mask-image: radial-gradient(ellipse at center, black 30%, transparent 70%);
}

/* All dashboard content sits above orbs */
.aurora-wrap { position: relative; z-index: 2; }

/* ─── TOP BAR ─── */
.aurora-topbar {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 28px; padding-bottom: 18px;
  border-bottom: 1px solid rgba(255,255,255,0.06);
  flex-wrap: wrap; gap: 14px;
}
.aurora-title-block { display: flex; align-items: center; gap: 16px; }
.aurora-status {
  display: inline-flex; align-items: center; gap: 8px;
  padding: 7px 14px; border-radius: 100px;
  background: rgba(74,222,128,0.08);
  border: 1px solid rgba(74,222,128,0.25);
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px; color: #6EE7A8;
  letter-spacing: .18em; text-transform: uppercase; font-weight: 600;
}
.aurora-status-dot {
  width: 6px; height: 6px; border-radius: 50%;
  background: #4ADE80;
  box-shadow: 0 0 12px #4ADE80, 0 0 4px #4ADE80;
  animation: livePulse 1.8s ease-in-out infinite;
}
@keyframes livePulse {
  0%,100% { box-shadow: 0 0 12px #4ADE80, 0 0 4px #4ADE80; }
  50%     { box-shadow: 0 0 18px #4ADE80, 0 0 8px #4ADE80; transform: scale(1.2); }
}
.aurora-eyebrow {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px; color: rgba(245,242,235,0.45);
  letter-spacing: .3em; text-transform: uppercase;
  margin-bottom: 4px;
}
.aurora-title {
  font-family: 'Reem Kufi', 'IBM Plex Sans Arabic', sans-serif;
  font-size: 22px; font-weight: 600;
  color: #F5F2EB; line-height: 1;
}
.aurora-time-block { text-align: left; }
.aurora-time {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 22px; color: #F5F2EB;
  font-weight: 500; letter-spacing: .04em;
}
.aurora-date {
  font-size: 11px; color: rgba(245,242,235,0.45);
  margin-top: 3px;
}

/* ─── HERO METRIC — The centerpiece ─── */
.aurora-hero {
  position: relative;
  background:
    linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.02) 100%),
    rgba(20,17,13, 0.4);
  border: 1px solid rgba(255,255,255,0.08);
  border-radius: 24px;
  padding: 36px 40px 0;
  margin-bottom: 18px;
  overflow: hidden;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}
.aurora-hero::before {
  content: ''; position: absolute; inset: 0;
  background: radial-gradient(circle at 80% 0%, rgba(255,62,71,0.12) 0%, transparent 50%);
  pointer-events: none;
}
.aurora-hero-content { position: relative; z-index: 2; }
.aurora-hero-row {
  display: grid;
  grid-template-columns: 1.4fr 1fr;
  gap: 32px;
  align-items: end;
  margin-bottom: 24px;
}
.aurora-hero-label {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px; color: rgba(245,242,235,0.5);
  letter-spacing: .15em; text-transform: uppercase;
  margin-bottom: 10px;
  display: flex; align-items: center; gap: 10px;
}
.aurora-hero-label::before {
  content: ''; width: 24px; height: 2px;
  background: linear-gradient(90deg, #FF3E47, transparent);
  border-radius: 2px;
}
.aurora-hero-number {
  font-family: 'Playfair Display', serif;
  font-size: clamp(72px, 11vw, 132px);
  font-weight: 800; color: #FFFFFF;
  line-height: 0.9; letter-spacing: -0.04em;
  display: flex; align-items: baseline; gap: 16px;
  text-shadow:
    0 0 60px rgba(255,62,71,0.25),
    0 0 20px rgba(255,62,71,0.15);
}
.aurora-hero-number .unit {
  font-family: 'IBM Plex Sans Arabic', sans-serif;
  font-size: clamp(22px, 3vw, 32px);
  font-weight: 400; color: rgba(245,242,235,0.45);
  letter-spacing: 0;
}
.aurora-hero-trend {
  display: inline-flex; align-items: center; gap: 8px;
  margin-top: 14px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 12px; color: rgba(245,242,235,0.6);
}
.aurora-hero-trend .badge-up {
  display: inline-flex; align-items: center; gap: 4px;
  padding: 3px 10px; border-radius: 100px;
  background: rgba(74,222,128,0.12);
  border: 1px solid rgba(74,222,128,0.3);
  color: #6EE7A8; font-weight: 600;
  font-size: 11px;
}
.aurora-hero-trend .badge-flat {
  padding: 3px 10px; border-radius: 100px;
  background: rgba(245,242,235,0.06);
  border: 1px solid rgba(245,242,235,0.12);
  color: rgba(245,242,235,0.7);
  font-size: 11px; font-weight: 600;
}

/* Secondary metrics column */
.aurora-hero-stats {
  display: flex; flex-direction: column; gap: 12px;
}
.aurora-stat-row {
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.05);
  border-radius: 12px;
  transition: all .2s ease;
}
.aurora-stat-row:hover {
  background: rgba(255,255,255,0.04);
  border-color: rgba(255,255,255,0.1);
}
.aurora-stat-label {
  font-size: 12px; color: rgba(245,242,235,0.55);
  font-weight: 500;
  display: flex; align-items: center; gap: 8px;
}
.aurora-stat-icon {
  width: 22px; height: 22px;
  border-radius: 7px;
  background: rgba(255,62,71,0.12);
  color: #FF6B73;
  display: flex; align-items: center; justify-content: center;
}
.aurora-stat-icon svg { width: 12px; height: 12px; stroke-width: 2; }
.aurora-stat-icon.gold { background: rgba(212,168,92,0.12); color: #D4A85C; }
.aurora-stat-icon.sage { background: rgba(143,176,105,0.12); color: #8FB069; }
.aurora-stat-icon.info { background: rgba(96,165,250,0.12); color: #93C5FD; }
.aurora-stat-value {
  font-family: 'Playfair Display', serif;
  font-size: 22px; font-weight: 700;
  color: #FFFFFF; letter-spacing: -0.01em;
  display: flex; align-items: baseline; gap: 5px;
}
.aurora-stat-value .small { font-size: 11px; color: rgba(245,242,235,0.4); font-family: 'IBM Plex Sans Arabic', sans-serif; font-weight: 400; }

/* Wave visualization beneath hero */
.aurora-wave {
  position: relative; height: 90px;
  margin: 0 -40px -1px;
  overflow: hidden;
}
.aurora-wave svg {
  position: absolute; left: 0; right: 0; bottom: -1px;
  width: 100%; height: 100%;
}
.aurora-wave-path-1 {
  fill: url(#wgrad1);
  opacity: 0.9;
}
.aurora-wave-path-2 {
  fill: url(#wgrad2);
  opacity: 0.7;
}

/* ─── BENTO GRID ─── */
.aurora-bento {
  display: grid;
  grid-template-columns: repeat(12, 1fr);
  gap: 18px;
  margin-bottom: 24px;
}
.aurora-card {
  background:
    linear-gradient(135deg, rgba(255,255,255,0.04) 0%, rgba(255,255,255,0.02) 100%);
  border: 1px solid rgba(255,255,255,0.07);
  border-radius: 20px;
  padding: 22px 24px;
  position: relative;
  overflow: hidden;
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  transition: border-color .3s ease, transform .3s ease;
}
.aurora-card:hover {
  border-color: rgba(255,255,255,0.12);
}
.aurora-card::before {
  content: ''; position: absolute;
  top: 0; left: 0; right: 0; height: 1px;
  background: linear-gradient(90deg, transparent 20%, rgba(255,255,255,0.15) 50%, transparent 80%);
}

.aurora-card-head {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 18px;
  flex-wrap: wrap; gap: 10px;
}
.aurora-card-title {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: 13px; font-weight: 600;
  color: #F5F2EB;
  display: flex; align-items: center; gap: 10px;
}
.aurora-card-icon-sm {
  width: 28px; height: 28px;
  border-radius: 9px;
  background: rgba(255,62,71,0.12);
  color: #FF6B73;
  display: flex; align-items: center; justify-content: center;
}
.aurora-card-icon-sm svg { width: 14px; height: 14px; stroke-width: 2; }
.aurora-card-icon-sm.gold { background: rgba(212,168,92,0.12); color: #D4A85C; }
.aurora-card-icon-sm.sage { background: rgba(143,176,105,0.12); color: #8FB069; }
.aurora-card-icon-sm.info { background: rgba(96,165,250,0.12); color: #93C5FD; }
.aurora-card-icon-sm.purple { background: rgba(167,139,250,0.12); color: #C4B5FD; }
.aurora-card-meta {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px; color: rgba(245,242,235,0.4);
  letter-spacing: .08em;
}

/* Bento sizing */
.bento-span-4 { grid-column: span 4; }
.bento-span-5 { grid-column: span 5; }
.bento-span-6 { grid-column: span 6; }
.bento-span-7 { grid-column: span 7; }
.bento-span-8 { grid-column: span 8; }
.bento-span-12 { grid-column: span 12; }

/* ─── PRODUCTION PULSE TIMELINE ─── */
.pulse-timeline {
  position: relative;
  padding: 8px 4px 26px;
}
.pulse-svg {
  width: 100%; height: 140px;
  display: block;
}
.pulse-axis {
  display: flex; justify-content: space-between;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 9.5px; color: rgba(245,242,235,0.35);
  letter-spacing: .05em;
  margin-top: 4px;
}
.pulse-event-dot {
  cursor: pointer;
  transition: r .2s ease;
}
.pulse-event-dot:hover { r: 7; }
.pulse-now-line {
  stroke: #FF3E47;
  stroke-width: 1.5;
  stroke-dasharray: 3 3;
  opacity: 0.6;
}
.pulse-empty {
  text-align: center;
  padding: 30px 20px;
  color: rgba(245,242,235,0.35);
  font-size: 12px;
}

/* ─── PRODUCT MIX — Stacked Bar ─── */
.mix-bar {
  display: flex; width: 100%;
  height: 32px; border-radius: 8px;
  overflow: hidden;
  margin-bottom: 18px;
  box-shadow: 0 4px 12px rgba(0,0,0,0.3);
  background: rgba(255,255,255,0.04);
}
.mix-seg {
  position: relative;
  display: flex; align-items: center; justify-content: center;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10.5px; color: #fff;
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(0,0,0,0.4);
  transition: transform .25s ease, filter .25s ease;
  cursor: pointer;
  overflow: hidden;
  animation: segGrow 1s cubic-bezier(0.16, 1, 0.3, 1) both;
}
.mix-seg:hover { filter: brightness(1.15); transform: scaleY(1.08); }
@keyframes segGrow {
  from { transform: scaleX(0); transform-origin: right; }
  to   { transform: scaleX(1); }
}
.mix-legend {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 10px;
}
.mix-legend-item {
  display: flex; align-items: center; gap: 9px;
  font-size: 12px;
  padding: 6px 0;
}
.mix-legend-dot {
  width: 12px; height: 12px;
  border-radius: 4px;
  flex-shrink: 0;
  box-shadow: 0 0 10px currentColor;
}
.mix-legend-text { flex: 1; min-width: 0; }
.mix-legend-name {
  color: rgba(245,242,235,0.85);
  font-weight: 500;
  font-size: 11.5px;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.mix-legend-val {
  font-family: 'IBM Plex Mono', monospace;
  color: rgba(245,242,235,0.5);
  font-size: 10px;
  margin-top: 2px;
}

/* ─── FARMS LIST ─── */
.farms-list { display: flex; flex-direction: column; gap: 14px; }
.farm-row {
  display: grid;
  grid-template-columns: 1fr auto;
  gap: 8px;
  align-items: center;
  padding: 12px 0;
  border-bottom: 1px solid rgba(255,255,255,0.05);
}
.farm-row:last-child { border-bottom: none; padding-bottom: 0; }
.farm-name-row {
  display: flex; align-items: center; gap: 10px;
  margin-bottom: 6px;
}
.farm-rank {
  width: 24px; height: 24px;
  border-radius: 7px;
  background: rgba(212,168,92,0.12);
  color: #D4A85C;
  display: flex; align-items: center; justify-content: center;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 11px; font-weight: 700;
  flex-shrink: 0;
}
.farm-name {
  font-size: 13px;
  color: #F5F2EB;
  font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.farm-bar-row {
  height: 5px; border-radius: 100px;
  background: rgba(255,255,255,0.05);
  overflow: hidden;
  grid-column: 1 / -1;
}
.farm-bar-fill {
  height: 100%; border-radius: 100px;
  background: linear-gradient(90deg, #FF3E47 0%, #D4A85C 100%);
  box-shadow: 0 0 12px rgba(255,62,71,0.4);
  animation: barGrowFarm 1.2s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes barGrowFarm {
  from { transform: scaleX(0); transform-origin: right; }
  to   { transform: scaleX(1); }
}
.farm-value {
  font-family: 'Playfair Display', serif;
  font-size: 18px; font-weight: 700;
  color: #F5F2EB;
  letter-spacing: -.01em;
}
.farm-value-unit {
  font-family: 'IBM Plex Sans Arabic', sans-serif;
  font-size: 11px; color: rgba(245,242,235,0.4);
  font-weight: 400;
}

/* ─── LIVE ACTIVITY FEED ─── */
.activity-stream {
  max-height: 360px; overflow-y: auto;
  display: flex; flex-direction: column; gap: 2px;
  scrollbar-width: thin;
  margin-right: -8px; padding-right: 4px;
}
.activity-stream::-webkit-scrollbar { width: 4px; }
.activity-stream::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 2px; }
.activity-row {
  display: grid;
  grid-template-columns: 36px 1fr auto;
  gap: 12px;
  align-items: center;
  padding: 10px 8px;
  border-radius: 10px;
  transition: background .15s ease;
  animation: actSlide .4s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes actSlide {
  from { opacity: 0; transform: translateX(20px); }
  to   { opacity: 1; transform: translateX(0); }
}
.activity-row:hover { background: rgba(255,255,255,0.03); }
.activity-row.new {
  background: rgba(255,62,71,0.06);
}
.act-icon {
  width: 36px; height: 36px;
  border-radius: 11px;
  display: flex; align-items: center; justify-content: center;
  background: rgba(255,62,71,0.1); color: #FF6B73;
  font-size: 16px;
  position: relative;
}
.act-icon.frozen { background: rgba(167,139,250,0.1); color: #C4B5FD; }
.act-icon.return { background: rgba(248,113,113,0.1); color: #FCA5A5; }
.act-icon.prod   { background: rgba(143,176,105,0.1); color: #8FB069; }
.act-body { min-width: 0; }
.act-title {
  font-size: 12.5px; color: #F5F2EB;
  font-weight: 500; line-height: 1.3;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.act-meta {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px; color: rgba(245,242,235,0.4);
  margin-top: 2px;
}
.act-amount {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 13px; font-weight: 700;
  color: #F5F2EB;
}
.act-amount-unit {
  font-size: 10px; color: rgba(245,242,235,0.4);
  margin-right: 3px;
}

/* ─── FUTURE MODULES (Coming Soon) ─── */
.future-section {
  margin-top: 26px;
  padding-top: 28px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.future-header {
  display: flex; align-items: center; justify-content: space-between;
  margin-bottom: 18px;
}
.future-title {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: 14px; font-weight: 600;
  color: rgba(245,242,235,0.85);
  display: flex; align-items: center; gap: 10px;
}
.future-title::before {
  content: '✦'; color: #D4A85C;
  font-size: 18px;
}
.future-tag {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px; color: rgba(245,242,235,0.4);
  letter-spacing: .15em;
  padding: 4px 10px;
  border-radius: 100px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.08);
}
.future-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
}
.future-card {
  position: relative;
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 18px;
  padding: 24px;
  overflow: hidden;
  transition: all .3s ease;
}
.future-card:hover {
  border-color: rgba(255,255,255,0.14);
  transform: translateY(-2px);
}
.future-card::before {
  content: ''; position: absolute; inset: 0;
  background: linear-gradient(135deg, transparent 0%, transparent 50%, rgba(255,62,71,0.04) 100%);
  pointer-events: none;
}
.future-card::after {
  content: ''; position: absolute;
  top: 0; left: -100%; width: 100%; height: 100%;
  background: linear-gradient(90deg, transparent 0%, rgba(255,255,255,0.05) 50%, transparent 100%);
  animation: shimmer 4s ease-in-out infinite;
  pointer-events: none;
}
@keyframes shimmer {
  0% { left: -100%; }
  50% { left: 100%; }
  100% { left: 100%; }
}
.future-icon-box {
  width: 48px; height: 48px;
  border-radius: 14px;
  background: linear-gradient(135deg, rgba(255,62,71,0.15) 0%, rgba(212,168,92,0.1) 100%);
  border: 1px solid rgba(255,62,71,0.2);
  display: flex; align-items: center; justify-content: center;
  margin-bottom: 16px;
  color: #FFB4B7;
  position: relative; z-index: 1;
}
.future-icon-box.gold { background: linear-gradient(135deg, rgba(212,168,92,0.2) 0%, rgba(255,62,71,0.1) 100%); border-color: rgba(212,168,92,0.25); color: #E5C088; }
.future-icon-box.sage { background: linear-gradient(135deg, rgba(143,176,105,0.18) 0%, rgba(96,165,250,0.1) 100%); border-color: rgba(143,176,105,0.25); color: #A8C68A; }
.future-icon-box svg { width: 22px; height: 22px; stroke-width: 1.8; }
.future-card-title {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: 15px; font-weight: 600;
  color: #F5F2EB; margin-bottom: 6px;
  position: relative; z-index: 1;
}
.future-card-desc {
  font-size: 11.5px; color: rgba(245,242,235,0.55);
  line-height: 1.65;
  margin-bottom: 16px;
  position: relative; z-index: 1;
}
.future-card-foot {
  display: flex; align-items: center; justify-content: space-between;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px; color: rgba(245,242,235,0.5);
  letter-spacing: .1em;
  position: relative; z-index: 1;
}
.future-badge {
  padding: 4px 11px;
  border-radius: 100px;
  background: linear-gradient(135deg, rgba(255,62,71,0.15), rgba(255,62,71,0.05));
  border: 1px solid rgba(255,62,71,0.25);
  color: #FFB4B7;
  font-size: 9.5px; font-weight: 700;
  text-transform: uppercase;
}
.future-arrow {
  width: 28px; height: 28px;
  border-radius: 8px;
  background: rgba(255,255,255,0.04);
  border: 1px solid rgba(255,255,255,0.06);
  display: flex; align-items: center; justify-content: center;
  color: rgba(245,242,235,0.5);
  transition: all .25s ease;
}
.future-card:hover .future-arrow {
  background: rgba(255,62,71,0.1);
  border-color: rgba(255,62,71,0.3);
  color: #FFB4B7;
  transform: translateX(-3px);
}

/* ─── RESPONSIVE ─── */
@media (max-width: 1100px) {
  #page-dashboard { margin: -36px -28px -50px; padding: 28px 24px 50px; }
  .aurora-bento { grid-template-columns: repeat(6, 1fr); }
  .bento-span-7, .bento-span-5, .bento-span-8, .bento-span-4 { grid-column: span 6; }
  .aurora-hero-row { grid-template-columns: 1fr; gap: 24px; }
  .future-grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 768px) {
  #page-dashboard { margin: -64px -14px -24px; padding: 18px 14px 30px; }
  .aurora-topbar { padding-bottom: 14px; margin-bottom: 18px; }
  .aurora-title { font-size: 18px; }
  .aurora-time { font-size: 18px; }
  .aurora-hero { padding: 22px 22px 0; border-radius: 18px; }
  .aurora-hero-number { font-size: clamp(56px, 16vw, 96px); }
  .aurora-bento { grid-template-columns: 1fr; }
  .future-grid { grid-template-columns: 1fr; }
  .aurora-wave { margin: 0 -22px -1px; height: 70px; }
  .aurora-card { padding: 18px 18px; border-radius: 16px; }
  .pulse-svg { height: 110px; }
}



/* ═══════════════════════════════════════════════════════
   AURORA MODAL — Drill-Down Detail Viewer
   Cinematic overlay for category & returns breakdowns
═══════════════════════════════════════════════════════ */
.aurora-modal-overlay {
  position: fixed; inset: 0;
  z-index: 5000;
  background: rgba(8, 7, 10, 0.78);
  backdrop-filter: blur(14px) saturate(120%);
  -webkit-backdrop-filter: blur(14px) saturate(120%);
  display: flex; align-items: center; justify-content: center;
  padding: 24px;
  opacity: 0;
  pointer-events: none;
  transition: opacity .35s cubic-bezier(0.16, 1, 0.3, 1);
}
.aurora-modal-overlay.open {
  opacity: 1;
  pointer-events: auto;
}
.aurora-modal-card {
  position: relative;
  width: 100%; max-width: 720px;
  max-height: calc(100vh - 48px);
  background:
    linear-gradient(135deg, rgba(255,255,255,0.06) 0%, rgba(255,255,255,0.02) 100%),
    rgba(15, 13, 11, 0.95);
  border: 1px solid rgba(255,255,255,0.10);
  border-radius: 24px;
  padding: 32px 36px;
  overflow-y: auto;
  color: #F5F2EB;
  box-shadow:
    0 32px 64px rgba(0,0,0,0.5),
    0 8px 24px rgba(0,0,0,0.3),
    inset 0 1px 0 rgba(255,255,255,0.08);
  transform: scale(0.94) translateY(20px);
  opacity: 0;
  transition: transform .45s cubic-bezier(0.16, 1, 0.3, 1), opacity .35s ease;
  -webkit-overflow-scrolling: touch;
}
.aurora-modal-overlay.open .aurora-modal-card {
  transform: scale(1) translateY(0);
  opacity: 1;
}
.aurora-modal-card::before {
  content: '';
  position: absolute; top: 0; left: 0; right: 0;
  height: 3px;
  background: linear-gradient(90deg,
    transparent 10%,
    var(--accent, #FF3E47) 50%,
    transparent 90%);
  border-radius: 24px 24px 0 0;
  box-shadow: 0 0 24px var(--accent, #FF3E47);
}
.aurora-modal-card::-webkit-scrollbar { width: 6px; }
.aurora-modal-card::-webkit-scrollbar-thumb { background: rgba(255,255,255,0.1); border-radius: 3px; }

.aurora-modal-close {
  position: absolute; top: 18px; left: 18px;
  width: 36px; height: 36px;
  border-radius: 11px;
  background: rgba(255,255,255,0.05);
  border: 1px solid rgba(255,255,255,0.10);
  color: rgba(245,242,235,0.7);
  display: flex; align-items: center; justify-content: center;
  cursor: pointer; padding: 0;
  transition: all .2s ease;
  z-index: 10;
}
.aurora-modal-close:hover {
  background: rgba(255,62,71,0.15);
  border-color: rgba(255,62,71,0.4);
  color: #FFB4B7;
  transform: rotate(90deg);
}
.aurora-modal-close svg { width: 18px; height: 18px; stroke-width: 2; }

/* Modal header */
.modal-eyebrow {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10.5px;
  color: rgba(245,242,235,0.45);
  letter-spacing: .25em;
  text-transform: uppercase;
  margin-bottom: 12px;
  display: flex; align-items: center; gap: 10px;
}
.modal-eyebrow::before {
  content: '';
  width: 22px; height: 2px;
  background: var(--accent, #FF3E47);
  border-radius: 2px;
}
.modal-title {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: 32px; font-weight: 700;
  color: #F5F2EB;
  letter-spacing: -.015em;
  line-height: 1.1;
  margin-bottom: 8px;
}
.modal-headline-stats {
  display: flex; gap: 22px;
  flex-wrap: wrap;
  margin-top: 18px;
  padding-top: 20px;
  border-top: 1px solid rgba(255,255,255,0.06);
}
.modal-hs-item {
  display: flex; flex-direction: column;
}
.modal-hs-val {
  font-family: 'Playfair Display', serif;
  font-size: 28px; font-weight: 700;
  color: #FFFFFF;
  line-height: 1; letter-spacing: -.02em;
  display: flex; align-items: baseline; gap: 5px;
}
.modal-hs-val .unit {
  font-family: 'IBM Plex Sans Arabic', sans-serif;
  font-size: 12px; font-weight: 400;
  color: rgba(245,242,235,0.4);
}
.modal-hs-lbl {
  font-size: 11px;
  color: rgba(245,242,235,0.5);
  margin-top: 5px;
  font-weight: 500;
}

/* Section divider in modal */
.modal-section {
  margin-top: 28px;
}
.modal-section-title {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: 13px; font-weight: 600;
  color: rgba(245,242,235,0.85);
  margin-bottom: 14px;
  display: flex; align-items: center; justify-content: space-between;
}
.modal-section-title .meta {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  color: rgba(245,242,235,0.4);
  letter-spacing: .1em;
  font-weight: 500;
}

/* Product/Item bar rows inside modal */
.modal-bar-list {
  display: flex; flex-direction: column;
  gap: 4px;
}
.modal-bar-row {
  display: grid;
  grid-template-columns: 1fr 130px;
  gap: 14px;
  align-items: center;
  padding: 12px 4px;
  border-radius: 10px;
  transition: background .15s;
  animation: modalRowIn .5s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes modalRowIn {
  from { opacity: 0; transform: translateX(20px); }
  to   { opacity: 1; transform: translateX(0); }
}
.modal-bar-row:hover { background: rgba(255,255,255,0.02); }
.modal-bar-info {
  display: flex; flex-direction: column;
  gap: 6px;
  min-width: 0;
}
.modal-bar-name-row {
  display: flex; align-items: center; gap: 9px;
}
.modal-bar-rank {
  width: 22px; height: 22px;
  border-radius: 7px;
  background: rgba(255,255,255,0.06);
  color: rgba(245,242,235,0.6);
  display: flex; align-items: center; justify-content: center;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px; font-weight: 700;
  flex-shrink: 0;
}
.modal-bar-rank.top {
  background: rgba(212,168,92,0.18);
  color: #E5C088;
}
.modal-bar-name {
  font-size: 13px;
  color: #F5F2EB;
  font-weight: 500;
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
.modal-bar-code {
  font-family: 'IBM Plex Mono', monospace;
  font-size: 10px;
  color: rgba(245,242,235,0.4);
}
.modal-bar-track {
  height: 5px; border-radius: 100px;
  background: rgba(255,255,255,0.04);
  overflow: hidden;
}
.modal-bar-fill {
  height: 100%; border-radius: 100px;
  background: linear-gradient(90deg, var(--accent, #FF3E47) 0%, var(--accent-2, #D4A85C) 100%);
  box-shadow: 0 0 10px var(--accent-glow, rgba(255,62,71,0.4));
  animation: barGrowModal 1.1s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes barGrowModal {
  from { transform: scaleX(0); transform-origin: right; }
  to   { transform: scaleX(1); }
}
.modal-bar-values {
  text-align: left;
  font-family: 'IBM Plex Mono', monospace;
}
.modal-bar-val {
  font-size: 15px; font-weight: 700;
  color: #F5F2EB;
}
.modal-bar-val .small {
  font-size: 10px; color: rgba(245,242,235,0.4);
  margin-right: 3px; font-weight: 400;
}
.modal-bar-pct {
  font-size: 10.5px;
  color: rgba(245,242,235,0.5);
  margin-top: 2px;
}

/* Two-column modal layout for returns */
.modal-two-col {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 24px;
  margin-top: 24px;
}
.modal-col-card {
  background: rgba(255,255,255,0.025);
  border: 1px solid rgba(255,255,255,0.06);
  border-radius: 16px;
  padding: 18px 18px 12px;
}
.modal-col-title {
  font-family: 'Noto Kufi Arabic', sans-serif;
  font-size: 12px; font-weight: 600;
  color: rgba(245,242,235,0.8);
  margin-bottom: 14px;
  display: flex; align-items: center; gap: 8px;
}
.modal-col-icon {
  width: 24px; height: 24px;
  border-radius: 7px;
  background: rgba(212,168,92,0.15);
  color: #E5C088;
  display: flex; align-items: center; justify-content: center;
}
.modal-col-icon.coral { background: rgba(252,165,165,0.15); color: #FCA5A5; }
.modal-col-icon svg { width: 13px; height: 13px; stroke-width: 2; }

/* Click hint for mix segments */
.mix-seg { cursor: pointer; user-select: none; }
.mix-seg::after {
  content: ''; position: absolute; inset: 0;
  background: rgba(255,255,255,0);
  transition: background .15s ease;
}
.mix-seg:hover::after { background: rgba(255,255,255,0.06); }
.mix-legend-item { cursor: pointer; transition: opacity .15s; }
.mix-legend-item:hover { opacity: 0.75; }

/* ═══════════════════════════════════════════════════════
   RETURNS SUMMARY CARD on Dashboard
═══════════════════════════════════════════════════════ */
.aurora-card.returns-card {
  cursor: pointer;
  transition: transform .3s ease, border-color .3s ease;
}
.aurora-card.returns-card:hover {
  border-color: rgba(252,165,165,0.25);
  transform: translateY(-2px);
}
.returns-overview {
  display: grid;
  grid-template-columns: auto 1fr;
  gap: 22px;
  align-items: center;
}
.returns-big-icon {
  width: 64px; height: 64px;
  border-radius: 20px;
  background: linear-gradient(135deg, rgba(252,165,165,0.15) 0%, rgba(255,62,71,0.10) 100%);
  border: 1px solid rgba(252,165,165,0.20);
  color: #FCA5A5;
  display: flex; align-items: center; justify-content: center;
  flex-shrink: 0;
  position: relative;
}
.returns-big-icon::after {
  content: '';
  position: absolute; inset: -4px;
  border-radius: 24px;
  background: radial-gradient(circle, rgba(252,165,165,0.25) 0%, transparent 70%);
  z-index: -1;
  filter: blur(8px);
  opacity: 0;
  transition: opacity .3s ease;
}
.aurora-card.returns-card:hover .returns-big-icon::after { opacity: 1; }
.returns-big-icon svg { width: 30px; height: 30px; stroke-width: 1.8; }

.returns-numbers {
  display: flex;
  gap: 22px;
  flex-wrap: wrap;
  align-items: baseline;
}
.returns-stat {
  display: flex; flex-direction: column;
  gap: 3px;
}
.returns-stat-val {
  font-family: 'Playfair Display', serif;
  font-size: 30px;
  font-weight: 700;
  color: #F5F2EB;
  line-height: 1; letter-spacing: -.02em;
  display: flex; align-items: baseline; gap: 4px;
}
.returns-stat-val .unit {
  font-family: 'IBM Plex Sans Arabic', sans-serif;
  font-size: 11px;
  font-weight: 400;
  color: rgba(245,242,235,0.4);
}
.returns-stat-lbl {
  font-size: 10.5px;
  color: rgba(245,242,235,0.5);
  letter-spacing: .04em;
  font-weight: 500;
}

.returns-mini-bars {
  display: flex;
  gap: 4px;
  height: 24px;
  margin-top: 14px;
  padding: 4px;
  background: rgba(255,255,255,0.02);
  border-radius: 6px;
}
.returns-mini-bar {
  flex: 1;
  border-radius: 4px;
  background: linear-gradient(180deg, #FCA5A5 0%, rgba(252,165,165,0.3) 100%);
  min-height: 4px;
  transition: opacity .15s ease;
  opacity: 0.85;
  animation: barRiseIn .8s cubic-bezier(0.16, 1, 0.3, 1) both;
}
@keyframes barRiseIn {
  from { transform: scaleY(0); transform-origin: bottom; opacity: 0; }
  to   { opacity: 0.85; }
}

.returns-arrow-hint {
  position: absolute; top: 22px; left: 22px;
  display: flex; align-items: center; gap: 6px;
  font-family: 'IBM Plex Mono', monospace;
  font-size: 9.5px;
  color: rgba(252,165,165,0.6);
  letter-spacing: .12em;
  text-transform: uppercase;
  opacity: 0;
  transition: opacity .25s ease;
}
.aurora-card.returns-card:hover .returns-arrow-hint { opacity: 1; }
.returns-arrow-hint svg { width: 14px; height: 14px; stroke-width: 2; }

@media (max-width: 768px) {
  .aurora-modal-card { padding: 24px 22px; border-radius: 20px; max-height: 88vh; }
  .modal-title { font-size: 24px; }
  .modal-hs-val { font-size: 22px; }
  .modal-headline-stats { gap: 18px; }
  .modal-two-col { grid-template-columns: 1fr; gap: 14px; }
  .returns-overview { grid-template-columns: 1fr; gap: 14px; }
  .returns-big-icon { width: 52px; height: 52px; }
  .returns-stat-val { font-size: 24px; }
}

@media print {
  @page { size: A4 portrait; margin: 5mm; }
  html, body { background: #fff !important; }
  .sidebar, .toast, body::before, body::after, .no-print { display: none !important; }
  .main { padding: 0 !important; background: #fff !important; width: 100% !important; }
  .page { display: none !important; }
  .page.active { display: block !important; }
}

  #fwh-order-section-tabs .fwh-order-src.active{background:var(--brand);color:#fff;border-color:var(--brand)}
  .fwh-order-qty{max-width:120px;text-align:center;font-weight:800}


/* ─── Formal Arabic Typography & Frozen Inventory Dashboard Analytics ─── */
body, button, input, select, textarea, .page, .card, .aurora-wrap, .future-card {
  font-family: var(--f-sans) !important;
}
h1,h2,h3,.card-title,.page-title,.aurora-title,.aurora-card-title,.future-title,.future-card-title,.sb-system-name,.nav-label {
  font-family: var(--f-display) !important;
  letter-spacing: 0 !important;
}
.tc,.tq,.fwh-mini-code,.fwh-stock-code,.fwh-code-box,[style*="IBM Plex Mono"] { font-family: var(--f-mono) !important; }
.frozen-analytics-card{position:relative;overflow:hidden;min-height:360px;background:linear-gradient(135deg,rgba(10,15,24,.90),rgba(28,35,48,.82))!important;border-color:rgba(147,197,253,.18)!important}
.frozen-analytics-card::before{content:'';position:absolute;inset:-120px auto auto -80px;width:320px;height:320px;background:radial-gradient(circle,rgba(147,197,253,.22),transparent 68%);filter:blur(12px);pointer-events:none}
.fz-analytics-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-top:18px;position:relative;z-index:1}
.fz-kpi{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.045);border-radius:18px;padding:16px;min-height:96px;box-shadow:inset 0 1px 0 rgba(255,255,255,.05)}
.fz-kpi-lbl{font-size:11px;color:rgba(245,242,235,.55);font-weight:600;margin-bottom:8px}
.fz-kpi-val{font-family:var(--f-mono)!important;font-size:28px;line-height:1;font-weight:700;color:#EAF2FF;direction:ltr;text-align:left}
.fz-kpi-val .unit{font-size:11px;color:rgba(245,242,235,.48);font-family:var(--f-sans)!important;margin-inline-start:4px}
.fz-panel-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:14px;margin-top:14px;position:relative;z-index:1}
.fz-panel{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);border-radius:18px;padding:14px;min-height:190px}
.fz-panel-title{font-family:var(--f-display)!important;font-size:13px;color:#fff;font-weight:800;margin-bottom:12px;display:flex;align-items:center;gap:8px}
.fz-panel-title::before{content:'';width:8px;height:8px;border-radius:50%;background:#93C5FD;box-shadow:0 0 16px rgba(147,197,253,.75)}
.fz-mini-row{display:grid;grid-template-columns:1fr 70px;gap:10px;align-items:center;margin:9px 0}
.fz-mini-name{font-size:11px;color:rgba(245,242,235,.76);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.fz-mini-val{font-family:var(--f-mono)!important;font-size:11px;font-weight:700;color:#D4A85C;text-align:left;direction:ltr}
.fz-track{grid-column:1/3;height:6px;border-radius:999px;background:rgba(255,255,255,.07);overflow:hidden;margin-top:-4px}
.fz-fill{height:100%;border-radius:999px;background:linear-gradient(90deg,#93C5FD,#34D399);animation:auroraBar .8s var(--ease-o) both}
.fz-alert-row{display:flex;justify-content:space-between;gap:10px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.06);font-size:11px;color:rgba(245,242,235,.72)}
.fz-alert-row:last-child{border-bottom:0}.fz-alert-code{font-family:var(--f-mono)!important;color:#fff}.fz-alert-date{font-family:var(--f-mono)!important;color:#FCA5A5;direction:ltr}.fz-empty{height:135px;display:flex;align-items:center;justify-content:center;color:rgba(245,242,235,.35);font-size:12px;text-align:center}
@media(max-width:900px){.fz-analytics-grid{grid-template-columns:repeat(2,1fr)}.fz-panel-grid{grid-template-columns:1fr}.frozen-analytics-card{min-height:auto}}


/* ===== css/patches.css ===== */
/* Final checkbox visibility fix: global input appearance was hiding the tick mark */
input[type="checkbox"]{
  -webkit-appearance: checkbox !important;
  appearance: checkbox !important;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px !important;
  padding: 0 !important;
  border-radius: 4px !important;
  accent-color: var(--success) !important;
  cursor: pointer !important;
  vertical-align: middle;
}
.inv-check{width:22px!important;height:22px!important;min-width:22px!important;}
.fz-mini-row{cursor:pointer;transition:transform .15s ease, background .15s ease;}
.fz-mini-row:hover{transform:translateX(-2px);background:rgba(255,255,255,.04);border-radius:10px;}
.farm-row{cursor:pointer;transition:transform .15s ease, background .15s ease;}
.farm-row:hover{transform:translateX(-2px);background:rgba(255,255,255,.04);border-radius:12px;}

/* PATCH: optional seller row under DL1 / RTN1 distribution headers */
.sales-dist-table .sd-seller-row th{
  background:#fff7d6!important;
  color:#111!important;
  padding:3px 4px!important;
  font-size:10px!important;
  font-weight:700!important;
}
.sales-dist-table .sd-seller-row th.sd-seller-empty{
  background:#f7f7f7!important;
  color:#9ca3af!important;
}
.sales-dist-seller-select{
  width:100%; min-width:78px; height:25px!important; min-height:25px!important;
  border:1px solid #d4a017!important; border-radius:3px!important;
  background:#fffdf0!important; color:#111!important;
  padding:0 4px!important; font-size:10px!important; font-family:var(--f-sans)!important;
  text-align:center!important; box-shadow:none!important;
}
.sales-dist-seller-select:focus{outline:2px solid #d4a017!important; box-shadow:none!important;}

/* PATCH FIX: DL1 aggregated sales orders + sales deletion */
.sales-dist-input.sd-sales-order-linked{background:#eef8ff!important;border-color:#38bdf8!important;color:#075985!important;font-weight:800!important;}
.sales-dist-input.sd-sales-order-linked.sd-manual-override{background:#fff7ed!important;border-color:#f59e0b!important;color:#92400e!important;}

/* PATCH: sales management item edit controls + frozen stock note */
.sales-mgmt-items{min-width:280px;line-height:1.8}
.sales-mgmt-item{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid var(--hair);padding:4px 0}
.sales-mgmt-item:last-child{border-bottom:0}
.sales-mgmt-item-main{flex:1;min-width:0}
.sales-mgmt-item-actions{display:flex;gap:4px;flex-wrap:wrap;justify-content:flex-end}
.sales-mgmt-item-actions .btn{padding:3px 7px!important;font-size:10px!important}
.frozen-stock-hint{display:block;margin-top:4px;font-family:var(--f-mono);font-size:10.5px;font-weight:800;color:var(--purple)}
.sales-dist-seller-select[disabled]{opacity:1!important;background:#f3f4f6!important;color:#111!important;cursor:not-allowed!important}

/* FINAL PATCH: LULU duplicate delivery-line aggregation fix */
.sales-dist-input.sd-lulu-linked{background:#f5f3ff!important;border-color:#8b5cf6!important;color:#4c1d95!important;font-weight:800!important;}
.sales-dist-input.sd-lulu-linked.sd-manual-override{background:#fff7ed!important;border-color:#f59e0b!important;color:#92400e!important;}

/* FINAL PATCH: Permanent orders paste/table must behave LEFT-TO-RIGHT like Excel.
   This prevents RTL layout from visually reversing LULU columns and keeps Column A as Item Code. */
#perm-paste{
  direction:ltr!important;
  text-align:left!important;
  unicode-bidi:plaintext!important;
  font-family:'IBM Plex Mono',monospace!important;
  white-space:pre!important;
}
#perm-table-wrap,
#perm-table-wrap table{
  direction:ltr!important;
  text-align:left!important;
}
#perm-table-wrap th,
#perm-table-wrap td{
  direction:ltr!important;
  text-align:left!important;
  unicode-bidi:plaintext!important;
}

/* PATCH: keep all Aurora detail popups centered regardless of scroll or click source */
.aurora-modal-overlay,
.aurora-modal-overlay.open{
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  place-items:center !important;
  padding:24px !important;
}
.aurora-modal-card{
  margin:auto !important;
  inset:auto !important;
  max-height:calc(100dvh - 48px) !important;
}
@media(max-width:700px){
  .aurora-modal-overlay,.aurora-modal-overlay.open{padding:14px !important;}
  .aurora-modal-card{max-height:calc(100dvh - 28px) !important;}
}

/* PATCH: stronger centered dashboard modal + full visibility */
#aurora-modal.aurora-modal-overlay,
.aurora-modal-overlay{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  overflow:hidden !important;
  padding:22px !important;
  box-sizing:border-box !important;
}
#aurora-modal .aurora-modal-card,
.aurora-modal-card{
  position:relative !important;
  inset:auto !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  margin:auto !important;
  width:min(720px, calc(100vw - 44px)) !important;
  max-width:720px !important;
  max-height:calc(100dvh - 44px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  box-sizing:border-box !important;
}
#aurora-modal.open .aurora-modal-card{
  transform:none !important;
  opacity:1 !important;
}
.fz-location-split{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
  width:100%;
  direction:rtl;
}
.fz-location-box{
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.045);
  border-radius:12px;
  padding:8px 9px;
  text-align:center;
}
.fz-location-box .lbl{
  display:block;
  font-family:var(--f-sans)!important;
  font-size:10px;
  color:rgba(245,242,235,.58);
  margin-bottom:6px;
}
.fz-location-box .num{
  display:block;
  font-family:var(--f-mono)!important;
  font-size:22px;
  line-height:1;
  color:#EAF2FF;
  direction:ltr;
}
@media(max-width:700px){
  #aurora-modal.aurora-modal-overlay,
  .aurora-modal-overlay{padding:12px !important;}
  #aurora-modal .aurora-modal-card,
  .aurora-modal-card{width:calc(100vw - 24px) !important;max-height:calc(100dvh - 24px) !important;padding:24px 18px !important;border-radius:20px !important;}
}

/* FINAL PATCH: stable dashboard modal + visible location counters */
#aurora-modal.aurora-modal-overlay{
  position:fixed !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  z-index:99999 !important;
  display:flex !important;
  align-items:center !important;
  justify-content:center !important;
  padding:24px !important;
  box-sizing:border-box !important;
  overflow:hidden !important;
  opacity:0;
  pointer-events:none;
}
#aurora-modal.aurora-modal-overlay.open{
  opacity:1 !important;
  pointer-events:auto !important;
}
#aurora-modal #aurora-modal-card.aurora-modal-card{
  position:relative !important;
  inset:auto !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  margin:0 auto !important;
  width:min(720px, calc(100vw - 48px)) !important;
  max-width:720px !important;
  max-height:calc(100dvh - 48px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  transform:none !important;
  box-sizing:border-box !important;
  opacity:1 !important;
}
.dh-location-split-final{
  display:grid !important;
  grid-template-columns:1fr 1fr !important;
  gap:10px !important;
  width:100% !important;
  direction:rtl !important;
}
.dh-location-split-final .loc-box{
  min-height:58px;
  border:1px solid rgba(255,255,255,.10);
  background:rgba(255,255,255,.055);
  border-radius:14px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
}
.dh-location-split-final .loc-label{
  font-family:var(--f-sans)!important;
  font-size:10px;
  color:rgba(245,242,235,.62);
  line-height:1;
}
.dh-location-split-final .loc-num{
  font-family:var(--f-mono)!important;
  font-size:24px;
  font-weight:800;
  line-height:1;
  color:#EAF2FF;
  direction:ltr;
}
@media(max-width:700px){
  #aurora-modal.aurora-modal-overlay{padding:12px !important;}
  #aurora-modal #aurora-modal-card.aurora-modal-card{
    width:calc(100vw - 24px) !important;
    max-height:calc(100dvh - 24px) !important;
    padding:24px 18px !important;
    border-radius:20px !important;
  }
}

/* FINAL FIX V2: dashboard modal must be attached to body and centered in visible viewport */
body.dh-modal-open{
  overflow:hidden !important;
}
body > #aurora-modal.aurora-modal-overlay,
#aurora-modal.aurora-modal-overlay{
  position:fixed !important;
  top:0 !important;
  left:0 !important;
  right:0 !important;
  bottom:0 !important;
  inset:0 !important;
  width:100vw !important;
  height:100vh !important;
  height:100dvh !important;
  z-index:2147483000 !important;
  display:none !important;
  align-items:center !important;
  justify-content:center !important;
  padding:24px !important;
  overflow:hidden !important;
  box-sizing:border-box !important;
  transform:none !important;
}
body > #aurora-modal.aurora-modal-overlay.open,
#aurora-modal.aurora-modal-overlay.open{
  display:flex !important;
  opacity:1 !important;
  pointer-events:auto !important;
}
body > #aurora-modal #aurora-modal-card.aurora-modal-card,
#aurora-modal #aurora-modal-card.aurora-modal-card{
  position:relative !important;
  top:auto !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  inset:auto !important;
  margin:auto !important;
  width:min(720px, calc(100vw - 48px)) !important;
  max-width:720px !important;
  max-height:calc(100dvh - 48px) !important;
  overflow-y:auto !important;
  overflow-x:hidden !important;
  box-sizing:border-box !important;
  transform:none !important;
  opacity:1 !important;
}
@media(max-width:700px){
  body > #aurora-modal.aurora-modal-overlay,
  #aurora-modal.aurora-modal-overlay{padding:12px !important;}
  body > #aurora-modal #aurora-modal-card.aurora-modal-card,
  #aurora-modal #aurora-modal-card.aurora-modal-card{
    width:calc(100vw - 24px) !important;
    max-height:calc(100dvh - 24px) !important;
    padding:22px 16px !important;
    border-radius:20px !important;
  }
}

/* PATCH: seller code only + linked quantities from sales orders to DL1 */
.sales-dist-seller-select{font-family:var(--f-mono)!important;font-weight:800!important;direction:ltr!important;text-align:center!important;}
.sales-dist-input.sd-sales-order-linked{
  background:#eef8ff!important;
  border-color:#38bdf8!important;
  color:#075985!important;
  font-weight:800!important;
  box-shadow:0 0 0 2px rgba(56,189,248,.10)!important;
}
.sales-dist-input.sd-sales-order-linked:focus{box-shadow:0 0 0 3px rgba(56,189,248,.18)!important;}

/* PATCH: sales-order linked DL1 quantities are editable */
.sales-dist-input.sd-sales-order-linked{
  background:#eef8ff!important;
  border-color:#38bdf8!important;
  color:#075985!important;
  font-weight:800!important;
}
.sales-dist-input.sd-sales-order-linked.sd-manual-override{
  background:#fff7ed!important;
  border-color:#f59e0b!important;
  color:#92400e!important;
}

/* FINAL OVERRIDE V2: DL1 summed sales orders + delete fix */
.sales-dist-input.sd-sales-order-linked{background:#eef8ff!important;border-color:#38bdf8!important;color:#075985!important;font-weight:800!important;}
.sales-dist-input.sd-sales-order-linked.sd-manual-override{background:#fff7ed!important;border-color:#f59e0b!important;color:#92400e!important;}

/* FINAL PATCH: LULU permanent orders linked to DL1 as baskets */
.sales-dist-input.sd-lulu-linked{
  background:#f0fdf4!important;
  border-color:#22c55e!important;
  color:#166534!important;
  font-weight:800!important;
}
.sales-dist-input.sd-sales-order-linked.sd-lulu-linked{
  background:linear-gradient(135deg,#eef8ff 0%,#f0fdf4 100%)!important;
  border-color:#0ea5e9!important;
}

/* FINAL PATCH: precise LULU -> DL1 mapping from duplicated delivery-line headers */
.sales-dist-input.sd-lulu-linked{background:#f0fdf4!important;border-color:#22c55e!important;color:#166534!important;font-weight:800!important;}
.sales-dist-input.sd-sales-order-linked.sd-lulu-linked{background:linear-gradient(135deg,#eef8ff 0%,#f0fdf4 100%)!important;border-color:#0ea5e9!important;}
.sales-dist-input.sd-manual-override{background:#fff7ed!important;border-color:#f59e0b!important;color:#92400e!important;}


/* ═══════════════════════════════════════════════════════
   SALES ROUTE ORDERS — route cards + printable order sheet
═══════════════════════════════════════════════════════ */
.route-orders-page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.route-orders-head-actions{display:flex;gap:8px;flex-wrap:wrap}
.route-orders-kpis{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:16px}
.route-orders-selector-card{margin-bottom:16px}
.route-orders-search-wrap{display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.route-orders-search-wrap input{width:min(320px,70vw)}
.route-orders-check{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text2);cursor:pointer}
.route-orders-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:10px;margin-top:12px}
.route-order-card{border:1px solid var(--border);background:var(--surface);border-radius:14px;padding:14px 12px;text-align:right;cursor:pointer;transition:.18s ease;box-shadow:0 2px 8px rgba(25,20,16,.04);font-family:inherit}
.route-order-card:hover{transform:translateY(-2px);border-color:rgba(212,33,42,.35);box-shadow:0 8px 20px rgba(25,20,16,.08)}
.route-order-card.active{border-color:var(--brand);box-shadow:0 0 0 2px rgba(212,33,42,.12);background:linear-gradient(145deg,#fff,#fff7f7)}
.route-order-card-name{display:block;font-weight:800;color:var(--text);font-size:13px;margin-bottom:8px}
.route-order-card-value{font-family:var(--f-display);font-size:25px;font-weight:800;color:var(--brand);line-height:1}
.route-order-card-unit{font-size:9px;color:var(--text3);margin-inline-start:4px}
.route-order-card-meta{display:block;font-size:10px;color:var(--text3);margin-top:8px}
.route-orders-report-shell{scroll-margin-top:15px}
.route-orders-report-card{overflow:hidden}
.route-orders-report-title{display:flex;justify-content:space-between;align-items:center;gap:14px;background:linear-gradient(120deg,#94141b,#d4212a);color:#fff;padding:18px 20px;margin:-18px -18px 16px;border-radius:var(--r) var(--r) 0 0}
.route-orders-report-title h2{font-size:24px;margin:3px 0 0;color:#fff}
.route-orders-report-eyebrow{font-family:var(--f-mono);font-size:9px;letter-spacing:2px;opacity:.75}
.route-orders-report-date{font-size:11px;opacity:.8;margin-top:4px}
.route-orders-report-totals{display:flex;gap:8px;direction:ltr}
.route-orders-report-totals>div{min-width:78px;text-align:center;border:1px solid rgba(255,255,255,.25);background:rgba(255,255,255,.1);border-radius:10px;padding:8px}
.route-orders-report-totals span{display:block;font-size:18px;font-weight:800}
.route-orders-report-totals small{font-size:9px;opacity:.8}
.route-orders-main-table{min-width:1000px;border-collapse:collapse}
.route-orders-main-table th,.route-orders-main-table td{border:1px solid #d5d1cc;text-align:center;padding:7px 6px;font-size:11px}
.route-orders-main-table thead th{background:#ef1924;color:#fff;font-weight:800;white-space:nowrap}
.route-orders-main-table .route-orders-super-head th{background:#d20f18;font-size:12px}
.route-orders-product-cell{text-align:right!important;min-width:220px;background:#fff}
.route-orders-product-cell strong{display:block;font-size:11px}
.route-orders-product-cell small{display:block;font-family:var(--f-mono);font-size:8px;color:var(--text3);direction:ltr;text-align:right;margin-top:2px}
.route-orders-category-row td{background:#f01b25!important;color:#fff!important;text-align:right!important;font-weight:800;font-size:11px;padding:7px 12px!important}
.route-orders-total-row td{background:#d8d8d8!important;color:#c9151e;font-weight:800}
.route-orders-grand-cell{background:#fff6a9;font-weight:800;color:#9f1017}
.route-orders-lower-grid{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:16px}
.route-orders-source-card{min-width:0}
.route-orders-source-summary{display:grid;gap:12px}
.route-source-line>div:first-child{display:flex;justify-content:space-between;gap:10px;font-size:12px;margin-bottom:5px}
.route-source-line span{font-family:var(--f-mono);color:var(--brand);font-weight:700}
.route-source-bar{height:7px;background:#eee9e4;border-radius:99px;overflow:hidden}
.route-source-bar i{display:block;height:100%;background:linear-gradient(90deg,var(--brand),var(--gold));border-radius:99px}
@media(max-width:1000px){.route-orders-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.route-orders-lower-grid{grid-template-columns:1fr}.route-orders-report-title{align-items:flex-start}.route-orders-report-totals{flex-wrap:wrap}}
@media(max-width:600px){.route-orders-kpis{grid-template-columns:1fr 1fr}.route-orders-cards{grid-template-columns:repeat(2,minmax(0,1fr))}.route-orders-report-title{display:block}.route-orders-report-totals{margin-top:12px}.route-orders-report-totals>div{flex:1}.route-orders-head-actions .btn{flex:1}}
@media print{
  body.route-orders-printing .sidebar,body.route-orders-printing .mobile-toggle,body.route-orders-printing .route-orders-selector-card,body.route-orders-printing .route-orders-kpis,body.route-orders-printing .route-orders-head-actions,body.route-orders-printing .toast{display:none!important}
  body.route-orders-printing .app{display:block!important}
  body.route-orders-printing .main{margin:0!important;padding:0!important;width:100%!important;overflow:visible!important}
  body.route-orders-printing .page{display:none!important}
  body.route-orders-printing #page-sales-route-orders{display:block!important}
  body.route-orders-printing .card{box-shadow:none!important;border:0!important}
  body.route-orders-printing .route-orders-main-table{min-width:0;width:100%}
  body.route-orders-printing .route-orders-main-table th,body.route-orders-printing .route-orders-main-table td{font-size:8px;padding:4px 2px}
  body.route-orders-printing .route-orders-lower-grid{display:block}
  body.route-orders-printing .route-orders-source-card{break-inside:avoid;margin-top:12px}
}

/* HYPER delivery locations for Bag category in Sales Route Orders */
.route-orders-hyper-location-cell{min-width:145px;padding:5px!important}
.route-orders-hyper-location-cell>strong{display:block;color:var(--brand);margin-bottom:4px;font-size:11px}
.route-orders-hyper-location{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:3px 5px;margin-top:3px;border-radius:5px;background:#fff5f5;border:1px solid #ffd9dc;font-size:9px;line-height:1.3}
.route-orders-hyper-location span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.route-orders-hyper-location b{font-family:var(--f-mono);color:var(--brand);direction:ltr;white-space:nowrap}
@media print{
  body.route-orders-printing .route-orders-hyper-location{font-size:7px;padding:2px 3px;margin-top:2px}
}

/* Branch breakdown for every permanent-order source in Sales Route Orders */
.route-orders-source-detail-cell{min-width:150px;padding:5px!important;vertical-align:top}
.route-orders-source-detail-cell>strong{display:block;color:var(--brand);margin-bottom:4px;font-size:11px}
.route-orders-branch-detail{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:3px 5px;margin-top:3px;border-radius:5px;background:#fff5f5;border:1px solid #ffd9dc;font-size:9px;line-height:1.35}
.route-orders-branch-detail span{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:right}
.route-orders-branch-detail b{font-family:var(--f-mono);color:var(--brand);direction:ltr;white-space:nowrap}
@media print{
  body.route-orders-printing .route-orders-source-detail-cell{min-width:95px}
  body.route-orders-printing .route-orders-branch-detail{font-size:6.5px;padding:2px 3px;margin-top:2px}
}

/* Separate printable source sheets for Sales Route Orders */
.route-orders-print-note{
  margin:0 0 14px;
  padding:9px 12px;
  border:1px solid #eadfda;
  border-radius:8px;
  background:#fffaf7;
  color:var(--text2);
  font-size:11px;
}
.route-orders-source-tables{display:grid;gap:18px}
.route-source-sheet{
  border:1px solid #d4cfca;
  border-radius:10px;
  overflow:hidden;
  background:#fff;
  break-inside:avoid;
}
.route-source-sheet-title{
  background:#e3141e;
  color:#fff;
  text-align:center;
  font-size:15px;
  font-weight:800;
  padding:9px 12px;
  letter-spacing:.4px;
}
.route-source-sheet-table{
  width:100%;
  min-width:760px;
  border-collapse:collapse;
  direction:rtl;
}
.route-source-sheet-table th,
.route-source-sheet-table td{
  border:1px solid #2d2d2d;
  padding:6px 5px;
  text-align:center;
  font-size:10px;
  line-height:1.35;
}
.route-source-sheet-table thead th{
  background:#f01822;
  color:#fff;
  font-weight:800;
  white-space:nowrap;
}
.route-source-sheet-table .route-source-desc{
  min-width:220px;
  text-align:right;
}
.route-source-product{text-align:right!important;background:#fff}
.route-source-product strong{display:block;font-size:10px}
.route-source-product small{display:block;margin-top:2px;font-family:var(--f-mono);font-size:7.5px;color:#777;direction:ltr;text-align:right}
.route-source-category td{
  background:#f31b25!important;
  color:#fff!important;
  text-align:right!important;
  font-weight:800;
  padding:6px 10px!important;
}
.route-source-total td{background:#d8d8d8!important;color:#bd1119;font-weight:800}
.route-source-crates{background:#fff4a3;font-weight:800;color:#9f1017}

@media(max-width:900px){
  .route-source-sheet-table{min-width:680px}
}

@media print{
  body.route-orders-printing .route-orders-print-note{display:none!important}
  body.route-orders-printing .route-orders-source-tables{display:block}
  body.route-orders-printing .route-source-sheet{
    margin:0 0 10mm;
    border-radius:0;
    border:1px solid #111;
    break-inside:avoid;
    page-break-inside:avoid;
  }
  body.route-orders-printing .route-source-sheet-title{
    background:#e3141e!important;
    color:#fff!important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
    font-size:11px;
    padding:5px;
  }
  body.route-orders-printing .route-source-sheet-table{
    width:100%!important;
    min-width:0!important;
    table-layout:fixed;
  }
  body.route-orders-printing .route-source-sheet-table th,
  body.route-orders-printing .route-source-sheet-table td{
    font-size:6.5px!important;
    padding:2px 1px!important;
    border-color:#111!important;
    word-break:break-word;
  }
  body.route-orders-printing .route-source-sheet-table .route-source-desc{width:19%;min-width:0}
  body.route-orders-printing .route-source-product strong{font-size:6.5px}
  body.route-orders-printing .route-source-product small{font-size:5.5px}
  body.route-orders-printing .route-source-category td,
  body.route-orders-printing .route-source-sheet-table thead th{
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  body.route-orders-printing .route-orders-lower-grid{break-before:auto}
}

/* Route Orders V3 — print-friendly two-table layout + fixed HYPER branch row */
.route-orders-source-tables{
  grid-template-columns:repeat(2,minmax(0,1fr));
  align-items:start;
}
.route-source-sheet-wide{grid-column:1 / -1}
.route-source-sheet .table-wrap{overflow:auto}
.route-source-sheet-table{min-width:0;table-layout:fixed}
.route-source-sheet-table th:not(.route-source-desc),
.route-source-sheet-table td:not(.route-source-product){word-break:break-word}

@media(max-width:1100px){
  .route-orders-source-tables{grid-template-columns:1fr}
  .route-source-sheet-wide{grid-column:auto}
  .route-source-sheet-table{min-width:720px;table-layout:auto}
}

@media print{
  @page{size:A4 landscape;margin:6mm}
  body.route-orders-printing .route-orders-source-tables{
    display:grid!important;
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:5mm!important;
    align-items:start!important;
  }
  body.route-orders-printing .route-source-sheet{
    width:100%!important;
    margin:0!important;
    break-inside:avoid!important;
    page-break-inside:avoid!important;
  }
  body.route-orders-printing .route-source-sheet-wide{
    grid-column:1 / -1!important;
  }
  body.route-orders-printing .route-source-sheet .table-wrap{
    overflow:visible!important;
  }
  body.route-orders-printing .route-source-sheet-table{
    width:100%!important;
    min-width:0!important;
    table-layout:fixed!important;
  }
  body.route-orders-printing .route-source-sheet-table th,
  body.route-orders-printing .route-source-sheet-table td{
    font-size:6.5px!important;
    line-height:1.15!important;
    padding:2px 1.5px!important;
    white-space:normal!important;
    overflow-wrap:anywhere!important;
  }
  body.route-orders-printing .route-source-sheet-title{
    font-size:10px!important;
    padding:4px 6px!important;
  }
  body.route-orders-printing .route-source-sheet-table .route-source-desc{
    width:25%!important;
    min-width:0!important;
  }
  body.route-orders-printing .route-source-product strong{font-size:6.8px!important}
  body.route-orders-printing .route-source-product small{font-size:5.6px!important}
}

/* HYPER Grade B aggregate row in route orders */
.route-source-sheet-table tr.route-source-grade-b td{
  background:#fff3cd;
  font-weight:700;
}
.route-source-sheet-table tr.route-source-grade-b .route-source-product small{
  color:#9a6700;
}


/* ═══════════════════════════════════════════════════
   SALES — DYNAMIC TRANSFER
═══════════════════════════════════════════════════ */
.dynamic-transfer-page-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.dynamic-transfer-actions{display:flex;gap:8px;flex-wrap:wrap}
.dynamic-transfer-control-card{margin-bottom:14px}
.dynamic-transfer-switches{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap}
.dynamic-transfer-meta{display:grid;grid-template-columns:repeat(4,minmax(105px,1fr));gap:8px;min-width:min(100%,520px)}
.dynamic-transfer-meta>div{border:1px solid var(--border);border-radius:10px;background:var(--surface-2,#fafafa);padding:9px 11px}
.dynamic-transfer-meta span{display:block;font-size:9px;color:var(--text3);margin-bottom:3px}
.dynamic-transfer-meta strong{display:block;font-family:var(--f-mono);font-size:13px;color:var(--ink)}
.dynamic-transfer-route-tabs{display:grid;grid-template-columns:repeat(auto-fill,minmax(125px,1fr));gap:8px}
.dynamic-transfer-route-btn{border:1px solid var(--border);border-radius:10px;background:var(--surface);padding:9px 10px;cursor:pointer;font-family:inherit;color:var(--text2);transition:.16s ease;text-align:center}
.dynamic-transfer-route-btn:hover{border-color:var(--brand);transform:translateY(-1px)}
.dynamic-transfer-route-btn.active{background:var(--brand);border-color:var(--brand);color:#fff;box-shadow:0 7px 18px rgba(212,33,42,.18)}
.dynamic-transfer-route-btn span{display:block;font-size:11px;font-weight:800}
.dynamic-transfer-route-btn small{display:block;font-family:var(--f-mono);font-size:8px;opacity:.72;margin-top:2px;direction:ltr}
.dynamic-transfer-warning{margin:0 0 14px;border:1px solid #f3c96a;background:#fff8df;color:#7d5711;border-radius:10px;padding:10px 13px;font-size:11px}
.dynamic-transfer-grid{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(330px,.7fr);gap:14px;align-items:start}
.dynamic-transfer-preview-wrap{max-height:610px}
.dynamic-transfer-table{min-width:980px}
.dynamic-transfer-table th,.dynamic-transfer-table td{white-space:nowrap;text-align:center}
.dynamic-transfer-table tfoot td{background:#f5f0e9;font-weight:800;color:var(--brand)}
.dynamic-transfer-copy-card{position:sticky;top:14px}
.dynamic-transfer-copy-card textarea{width:100%;min-height:425px;resize:vertical;font-family:var(--f-mono);font-size:10px;line-height:1.55;direction:ltr;text-align:left;white-space:pre;tab-size:4}
.dynamic-transfer-format-note{font-size:9px;color:var(--text3);margin-top:8px;line-height:1.6}
.dt-seller-code{font-family:var(--f-mono);font-weight:800;color:var(--purple)}
@media(max-width:1050px){.dynamic-transfer-grid{grid-template-columns:1fr}.dynamic-transfer-copy-card{position:static}.dynamic-transfer-meta{grid-template-columns:repeat(2,minmax(100px,1fr))}}
@media(max-width:600px){.dynamic-transfer-actions .btn{flex:1}.dynamic-transfer-route-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.dynamic-transfer-meta{width:100%}}

/* Dynamic transfer batch columns */
#page-sales-dynamic-transfer .dt-batch{
  font-family:var(--f-mono);
  direction:ltr;
  font-weight:700;
  color:var(--purple);
}

/* Sales Dynamic Transfer — missing batch warning */
#page-sales-dynamic-transfer .dt-batch-missing{
  color:var(--brand);
  background:rgba(212,33,42,.08);
  font-weight:700;
}


/* ═══ FROZEN SALES ORDERS ═══ */
.frozen-sales-orders-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.fso-header-actions{display:flex;gap:8px;flex-wrap:wrap}
.fso-stats{grid-template-columns:repeat(5,minmax(150px,1fr))}
.fso-filter-card{margin-bottom:16px}
.fso-filter-grid{display:grid;grid-template-columns:2fr repeat(3,minmax(160px,1fr));gap:12px;align-items:end}
.fso-result-meta{font-size:12px;font-weight:700;color:var(--text3);background:var(--bg2);border:1px solid var(--border);border-radius:999px;padding:5px 10px}
.fso-table{min-width:1180px}
.fso-line-row td{background:linear-gradient(90deg,var(--purple-dim),#fff);color:var(--purple);font-weight:800;font-size:12px;padding:8px 12px;border-top:2px solid rgba(124,58,237,.2)}
.fso-line-total td{background:#faf7ff;font-weight:800;border-top:1px solid rgba(124,58,237,.18);border-bottom:2px solid rgba(124,58,237,.18)}
@media(max-width:1100px){.fso-stats{grid-template-columns:repeat(2,minmax(140px,1fr))}.fso-filter-grid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.fso-stats,.fso-filter-grid{grid-template-columns:1fr}.frozen-sales-orders-header{align-items:stretch}.fso-header-actions .btn{flex:1}}

/* Approved frozen sales orders: auto-filled ORDER Box */
#fwh-order-products-body .fwh-order-linked{
  background:rgba(22,163,74,.08);
  border-color:rgba(22,163,74,.28);
  color:var(--green,#168f45);
  font-weight:800;
  cursor:not-allowed;
}


/* Frozen Sales Orders — tabs and route seller assignment */
.fso-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 16px;padding:6px;background:var(--surface,#fff);border:1px solid var(--border);border-radius:14px}
.fso-tab{border:1px solid var(--border);background:var(--bg2,#faf8f5);color:var(--text2);padding:9px 16px;border-radius:10px;font-family:inherit;font-weight:800;cursor:pointer}
.fso-tab.active{background:var(--brand,#d4212a);border-color:var(--brand,#d4212a);color:#fff;box-shadow:0 6px 15px rgba(212,33,42,.18)}
.fso-seller-select{min-width:220px;max-width:320px;padding:7px 10px;font-size:11px;background:#fff;border:1px solid rgba(124,58,237,.28);border-radius:8px}
.fso-seller-group td{background:linear-gradient(90deg,rgba(22,143,69,.12),#fff);font-weight:900;color:var(--green,#168f45);border-top:2px solid rgba(22,143,69,.2)}
.fso-dynamic-panel{text-align:center;padding:55px 20px;min-height:260px}
.fso-placeholder-icon{width:64px;height:64px;display:grid;place-items:center;margin:0 auto 14px;border-radius:18px;background:rgba(124,58,237,.1);color:var(--purple);font-size:34px;font-weight:900}
.fso-dynamic-panel h3{margin:0 0 8px;font-size:22px}.fso-dynamic-panel p{margin:0;color:var(--text3)}
@media(max-width:640px){.fso-tabs{display:grid;grid-template-columns:1fr}.fso-seller-select{min-width:100%;max-width:100%}}

/* Frozen sales orders — seller FEFO dynamic transfer */
.fso-dynamic-panel{text-align:initial;padding:18px;min-height:320px}
.fso-dynamic-head{align-items:flex-start;gap:14px;flex-wrap:wrap}
.fso-dynamic-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.fso-dynamic-actions select{min-width:230px;padding:8px 10px;border:1px solid var(--border);border-radius:9px;background:#fff;font-family:inherit}
.fso-dynamic-note{font-size:11px;color:var(--text3);margin-top:5px}
.fso-dynamic-panel>.fso-result-meta{display:inline-block;margin:10px 0}
.fso-dynamic-table{min-width:1250px}
.fso-dynamic-table th,.fso-dynamic-table td{white-space:nowrap;text-align:center}
.fso-dynamic-copy-block{margin-top:14px}
#fso-dynamic-text{width:100%;min-height:190px;resize:vertical;direction:ltr;text-align:left;font-family:var(--f-mono,monospace);font-size:11px;line-height:1.55;padding:12px;border:1px solid var(--border);border-radius:10px;background:#fbfbfb}
@media(max-width:700px){.fso-dynamic-actions{width:100%}.fso-dynamic-actions select{min-width:100%;flex:1}.fso-dynamic-actions .btn{flex:1}}

/* Frozen sales orders by seller inside Sales Route Orders */
.route-frozen-sellers-title{
  grid-column:1/-1;
  margin:2px 0 -6px;
  padding:10px 14px;
  border-radius:10px;
  background:linear-gradient(120deg,#24114b,#5f2dbd);
  color:#fff;
  font-weight:800;
  font-size:14px;
  text-align:right;
}
.route-frozen-seller-sheet .route-source-sheet-title{
  background:linear-gradient(120deg,#32145f,#7440cf);
}
.route-frozen-seller-meta{
  padding:7px 10px;
  background:#f5f0ff;
  color:#5f2dbd;
  border-top:1px solid #ded3f6;
  font-size:10px;
  font-weight:700;
  text-align:left;
  direction:rtl;
}
@media print{
  body.route-orders-printing .route-frozen-sellers-title{
    break-before:page;
    font-size:9px;
    padding:5px 7px;
    background:#32145f!important;
    -webkit-print-color-adjust:exact;
    print-color-adjust:exact;
  }
  body.route-orders-printing .route-frozen-seller-sheet{
    break-inside:avoid;
  }
  body.route-orders-printing .route-frozen-seller-meta{
    font-size:6px;
    padding:3px 5px;
  }
}

/* Frozen sellers as independent cards inside Sales Route Orders */
.route-orders-seller-divider{flex:0 0 100%;display:flex;align-items:center;gap:10px;margin:8px 0 2px;font-weight:800;color:var(--brand);font-size:12px}
.route-orders-seller-divider:before,.route-orders-seller-divider:after{content:"";height:1px;background:var(--border);flex:1}
.route-order-seller-card{border-style:dashed}
.route-order-seller-card.active{border-style:solid}


/* Final Distribution — same visual table as DL1 / RTN1 */
#page-sales-final-distribution .final-dist-readonly{cursor:default;background:var(--surface-2,#fdfcfa);font-weight:700;color:var(--ink);}
#page-sales-final-distribution .final-dist-readonly:focus{outline:none;box-shadow:none;border-color:var(--border);}
#page-sales-final-distribution .sales-dist-meta input:disabled{opacity:1;color:var(--ink-2);background:var(--surface-2,#fdfcfa);}

/* ═══════════════════════════════════════════════════════
   SALES DISTRIBUTION COLOR THEMES ONLY
   DL1 = Red · RTN1 = Yellow · Final = Blue
   Structure, spacing, logic and values remain unchanged.
═══════════════════════════════════════════════════════ */

/* Shared neutral cells */
#page-sales-dl1 .sales-dist-table,
#page-sales-rtn1 .sales-dist-table,
#page-sales-final-distribution .sales-dist-table{
  background:#ffffff!important;
}
#page-sales-dl1 .sales-dist-table th,
#page-sales-rtn1 .sales-dist-table th,
#page-sales-final-distribution .sales-dist-table th{
  background:#d9d9d9!important;
  color:#111!important;
}
#page-sales-dl1 .sales-dist-table td:not(.sd-qty):not(.sd-fresh):not(.sd-online):not(.sd-internal):not(.sd-distributed):not(.sd-balance),
#page-sales-rtn1 .sales-dist-table td:not(.sd-qty):not(.sd-fresh):not(.sd-online):not(.sd-internal):not(.sd-distributed):not(.sd-balance),
#page-sales-final-distribution .sales-dist-table td:not(.sd-qty):not(.sd-fresh):not(.sd-online):not(.sd-internal):not(.sd-distributed):not(.sd-balance){
  background:#ffffff!important;
}

/* ─── DL1 — RED THEME ─── */
#page-sales-dl1 .sales-dist-table .sd-title-row th,
#page-sales-dl1 .sales-dist-table .sd-cat-row td{
  background:#ff0000!important;
  color:#ffffff!important;
}
#page-sales-dl1 .sales-dist-table .sd-qty,
#page-sales-dl1 .sales-dist-table .sd-distributed,
#page-sales-dl1 .sales-dist-table .sd-balance{
  background:#ff0000!important;
  color:#ffffff!important;
}
#page-sales-dl1 .sales-dist-table .sd-fresh{
  background:#f4a69e!important;
  color:#111!important;
}
#page-sales-dl1 .sales-dist-table .sd-online{
  background:#f4c2c2!important;
  color:#111!important;
}
#page-sales-dl1 .sales-dist-table .sd-internal{
  background:#e2b2ae!important;
  color:#111!important;
}
#page-sales-dl1 .sales-dist-table .sd-total-row td{
  background:#bfbfbf!important;
  color:#ff0000!important;
}
#page-sales-dl1 .sales-dist-table .sd-summary-row td{
  background:#ffffff!important;
  color:#ff0000!important;
}
#page-sales-dl1 .sales-dist-table .sd-summary-row .sd-qty,
#page-sales-dl1 .sales-dist-table .sd-summary-row .sd-distributed,
#page-sales-dl1 .sales-dist-table .sd-summary-row .sd-balance{
  background:#ff0000!important;
  color:#ffffff!important;
}
#page-sales-dl1 .sales-dist-input,
#page-sales-dl1 .sales-dist-num{
  color:inherit!important;
}

/* ─── RTN1 — YELLOW THEME ─── */
#page-sales-rtn1 .sales-dist-table .sd-title-row th,
#page-sales-rtn1 .sales-dist-table .sd-cat-row td{
  background:#fff200!important;
  color:#111!important;
}
#page-sales-rtn1 .sales-dist-table .sd-qty,
#page-sales-rtn1 .sales-dist-table .sd-distributed,
#page-sales-rtn1 .sales-dist-table .sd-balance{
  background:#fff200!important;
  color:#111!important;
}
#page-sales-rtn1 .sales-dist-table .sd-fresh{
  background:#ffe599!important;
  color:#111!important;
}
#page-sales-rtn1 .sales-dist-table .sd-online{
  background:#fce5a5!important;
  color:#111!important;
}
#page-sales-rtn1 .sales-dist-table .sd-internal{
  background:#ffd966!important;
  color:#111!important;
}
#page-sales-rtn1 .sales-dist-table .sd-total-row td{
  background:#bfbfbf!important;
  color:#ff0000!important;
}
#page-sales-rtn1 .sales-dist-table .sd-summary-row td{
  background:#ffffff!important;
  color:#ff0000!important;
}
#page-sales-rtn1 .sales-dist-table .sd-summary-row .sd-qty,
#page-sales-rtn1 .sales-dist-table .sd-summary-row .sd-distributed,
#page-sales-rtn1 .sales-dist-table .sd-summary-row .sd-balance{
  background:#fff200!important;
  color:#111!important;
}
#page-sales-rtn1 .sales-dist-input,
#page-sales-rtn1 .sales-dist-num{
  color:inherit!important;
}

/* ─── FINAL DISTRIBUTION — BLUE THEME ─── */
#page-sales-final-distribution .sales-dist-table .sd-title-row th,
#page-sales-final-distribution .sales-dist-table .sd-cat-row td{
  background:#4285f4!important;
  color:#ffffff!important;
}
#page-sales-final-distribution .sales-dist-table .sd-qty,
#page-sales-final-distribution .sales-dist-table .sd-distributed,
#page-sales-final-distribution .sales-dist-table .sd-balance{
  background:#4285f4!important;
  color:#ffffff!important;
}
#page-sales-final-distribution .sales-dist-table .sd-fresh{
  background:#c9daf8!important;
  color:#111!important;
}
#page-sales-final-distribution .sales-dist-table .sd-online{
  background:#b4c7e7!important;
  color:#111!important;
}
#page-sales-final-distribution .sales-dist-table .sd-internal{
  background:#9fc5e8!important;
  color:#111!important;
}
#page-sales-final-distribution .sales-dist-table .sd-total-row td{
  background:#bfbfbf!important;
  color:#4285f4!important;
}
#page-sales-final-distribution .sales-dist-table .sd-summary-row td{
  background:#ffffff!important;
  color:#4285f4!important;
}
#page-sales-final-distribution .sales-dist-table .sd-summary-row .sd-qty,
#page-sales-final-distribution .sales-dist-table .sd-summary-row .sd-distributed,
#page-sales-final-distribution .sales-dist-table .sd-summary-row .sd-balance{
  background:#4285f4!important;
  color:#ffffff!important;
}
#page-sales-final-distribution .sales-dist-input,
#page-sales-final-distribution .sales-dist-num,
#page-sales-final-distribution .final-dist-readonly{
  color:inherit!important;
  background:transparent!important;
}

/* Keep focused editable cells readable without changing the page palette */
#page-sales-dl1 .sales-dist-input:focus,
#page-sales-rtn1 .sales-dist-input:focus{
  background:#ffffff!important;
  color:#111!important;
}

/* Distribution color accuracy fix — category bands and seller row */
#page-sales-dl1 .sales-dist-table tbody tr.sd-cat-row > td{
  background:#ff0000!important;
  color:#ffffff!important;
}
#page-sales-final-distribution .sales-dist-table tbody tr.sd-cat-row > td{
  background:#4285f4!important;
  color:#ffffff!important;
}
#page-sales-rtn1 .sales-dist-table tbody tr.sd-cat-row > td{
  background:#fff200!important;
  color:#111111!important;
}

/* Seller row follows each page palette; Final mirrors DL1 seller selections */
#page-sales-dl1 .sales-dist-table thead tr.sd-seller-row > th{
  background:#f4c2c2!important;
  color:#111!important;
}
#page-sales-rtn1 .sales-dist-table thead tr.sd-seller-row > th{
  background:#fce5a5!important;
  color:#111!important;
}
#page-sales-final-distribution .sales-dist-table thead tr.sd-seller-row > th{
  background:#c9daf8!important;
  color:#111!important;
}
#page-sales-final-distribution .sales-dist-table thead tr.sd-seller-row > th.sd-qty,
#page-sales-final-distribution .sales-dist-table thead tr.sd-seller-row > th.sd-distributed,
#page-sales-final-distribution .sales-dist-table thead tr.sd-seller-row > th.sd-balance{
  background:#4285f4!important;
  color:#fff!important;
}
#page-sales-final-distribution .sales-dist-table thead tr.sd-seller-row > th.sd-fresh{
  background:#c9daf8!important;
}
#page-sales-final-distribution .sales-dist-table thead tr.sd-seller-row > th.sd-online{
  background:#b4c7e7!important;
}
#page-sales-final-distribution .sales-dist-table thead tr.sd-seller-row > th.sd-internal{
  background:#9fc5e8!important;
}
#page-sales-final-distribution .sales-dist-seller-select:disabled{
  opacity:1!important;
  color:#111!important;
  -webkit-text-fill-color:#111!important;
  background:#fff!important;
  cursor:default!important;
}

/* FINAL HOTFIX — force category labels visible on DL1 / RTN1 / Final */
#page-sales-dl1 table.sales-dist-table tbody > tr.sd-cat-row > td{
  background-color:#ff0000!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
  visibility:visible!important;
  font-size:12px!important;
  font-weight:900!important;
  text-align:right!important;
}
#page-sales-rtn1 table.sales-dist-table tbody > tr.sd-cat-row > td{
  background-color:#fff200!important;
  color:#111111!important;
  -webkit-text-fill-color:#111111!important;
  opacity:1!important;
  visibility:visible!important;
  font-size:12px!important;
  font-weight:900!important;
  text-align:right!important;
}
#page-sales-final-distribution table.sales-dist-table tbody > tr.sd-cat-row > td{
  background-color:#4285f4!important;
  color:#ffffff!important;
  -webkit-text-fill-color:#ffffff!important;
  opacity:1!important;
  visibility:visible!important;
  font-size:12px!important;
  font-weight:900!important;
  text-align:right!important;
}

/* ═══════════════════════════════════════════════
   DASHBOARD — SALES INTELLIGENCE
═══════════════════════════════════════════════ */
.sales-intel-section{position:relative;margin-top:26px;padding:24px;border:1px solid rgba(147,197,253,.18);border-radius:22px;background:linear-gradient(145deg,rgba(13,25,45,.96),rgba(20,15,33,.96));box-shadow:0 24px 70px rgba(0,0,0,.24);overflow:hidden;color:#f7f4ee}
.sales-intel-section:before{content:"";position:absolute;inset:0;pointer-events:none;background:radial-gradient(circle at 86% 8%,rgba(96,165,250,.14),transparent 32%),radial-gradient(circle at 8% 92%,rgba(212,33,42,.11),transparent 34%)}
.sales-intel-section>*{position:relative;z-index:1}
.sales-intel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;flex-wrap:wrap;margin-bottom:20px}
.sales-intel-eyebrow{font:700 9px/1.4 var(--f-mono);letter-spacing:1.8px;color:#93c5fd;text-transform:uppercase;margin-bottom:7px}
.sales-intel-head h2{font:800 24px/1.4 var(--f-display);margin:0;color:#fff}
.sales-intel-head p{margin:5px 0 0;font-size:11px;color:rgba(245,242,235,.54)}
.sales-intel-refresh{display:inline-flex;align-items:center;gap:8px;border:1px solid rgba(147,197,253,.26);background:rgba(147,197,253,.09);color:#dbeafe;border-radius:10px;padding:9px 13px;font-family:inherit;font-size:11px;font-weight:700;cursor:pointer;transition:.2s}
.sales-intel-refresh:hover{background:rgba(147,197,253,.17);transform:translateY(-1px)}
.sales-intel-refresh span{font-size:16px}
.sales-intel-kpis{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:10px;margin-bottom:14px}
.sales-intel-kpi{padding:14px 13px;border:1px solid rgba(255,255,255,.08);border-radius:14px;background:rgba(255,255,255,.035);min-height:102px;display:flex;flex-direction:column;justify-content:center}
.sales-intel-kpi.alert{border-color:rgba(252,165,165,.18);background:rgba(252,165,165,.05)}
.si-kpi-label{font-size:10px;color:rgba(245,242,235,.52);margin-bottom:8px}
.sales-intel-kpi strong{font:800 24px/1 var(--f-serif);color:#fff}
.sales-intel-kpi small{font-size:8px;color:rgba(245,242,235,.38);margin-top:7px}
.sales-intel-kpi.alert strong{color:#fca5a5}
.sales-intel-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.sales-intel-panel{padding:15px;border:1px solid rgba(255,255,255,.07);border-radius:15px;background:rgba(0,0,0,.13);min-height:260px}
.sales-intel-panel-head{display:flex;align-items:center;justify-content:space-between;gap:8px;padding-bottom:11px;margin-bottom:9px;border-bottom:1px solid rgba(255,255,255,.06)}
.sales-intel-panel-head h3{font-size:12px;color:#fff;margin:0}
.sales-intel-panel-head span{font:600 8px/1 var(--f-mono);color:rgba(245,242,235,.35)}
.sales-intel-list{display:flex;flex-direction:column;gap:10px}
.sales-intel-row{display:grid;grid-template-columns:22px 1fr auto;gap:8px;align-items:center}
.sales-intel-rank{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;font:700 9px/1 var(--f-mono);background:rgba(255,255,255,.06);color:rgba(255,255,255,.55)}
.sales-intel-rank.top{background:rgba(212,168,92,.14);color:#f6d38c}
.sales-intel-row-main{min-width:0}
.sales-intel-row-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:5px}
.sales-intel-row-title strong{font-size:9px;color:rgba(255,255,255,.82);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sales-intel-row-title small{font-size:7px;color:rgba(255,255,255,.3);white-space:nowrap}
.sales-intel-track{height:4px;border-radius:999px;background:rgba(255,255,255,.06);overflow:hidden}
.sales-intel-track i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#60a5fa,#c4b5fd)}
.sales-intel-row-value{font:700 9px/1.2 var(--f-mono);color:#bfdbfe;text-align:left}
.sales-intel-row-value small{display:block;font-size:6px;color:rgba(255,255,255,.3);margin-top:3px}
.sales-intel-alerts{display:flex;flex-direction:column;gap:8px}
.sales-intel-alert{display:grid;grid-template-columns:7px 1fr auto;gap:9px;align-items:center;padding:10px;border-radius:10px;background:rgba(255,255,255,.035)}
.sales-intel-alert-dot{width:6px;height:6px;border-radius:50%;background:#93c5fd;box-shadow:0 0 10px currentColor}
.sales-intel-alert.danger .sales-intel-alert-dot{background:#f87171}.sales-intel-alert.warn .sales-intel-alert-dot{background:#fbbf24}.sales-intel-alert.info .sales-intel-alert-dot{background:#60a5fa}.sales-intel-alert.neutral .sales-intel-alert-dot{background:#c4b5fd}
.sales-intel-alert strong{display:block;font-size:9px;color:rgba(255,255,255,.82)}
.sales-intel-alert small{display:block;font-size:7px;color:rgba(255,255,255,.34);margin-top:3px}
.sales-intel-alert b{font:800 15px/1 var(--f-mono);color:#fff}
.sales-intel-ok,.sales-intel-empty{display:grid;place-items:center;min-height:150px;text-align:center;color:rgba(255,255,255,.28);font-size:10px}
.sales-intel-foot{text-align:left;margin-top:12px;font:500 8px/1 var(--f-mono);color:rgba(255,255,255,.28)}
.future-card-active{cursor:pointer;border-color:rgba(96,165,250,.18)!important}
.future-card-active:hover{transform:translateY(-3px);border-color:rgba(96,165,250,.38)!important}
@media(max-width:1250px){.sales-intel-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}.sales-intel-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:700px){.sales-intel-section{padding:16px}.sales-intel-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.sales-intel-grid{grid-template-columns:1fr}.sales-intel-refresh{width:100%;justify-content:center}}

/* Comparison table — keep all nine columns aligned in Fresh/Frozen tabs */
#page-compare table:has(#cmp-body){table-layout:auto!important;width:100%!important}
#page-compare table:has(#cmp-body) thead th,
#page-compare #cmp-body > tr > td{
  display:table-cell!important;
  visibility:visible!important;
  opacity:1!important;
  box-sizing:border-box!important;
  vertical-align:middle!important;
}
#page-compare .cmp-col-type{min-width:72px!important;width:72px!important;text-align:center!important}
#page-compare .cmp-col-code{min-width:130px!important;white-space:nowrap!important;text-align:center!important}
#page-compare .cmp-col-product{min-width:210px!important;text-align:right!important}
#page-compare .cmp-col-category{min-width:150px!important;text-align:center!important}
#page-compare .cmp-col-production,
#page-compare .cmp-col-warehouse,
#page-compare .cmp-col-dynamic,
#page-compare .cmp-col-difference{min-width:95px!important;text-align:center!important}
#page-compare .cmp-col-status{min-width:120px!important;text-align:center!important}
#page-compare #cmp-body .cmp-col-type .badge{display:inline-flex!important;visibility:visible!important;opacity:1!important}

/* ═══════════════════════════════════════════════
   WAREHOUSE — FREEZER PICK (DL1 + RTN1)
═══════════════════════════════════════════════ */
.freezer-pick-page-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap}
.freezer-pick-actions{display:flex;gap:8px;flex-wrap:wrap}
.freezer-pick-route-card{margin-bottom:16px}
.freezer-pick-route-tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(145px,1fr));gap:9px;margin-top:12px}
.freezer-pick-route-tab{border:1px solid var(--border);border-radius:12px;background:#fff;padding:10px 11px;display:flex;flex-direction:column;align-items:flex-start;gap:2px;font-family:inherit;cursor:pointer;transition:.18s ease;color:var(--text)}
.freezer-pick-route-tab:hover{transform:translateY(-2px);border-color:var(--info);box-shadow:0 7px 18px rgba(0,0,0,.06)}
.freezer-pick-route-tab.active{border-color:var(--info);background:rgba(30,64,175,.06);box-shadow:0 0 0 2px rgba(30,64,175,.12)}
.freezer-pick-route-tab strong{font-size:12px}
.freezer-pick-route-tab span{font:800 16px/1.2 var(--f-mono);color:var(--info)}
.freezer-pick-route-tab small{font-size:9px;color:var(--text3)}
.freezer-pick-sheet{max-width:1000px;margin:0 auto;background:#fff}
.freezer-pick-sheet-title{text-align:center;font:800 22px/1.2 var(--f-display);margin-bottom:10px;color:#111}
.freezer-pick-sheet-info{display:flex;justify-content:space-between;gap:24px;margin-bottom:14px;direction:ltr}
.freezer-pick-info-group{display:grid;gap:5px;min-width:280px}
.freezer-pick-info-group>div{display:grid;grid-template-columns:95px 1fr;align-items:center;gap:8px;font-size:12px}
.freezer-pick-info-group span{font-weight:700;color:#333}
.freezer-pick-info-group strong{font-family:var(--f-mono);color:#111}
.freezer-pick-info-group input{border:0;border-bottom:1px solid #888;padding:2px 4px;font:700 12px var(--f-sans);background:transparent}
.freezer-pick-kind{margin-top:12px}
.freezer-pick-kind-title{padding:7px 10px;text-align:center;font-weight:900;border:1px solid #111}
.freezer-pick-dl1 .freezer-pick-kind-title{background:#ef1f28;color:#fff}
.freezer-pick-rtn1 .freezer-pick-kind-title{background:#ffed00;color:#111}
.freezer-pick-category{margin-top:0}
.freezer-pick-category-title{padding:5px 8px;text-align:center;font-weight:800;border:1px solid #111;border-top:0}
.freezer-pick-dl1 .freezer-pick-category-title{background:#f21f28;color:#fff}
.freezer-pick-rtn1 .freezer-pick-category-title{background:#ffed00;color:#111}
.freezer-pick-table{width:100%;border-collapse:collapse;table-layout:fixed;font-size:11px}
.freezer-pick-table th,.freezer-pick-table td{border:1px solid #222;padding:4px 6px;text-align:center;vertical-align:middle}
.freezer-pick-table th{background:#f7f7f7;color:#111;font-weight:800}
.freezer-pick-table th:nth-child(1),.freezer-pick-table td:nth-child(1){width:55px}
.freezer-pick-table th:nth-child(2),.freezer-pick-table td:nth-child(2){width:38%}
.freezer-pick-table th:nth-child(3),.freezer-pick-table td:nth-child(3){width:18%}
.freezer-pick-table th:nth-child(4),.freezer-pick-table td:nth-child(4){width:85px}
.freezer-pick-item strong{display:block;font-size:11px;color:#111}
.freezer-pick-item small{display:block;font:8px var(--f-mono);color:#777}
.freezer-pick-qty{font:800 12px var(--f-mono)}
.freezer-pick-check input{width:17px;height:17px;accent-color:#111}
.freezer-pick-note{width:100%;border:0;background:transparent;font:11px var(--f-sans);padding:2px}
.freezer-pick-total td{font-weight:900;background:#f6f6f6}
.freezer-pick-empty td{height:30px;color:#999;font-size:10px}
@media(max-width:750px){.freezer-pick-sheet-info{flex-direction:column;direction:rtl}.freezer-pick-info-group{min-width:0}.freezer-pick-route-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.freezer-pick-sheet{padding:10px}.freezer-pick-table{min-width:680px}}
@media print{
  body.freezer-pick-printing .sidebar,
  body.freezer-pick-printing .topbar,
  body.freezer-pick-printing .freezer-pick-page-header,
  body.freezer-pick-printing .freezer-pick-route-card,
  body.freezer-pick-printing .toast{display:none!important}
  body.freezer-pick-printing .main{margin:0!important;padding:0!important;width:100%!important}
  body.freezer-pick-printing .page{display:none!important}
  body.freezer-pick-printing #page-freezer-pick{display:block!important}
  body.freezer-pick-printing .freezer-pick-sheet{display:block!important;max-width:none!important;border:0!important;box-shadow:none!important;padding:0!important}
  body.freezer-pick-printing .freezer-pick-table{font-size:8px}
  body.freezer-pick-printing .freezer-pick-table th,
  body.freezer-pick-printing .freezer-pick-table td{padding:2px 4px!important}
  body.freezer-pick-printing .freezer-pick-item small{font-size:6px}
  body.freezer-pick-printing .freezer-pick-note{font-size:8px}
  body.freezer-pick-printing .freezer-pick-category{break-inside:avoid}
  @page{size:A4 portrait;margin:8mm}
}


/* PICKLIST Fresh — Picker from Master Data */
#freezer-pick-picker{min-width:220px;max-width:320px;padding:7px 10px;border:1px solid var(--border);border-radius:7px;background:#fff;font-family:inherit;font-size:12px}
@media print{body.freezer-pick-printing #freezer-pick-picker{appearance:none;border:0;padding:0;background:transparent;font-weight:700}}


/* ═══ ONLINE & INTERNAL SALES SECTION ═══ */
.online-internal-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;flex-wrap:wrap}
.online-internal-placeholder{min-height:340px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:36px;background:linear-gradient(145deg,#fff,#faf7ff)}
.online-internal-placeholder.compact{min-height:250px;padding:28px}
.online-internal-placeholder h3{margin:12px 0 6px;font-size:20px;color:var(--ink)}
.online-internal-placeholder p{margin:0;color:var(--text3);font-size:12px}
.online-internal-icon{width:68px;height:68px;border-radius:20px;display:grid;place-items:center;background:var(--purple-soft);color:var(--purple);font-size:28px;font-weight:900;box-shadow:inset 0 0 0 1px rgba(109,40,217,.12)}
.online-lines-shell{margin-bottom:14px}
.online-lines-tabs{display:grid;grid-template-columns:repeat(6,minmax(120px,1fr));gap:8px;margin-top:12px}
.online-line-tab{border:1px solid var(--border);background:var(--surface);color:var(--text2);border-radius:11px;padding:11px 10px;font-family:inherit;font-size:11px;font-weight:800;cursor:pointer;transition:.18s ease}
.online-line-tab:hover{border-color:var(--purple);transform:translateY(-1px)}
.online-line-tab.active{background:var(--purple);border-color:var(--purple);color:#fff;box-shadow:0 8px 18px rgba(109,40,217,.18)}
.online-line-panel{margin-top:14px}
@media(max-width:1000px){.online-lines-tabs{grid-template-columns:repeat(3,minmax(120px,1fr))}}
@media(max-width:620px){.online-lines-tabs{grid-template-columns:repeat(2,minmax(0,1fr))}.online-internal-placeholder{min-height:260px;padding:24px}}

/* Online & Internal — paste reader and master-data mapping */
.oi-actions{display:flex;gap:8px;flex-wrap:wrap}
.oi-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;margin-bottom:14px}
.oi-layout{display:grid;grid-template-columns:minmax(300px,34%) minmax(0,66%);gap:14px;align-items:start}
.oi-paste-card,.oi-preview-card{min-width:0}
.oi-format-note{font-size:11px;color:var(--text3);margin:4px 0 10px;padding:8px 10px;background:var(--surface2);border:1px dashed var(--border);border-radius:8px}
.oi-paste{width:100%;min-height:430px;resize:vertical;direction:ltr;text-align:left;font-family:var(--f-mono,monospace);font-size:12px;line-height:1.55;padding:12px;border:1px solid var(--border);border-radius:10px;background:#fff}
.oi-paste:focus{outline:none;border-color:var(--brand);box-shadow:0 0 0 3px var(--brand-soft)}
.oi-read-btn{width:100%;margin-top:10px}
.oi-table{min-width:1180px}
.oi-table th,.oi-table td{white-space:nowrap;text-align:center}
.oi-table .tn{text-align:right;white-space:normal;min-width:180px}
.oi-basket{font-weight:900;color:var(--brand);background:var(--brand-soft)}
.oi-unmatched-row td{background:#fff5f5}
.oi-unmatched-row .tn{color:var(--danger)}
@media(max-width:1100px){.oi-layout{grid-template-columns:1fr}.oi-paste{min-height:240px}.oi-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:650px){.oi-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.oi-actions{width:100%}.oi-actions .btn{flex:1}}


/* Online / Internal paste → DL1 linked quantities */
.sales-dist-input.sd-online-internal-linked{
  background:#eef8ff!important;
  border-color:#4aa3df!important;
  color:#0b5f94!important;
  font-weight:800!important;
  box-shadow:inset 0 0 0 1px rgba(74,163,223,.15);
}

/* Online lines — paste, seller and Allocate as per Dynamic */
.online-line-workspace{display:flex;flex-direction:column;gap:14px}
.online-line-toolbar{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:14px;padding:14px 16px}
.online-line-sub{font-size:11px;color:var(--text3);margin-top:4px}
.online-line-seller-label{display:flex;align-items:center;gap:8px;font-size:11px;font-weight:700}
.online-line-seller-label select{min-width:250px;padding:9px 10px;border:1px solid var(--border);border-radius:9px;background:#fff;font-family:inherit}
.online-line-kpis{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:10px}
.online-line-kpis>div{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:11px 12px;text-align:center}
.online-line-kpis span{display:block;font-size:9px;color:var(--text3)}
.online-line-kpis strong{display:block;margin-top:4px;font:800 18px/1.2 var(--f-mono);color:var(--purple)}
.online-line-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:14px}
.online-line-paste-card,.online-line-dynamic-card{min-width:0}
.online-line-actions{display:flex;gap:7px;flex-wrap:wrap}
.online-line-paste,.online-line-dynamic-text{width:100%;margin-top:10px;resize:vertical;border:1px solid var(--border);border-radius:10px;padding:11px;font:11px/1.55 var(--f-mono);direction:ltr;text-align:left;background:#fff}
.online-line-dynamic-text{background:#faf9ff;min-height:230px}
.online-line-meta{font-size:10px;color:var(--text3);margin-top:8px}
.online-line-dynamic-source{font-size:10px;color:var(--purple);background:var(--purple-dim);border-radius:8px;padding:7px 9px;margin:8px 0}
.online-line-preview-card,.online-line-dynamic-preview-card{overflow:hidden}
.online-line-dynamic-preview-card .dynamic-transfer-table{min-width:1120px}
@media(max-width:980px){.online-line-grid{grid-template-columns:1fr}.online-line-kpis{grid-template-columns:repeat(3,minmax(0,1fr))}}
@media(max-width:620px){.online-line-kpis{grid-template-columns:repeat(2,minmax(0,1fr))}.online-line-seller-label{width:100%;align-items:stretch;flex-direction:column}.online-line-seller-label select{min-width:100%}}

/* Dynamic Transfer — CRATE row from Manama through Riffa */
.dynamic-transfer-table .dt-crate-row td{
  background:#fff7d6;
  font-weight:800;
  color:#7a4a00;
  border-top:2px solid #d8a400;
}
.dynamic-transfer-table .dt-crate-row td:nth-child(3){
  color:#b36b00;
}

/* Online lines — print quantities by seller */
.online-lines-print-actions{display:flex;gap:8px;flex-wrap:wrap}
.online-lines-print-area{display:none}
.online-line-print-sheet{background:#fff;color:#111;padding:12px;direction:rtl;break-after:page}
.online-line-print-sheet:last-child{break-after:auto}
.online-line-print-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;border-bottom:2px solid #222;padding-bottom:10px;margin-bottom:12px}
.online-line-print-head h2{margin:0;font-size:22px}
.online-line-print-meta{font-size:11px;color:#666;margin-top:3px}
.online-line-print-summary{display:grid;grid-template-columns:repeat(4,minmax(110px,1fr));gap:8px;min-width:520px}
.online-line-print-summary>div{border:1px solid #ccc;border-radius:6px;padding:7px 8px;text-align:center}
.online-line-print-summary span{display:block;font-size:9px;color:#666}
.online-line-print-summary strong{display:block;font-size:13px;margin-top:3px}
.online-line-print-table{width:100%;border-collapse:collapse;font-size:10px}
.online-line-print-table th,.online-line-print-table td{border:1px solid #bfc3c8;padding:5px 6px;text-align:center}
.online-line-print-table th{background:#eef0f3;font-weight:800}
.online-line-print-table .tn{text-align:right}
.online-line-print-cat td{background:#2f3e5b;color:#fff;font-weight:800;text-align:right}
.online-line-print-total td{background:#f2f2f2;font-weight:800}
.online-line-print-check{font-size:15px}
@media(max-width:700px){.online-lines-print-actions{width:100%}.online-lines-print-actions .btn{flex:1}}
@media print{
  body.online-lines-printing .sidebar,
  body.online-lines-printing .topbar,
  body.online-lines-printing .page:not(#page-online-lines),
  body.online-lines-printing #page-online-lines>*:not(#online-lines-print-area){display:none!important}
  body.online-lines-printing .main{margin:0!important;padding:0!important;width:100%!important}
  body.online-lines-printing #page-online-lines{display:block!important;padding:0!important}
  body.online-lines-printing #online-lines-print-area{display:block!important}
  body.online-lines-printing .online-line-print-sheet{page-break-after:always;break-after:page}
  body.online-lines-printing .online-line-print-sheet:last-child{page-break-after:auto;break-after:auto}
  @page{size:A4 landscape;margin:8mm}
}

/* Compact colored print — Online Lines + Internal Sales */
.compact-color-print{padding:8mm 7mm!important;background:#fff!important;color:#111!important}
.compact-print-head{border-bottom:0!important;margin-bottom:7px!important;padding:0!important;background:linear-gradient(135deg,#6d28d9,#2563eb);color:#fff;border-radius:10px;padding:9px 11px!important}
.compact-print-head h2{font-size:17px!important;color:#fff!important}
.compact-print-head .online-line-print-meta{color:rgba(255,255,255,.82)!important;font-size:9px!important}
.compact-print-summary{grid-template-columns:repeat(3,minmax(95px,1fr))!important;min-width:360px!important;gap:6px!important}
.compact-print-summary>div{border-color:rgba(255,255,255,.28)!important;background:rgba(255,255,255,.12)!important;padding:5px 7px!important}
.compact-print-summary span{color:rgba(255,255,255,.8)!important;font-size:8px!important}
.compact-print-summary strong{color:#fff!important;font-size:11px!important}
.compact-print-table{font-size:9px!important;table-layout:fixed}
.compact-print-table th,.compact-print-table td{padding:3px 5px!important;border-color:#cbd5e1!important}
.compact-print-table th{background:#172554!important;color:#fff!important;font-size:9px!important}
.compact-print-table th:first-child{width:78%;text-align:right!important}
.compact-print-table th:last-child{width:22%}
.compact-print-table .tn{font-weight:700;text-align:right!important}
.compact-basket-cell{font-size:11px!important;font-weight:900!important;color:#111827!important;background:#f8fafc!important}
.compact-print-table .online-line-print-cat td{color:#fff!important;font-weight:900!important;text-align:right!important;padding:4px 7px!important}
.compact-print-table .print-cat-1 td{background:#b91c1c!important}
.compact-print-table .print-cat-2 td{background:#1d4ed8!important}
.compact-print-table .print-cat-3 td{background:#7c3aed!important}
.compact-print-table .print-cat-4 td{background:#0f766e!important}
.compact-print-table .print-cat-5 td{background:#c2410c!important}
.compact-print-table .print-cat-6 td{background:#854d0e!important}
.compact-print-table .print-cat-7 td{background:#475569!important}
.compact-print-table .online-line-print-total td{background:#e2e8f0!important;color:#0f172a!important;font-weight:900!important}
.compact-grand-total td{background:#0f172a!important;color:#fff!important;font-weight:900!important;font-size:10px!important}

@media print{
  body.online-lines-printing .compact-color-print,
  body.internal-sales-printing .compact-color-print{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}

  body.internal-sales-printing .sidebar,
  body.internal-sales-printing .topbar,
  body.internal-sales-printing .page:not(#page-internal-sales),
  body.internal-sales-printing #page-internal-sales>*:not(#internal-sales-print-area){display:none!important}
  body.internal-sales-printing .main{margin:0!important;padding:0!important;width:100%!important}
  body.internal-sales-printing #page-internal-sales{display:block!important;padding:0!important}
  body.internal-sales-printing #internal-sales-print-area{display:block!important}
  body.internal-sales-printing .online-line-print-sheet{page-break-after:auto!important;break-after:auto!important}

  .compact-print-table tr{break-inside:avoid}
  @page{size:A4 portrait;margin:6mm}
}

/* Order sequence paste and print — Online Lines + Internal Sales */
.order-sequence-card{margin-top:14px;grid-column:1/-1}
.order-sequence-help{font-size:10px;color:var(--text3);margin-top:4px}
.order-sequence-actions{display:flex;gap:7px;flex-wrap:wrap}
.order-sequence-paste{width:100%;min-height:180px;resize:vertical;direction:ltr;text-align:left;font-family:var(--f-mono,monospace);font-size:10px;line-height:1.45;padding:10px;border:1px solid var(--border);border-radius:9px;background:#fff;margin-top:10px}
.order-sequence-meta{font-size:10px;color:var(--text3);margin:7px 0}
.order-sequence-preview{min-width:1000px;font-size:10px}
.order-sequence-preview th,.order-sequence-preview td{padding:6px 7px;vertical-align:top;white-space:nowrap}
.order-sequence-preview .tn{min-width:130px}.order-sequence-preview .order-sequence-multiline{white-space:normal;min-width:240px;line-height:1.35}
.order-sequence-print-area{display:none}
.order-sequence-print-sheet{background:#fff;color:#111;padding:6mm;direction:ltr}
.order-sequence-print-title{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:7px;border-bottom:2px solid #dc2626;padding-bottom:6px}
.order-sequence-print-title h2{margin:0;color:#b91c1c;font-size:15px}.order-sequence-print-title span,.order-sequence-print-title strong{display:block;font-size:8px;margin-top:2px}
.order-sequence-print-table{width:100%;border-collapse:collapse;table-layout:fixed;font-family:Arial,sans-serif;font-size:6.2px}
.order-sequence-print-table th,.order-sequence-print-table td{border:.65px solid #555;padding:2.5px 2px;vertical-align:top;text-align:center;overflow-wrap:anywhere}
.order-sequence-print-table th{background:#ef1717!important;color:#fff!important;font-weight:700;font-size:6.2px}
.order-sequence-print-table tbody tr:nth-child(even) td{background:#f1f1f1!important}
.order-sequence-print-table .multiline{white-space:normal;line-height:1.25;text-align:center}
.order-sequence-print-table th:nth-child(1){width:4%}.order-sequence-print-table th:nth-child(2){width:8%}.order-sequence-print-table th:nth-child(3){width:6%}.order-sequence-print-table th:nth-child(4){width:5%}.order-sequence-print-table th:nth-child(5){width:6%}.order-sequence-print-table th:nth-child(6){width:7%}.order-sequence-print-table th:nth-child(7),.order-sequence-print-table th:nth-child(8),.order-sequence-print-table th:nth-child(9){width:3.5%}.order-sequence-print-table th:nth-child(10){width:16%}.order-sequence-print-table th:nth-child(11){width:14%}.order-sequence-print-table th:nth-child(12){width:5%}.order-sequence-print-table th:nth-child(13){width:5%}.order-sequence-print-table th:nth-child(14){width:10%}
@media(max-width:700px){.order-sequence-actions{width:100%}.order-sequence-actions .btn{flex:1}.order-sequence-paste{min-height:140px}}
@media print{
  body.order-sequence-printing{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important;background:#fff!important}
  body.order-sequence-printing .sidebar,body.order-sequence-printing .topbar,body.order-sequence-printing .page{display:none!important}
  body.order-sequence-printing[data-order-print-scope="line"] #page-online-lines,body.order-sequence-printing[data-order-print-scope="internal"] #page-internal-sales{display:block!important;padding:0!important;margin:0!important}
  body.order-sequence-printing[data-order-print-scope="line"] #page-online-lines>*:not(.order-sequence-print-area),body.order-sequence-printing[data-order-print-scope="internal"] #page-internal-sales>*:not(.order-sequence-print-area){display:none!important}
  body.order-sequence-printing .order-sequence-print-area{display:block!important}
  body.order-sequence-printing .main{margin:0!important;padding:0!important;width:100%!important}
  body.order-sequence-printing .order-sequence-print-table thead{display:table-header-group}
  body.order-sequence-printing .order-sequence-print-table tr{break-inside:avoid}
  @page{size:A4 landscape;margin:5mm}
}

/* Order sequence address parsing + clearer print layout */
.order-sequence-print-sheet{padding:4mm 5mm}
.order-sequence-print-title{margin-bottom:5px;padding-bottom:4px}
.order-sequence-print-table{font-size:7px;line-height:1.22}
.order-sequence-print-table th,.order-sequence-print-table td{padding:3px 2.5px;vertical-align:middle}
.order-sequence-print-table th{font-size:7px;line-height:1.15}
.order-sequence-print-table td.multiline{vertical-align:top;line-height:1.32;text-align:left;direction:ltr}
.order-sequence-print-table td.os-details,.order-sequence-print-table td.os-note{direction:rtl;text-align:right}
.order-sequence-print-table td.os-id,.order-sequence-print-table td.os-phone,.order-sequence-print-table td.os-num,.order-sequence-print-table td.os-price{font-family:Arial,sans-serif;font-weight:700;white-space:nowrap}
.order-sequence-print-table td.os-customer,.order-sequence-print-table td.os-area{font-weight:700}
.order-sequence-print-table tbody tr:nth-child(odd) td{background:#fff!important}
.order-sequence-print-table tbody tr:nth-child(even) td{background:#f4f4f4!important}
.order-sequence-print-table tbody tr{page-break-inside:avoid;break-inside:avoid}
.order-sequence-print-table th:nth-child(1){width:4.5%}
.order-sequence-print-table th:nth-child(2){width:8.5%}
.order-sequence-print-table th:nth-child(3){width:6.5%}
.order-sequence-print-table th:nth-child(4){width:4.5%}
.order-sequence-print-table th:nth-child(5){width:5%}
.order-sequence-print-table th:nth-child(6){width:6.5%}
.order-sequence-print-table th:nth-child(7),.order-sequence-print-table th:nth-child(8),.order-sequence-print-table th:nth-child(9){width:3.2%}
.order-sequence-print-table th:nth-child(10){width:18%}
.order-sequence-print-table th:nth-child(11){width:15%}
.order-sequence-print-table th:nth-child(12){width:5%}
.order-sequence-print-table th:nth-child(13){width:4.5%}
.order-sequence-print-table th:nth-child(14){width:9.7%}
@media print{
  body.order-sequence-printing .order-sequence-print-sheet{padding:0}
  body.order-sequence-printing .order-sequence-print-table{font-size:7px}
  body.order-sequence-printing .order-sequence-print-table thead{display:table-header-group}
  @page{size:A4 landscape;margin:4mm}
}


/* Order sequence print — parsed Product Details directly inside column H */
.order-sequence-print-table .os-products{padding:3px!important;vertical-align:top}
.os-product-list{display:flex;flex-direction:column;gap:3px;min-width:145px}
.os-product-item{display:grid;grid-template-columns:minmax(0,1fr) auto auto;gap:5px;align-items:center;padding:3px 5px;border:1px solid #d8e4ef;border-radius:4px;background:#f7fbff;line-height:1.25}
.os-product-item strong{font-size:6.8px;text-align:left;direction:ltr;white-space:normal;overflow-wrap:anywhere}
.os-product-item span{white-space:nowrap;font-size:6.5px;color:#334155}
.os-product-item span b{color:#b91c1c;font-size:7px}
.os-product-item.unmatched{background:#fff1f2;border-color:#fecdd3}
.os-product-item.unmatched small{grid-column:1/-1;color:#b91c1c;font-weight:800;font-size:6px}
.os-product-raw{font-size:6.5px;line-height:1.35;text-align:left;direction:ltr;white-space:normal;overflow-wrap:anywhere}
@media print{
  body.order-sequence-printing .os-product-item{-webkit-print-color-adjust:exact;print-color-adjust:exact;break-inside:avoid}
}


/* Order sequence print v3 — clean area, sorted route, readable layout */
.order-sequence-print-sheet{padding:3mm 4mm!important;background:#fff}
.order-sequence-print-title{background:linear-gradient(135deg,#7f1d1d,#dc2626);color:#fff;border:0!important;border-radius:8px;padding:8px 10px!important;margin-bottom:7px!important}
.order-sequence-print-title h2,.order-sequence-print-title span,.order-sequence-print-title strong{color:#fff!important}
.order-sequence-print-table{font-size:7.2px!important;line-height:1.25!important;table-layout:fixed}
.order-sequence-print-table th{background:#374151!important;color:#fff!important;font-size:6.6px!important;text-transform:uppercase;letter-spacing:.15px;padding:4px 2px!important;vertical-align:middle!important}
.order-sequence-print-table td{padding:4px 3px!important;vertical-align:middle!important}
.order-sequence-print-table tbody tr:nth-child(odd) td{background:#fff!important}
.order-sequence-print-table tbody tr:nth-child(even) td{background:#f3f4f6!important}
.order-sequence-print-table tbody tr{border-bottom:1.2px solid #6b7280!important}
.order-sequence-print-table td.os-area{direction:rtl;text-align:center;font-size:7.4px;line-height:1.3;color:#111827}
.order-sequence-print-table td.os-num{font-size:7.2px;background:#f9fafb!important}
.order-sequence-print-table td.os-products{vertical-align:top!important}
.order-sequence-print-table td.os-details{vertical-align:top!important;font-size:7px;line-height:1.45}
.order-sequence-print-table td.os-note{vertical-align:top!important;font-size:6.8px}
.order-sequence-print-table th:nth-child(1){width:4.5%!important}
.order-sequence-print-table th:nth-child(2){width:7.5%!important}
.order-sequence-print-table th:nth-child(3){width:6.5%!important}
.order-sequence-print-table th:nth-child(4){width:4.5%!important}
.order-sequence-print-table th:nth-child(5){width:4.5%!important}
.order-sequence-print-table th:nth-child(6){width:7.5%!important}
.order-sequence-print-table th:nth-child(7),.order-sequence-print-table th:nth-child(8),.order-sequence-print-table th:nth-child(9){width:3.5%!important}
.order-sequence-print-table th:nth-child(10){width:20%!important}
.order-sequence-print-table th:nth-child(11){width:17%!important}
.order-sequence-print-table th:nth-child(12){width:5%!important}
.order-sequence-print-table th:nth-child(13){width:4.5%!important}
.order-sequence-print-table th:nth-child(14){width:8.5%!important}
.os-product-list{gap:4px!important;min-width:0!important}
.os-product-item{grid-template-columns:minmax(0,1fr) 50px 50px!important;padding:4px 5px!important;border-radius:5px!important;background:#eef6ff!important;border-color:#bfdbfe!important}
.os-product-item strong{font-size:7px!important;line-height:1.25!important}
.os-product-item span{font-size:6.6px!important;text-align:center}
@media print{
  body.order-sequence-printing .order-sequence-print-title,
  body.order-sequence-printing .order-sequence-print-table th,
  body.order-sequence-printing .os-product-item{-webkit-print-color-adjust:exact!important;print-color-adjust:exact!important}
  body.order-sequence-printing .order-sequence-print-table tr{break-inside:avoid-page!important;page-break-inside:avoid!important}
  @page{size:A4 landscape;margin:4mm}
}

/* V5.1.4 order sequence — Flat column after Road */
.order-sequence-print-table th:nth-child(7),
.order-sequence-print-table th:nth-child(8),
.order-sequence-print-table th:nth-child(9),
.order-sequence-print-table th:nth-child(10){width:3.1%!important}
.order-sequence-print-table th:nth-child(11){width:19%!important}
.order-sequence-print-table th:nth-child(12){width:16%!important}
.order-sequence-print-table th:nth-child(13){width:5%!important}
.order-sequence-print-table th:nth-child(14){width:4.5%!important}
.order-sequence-print-table th:nth-child(15){width:8.2%!important}
.order-sequence-print-table td.os-flat{background:#eef2ff!important}

/* Delmon V6.7.0 — Accessibility Foundation */
.sr-only {
  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;
}
.delmon-skip-link {
  position: fixed;
  inset-inline-start: 16px;
  top: -80px;
  z-index: 100000;
  padding: 12px 18px;
  border-radius: 10px;
  background: #fff;
  color: #111827;
  box-shadow: 0 8px 28px rgba(0,0,0,.28);
  font-weight: 700;
  transition: top .18s ease;
}
.delmon-skip-link:focus { top: 16px; }
:where(button, a, input, select, textarea, [tabindex]):focus-visible {
  outline: 3px solid currentColor !important;
  outline-offset: 3px !important;
}
[aria-invalid="true"] { outline: 2px solid #b91c1c !important; }
.delmon-help-shell { margin: 18px; }
.delmon-help-intro { margin-top: 8px; opacity: .82; line-height: 1.8; }
.delmon-help-tips {
  margin: 16px 0;
  padding: 14px 16px;
  border: 1px solid rgba(59,130,246,.3);
  border-radius: 12px;
  background: rgba(59,130,246,.08);
  line-height: 1.8;
}
.delmon-help-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));
  gap: 14px;
}
.delmon-help-card {
  display: flex;
  gap: 12px;
  align-items: flex-start;
  padding: 16px;
  border: 1px solid var(--border, rgba(148,163,184,.25));
  border-radius: 14px;
  background: var(--card, rgba(255,255,255,.04));
}
.delmon-help-card h3 { margin: 0 0 6px; }
.delmon-help-card p { margin: 0 0 12px; opacity: .72; }
.delmon-help-icon { font-size: 26px; line-height: 1; }
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { scroll-behavior: auto !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* V6.8.0 Backup & Recovery Center */
.delmon-backup-actions{display:flex;gap:10px;flex-wrap:wrap;margin:16px 0}.delmon-backup-status,.delmon-backup-import{margin:14px 0}.delmon-backup-import .alert{padding:14px;border-radius:10px}.delmon-backup-import .alert-success{background:#eefbf2;border:1px solid #9bd5aa}.delmon-backup-import .alert-danger{background:#fff0f0;border:1px solid #e0a1a1}

/* ═══════════════════════════════════════════════════════════════
   V8.2.7 — DL1 / RTN1 THREE-ROW FREEZE
   Keep title, delivery-line names and seller row visible while
   scrolling vertically. Horizontal scrolling remains available.
═══════════════════════════════════════════════════════════════ */
#page-sales-dl1 #dl1-table-wrap,
#page-sales-rtn1 #rtn1-table-wrap{
  position:relative;
  max-height:calc(100vh - 190px);
  min-height:260px;
  overflow:auto;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}

#page-sales-dl1 #dl1-table-wrap .sales-dist-table thead,
#page-sales-rtn1 #rtn1-table-wrap .sales-dist-table thead{
  position:sticky;
  top:0;
  z-index:40;
  box-shadow:0 3px 8px rgba(0,0,0,.18);
}

/* Ensure every cell in the frozen three-row header paints an opaque layer. */
#page-sales-dl1 #dl1-table-wrap .sales-dist-table thead > tr > th,
#page-sales-rtn1 #rtn1-table-wrap .sales-dist-table thead > tr > th{
  position:relative;
  z-index:1;
  background-clip:padding-box!important;
}

/* Preserve the existing page palettes while the header is frozen. */
#page-sales-dl1 #dl1-table-wrap .sales-dist-table thead > tr:nth-child(2) > th{
  background:#d9d9d9!important;
  color:#111!important;
}
#page-sales-rtn1 #rtn1-table-wrap .sales-dist-table thead > tr:nth-child(2) > th{
  background:#d9d9d9!important;
  color:#111!important;
}

@media(max-height:700px){
  #page-sales-dl1 #dl1-table-wrap,
  #page-sales-rtn1 #rtn1-table-wrap{
    max-height:calc(100vh - 145px);
  }
}

@media print{
  #page-sales-dl1 #dl1-table-wrap,
  #page-sales-rtn1 #rtn1-table-wrap{
    max-height:none!important;
    overflow:visible!important;
  }
  #page-sales-dl1 #dl1-table-wrap .sales-dist-table thead,
  #page-sales-rtn1 #rtn1-table-wrap .sales-dist-table thead{
    position:static!important;
    box-shadow:none!important;
  }
}