/* Iteration 11: offline font stacks only; no external font dependency. */
:root {
  --font-family: "Cairo", Tahoma, Arial, sans-serif;
  --brand-blue: #2854a3;
  --brand-blue-dark: #183d7c;
  --brand-blue-soft: #edf3ff;
  --brand-green: #348b43;
  --brand-green-dark: #22652f;
  --brand-green-soft: #eaf6ed;
  --ink: #172333;
  --ink-soft: #586779;
  --line: #d8e0e8;
  --surface: #ffffff;
  --surface-soft: #f5f7f9;
  --warning: #926500;
  --warning-soft: #fff5d7;
  --danger: #a12d2d;
  --danger-soft: #fff0f0;
  --shadow: 0 5px 18px rgba(23, 35, 51, .065);
  font-family: var(--font-family);
  color: var(--ink);
  background: #edf1f5;
  line-height: 1.55;
}

* { box-sizing: border-box; }
html { background: #edf1f5; font-family: var(--font-family); }
body {
  margin: 0;
  min-height: 100vh;
  background: linear-gradient(180deg, rgba(40, 84, 163, .035), transparent 240px), #edf1f5;
  font-family: var(--font-family);
  font-weight: 400;
}
body, button, input, select, textarea, table, th, td, a { font-family: var(--font-family); }
a { color: inherit; }
h1, h2, h3, p { margin-top: 0; }
h1, h2, h3 { font-weight: 700; }
button, input, select, textarea { font: inherit; }

/* Mixed RTL/LTR operational values */
.bidi-code, .bidi-phone, .bidi-date, .mixed-spec {
  direction: ltr;
  unicode-bidi: isolate;
  display: inline-block;
  white-space: nowrap;
}
.bidi-code { font-weight: 600; letter-spacing: .015em; }
.bidi-phone, .bidi-date { font-variant-numeric: tabular-nums; }
.mixed-spec { font-weight: inherit; }
.quantity-value {
  display: inline-block;
  direction: ltr;
  unicode-bidi: isolate;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

.topbar {
  min-height: 68px;
  padding: 7px clamp(18px, 3vw, 46px);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
  background: rgba(255, 255, 255, .985);
  border-bottom: 1px solid var(--line);
  box-shadow: 0 2px 10px rgba(23, 35, 51, .035);
  position: sticky;
  top: 0;
  z-index: 20;
}
.brand { display: flex; align-items: center; gap: 12px; text-decoration: none; min-width: 0; }
.brand-logo { width: 86px; height: 46px; object-fit: cover; object-position: center top; border-radius: 5px; flex: 0 0 auto; }
.brand-copy { display: grid; gap: 0; min-width: 0; }
.brand-copy strong { color: var(--brand-blue-dark); font-size: 1rem; font-weight: 700; white-space: nowrap; }
.brand-copy small { color: var(--ink-soft); font-size: .76rem; font-weight: 500; white-space: nowrap; }
.userbox { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; }
.user-name { font-weight: 600; }
.badge { padding: 3px 9px; border-radius: 999px; background: var(--brand-blue-soft); color: var(--brand-blue-dark); font-weight: 600; font-size: .76rem; }
.banko-language-switch {
  display: inline-flex;
  align-items: center;
  gap: 3px;
  padding: 2px 5px;
  border: 1px solid #cdd7e2;
  border-radius: 999px;
  background: #f8fafc;
  white-space: nowrap;
}
.banko-language-switch > span { color: #99a6b5; font-size: .72rem; }
.banko-language-choice {
  min-height: 26px;
  padding: 2px 7px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: #506176;
  font-size: .76rem;
  line-height: 1.2;
  box-shadow: none;
}
.banko-language-choice:hover { background: #edf2f7; color: var(--brand-blue-dark); }
.banko-language-choice.active {
  background: var(--brand-blue);
  color: #fff;
  cursor: default;
}
.sync-indicator {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  color: var(--brand-green-dark);
  font-size: .74rem;
  font-weight: 600;
  padding: 3px 7px;
  border-radius: 999px;
  background: #f6faf7;
  border: 1px solid #dceade;
}
.sync-indicator i { width: 7px; height: 7px; border-radius: 999px; background: var(--brand-green); display: inline-block; }
.sync-indicator[data-state="error"] { color: #8b2f2f; background: #fff4f4; border-color: #efd1d1; }
.sync-indicator[data-state="error"] i { background: #c44747; }
.sync-indicator[data-state="checking"] i { opacity: .55; }
.inline-form { display: inline; }
.link-button { border: 0; background: transparent; color: #536477; cursor: pointer; padding: 4px 5px; text-decoration: none; font-weight: 500; }
.link-button:hover { color: var(--brand-blue-dark); text-decoration: underline; }

.container { width: min(1380px, calc(100% - 36px)); margin: 20px auto 42px; }
.page-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.compact-head { margin-bottom: 14px; }
.page-head h1 { margin: 1px 0 3px; font-size: clamp(1.42rem, 2.1vw, 1.82rem); line-height: 1.35; }
.page-head p { margin: 0; }
.head-actions { display: flex; gap: 8px; flex-wrap: wrap; }
.section-kicker { color: var(--brand-blue); font-weight: 700; font-size: .74rem; }
.muted { color: var(--ink-soft); }
.small { font-size: .8rem; }
.strong { font-weight: 600; }
.order-reference { display: flex; align-items: center; gap: 8px; color: var(--ink-soft); font-size: .82rem; margin-top: 4px; }
.detail-title { margin-bottom: 2px !important; }

.card { background: var(--surface); border: 1px solid var(--line); border-radius: 12px; box-shadow: var(--shadow); }
.container-auth { margin-top: 0; margin-bottom: 0; }
.auth-wrap { min-height: 100vh; display: grid; place-items: center; padding: 24px 0; }
.auth-card { width: min(430px, 100%); padding: 26px 28px; }
.auth-brandmark { display: flex; align-items: center; gap: 12px; padding-bottom: 16px; margin-bottom: 18px; border-bottom: 1px solid #e8edf2; }
.auth-brandmark img { width: 88px; height: 47px; object-fit: cover; object-position: center top; border-radius: 5px; }
.auth-brandmark div { display: grid; gap: 1px; }
.auth-brandmark strong { color: var(--brand-blue-dark); font-weight: 700; }
.auth-brandmark span { color: var(--ink-soft); font-size: .78rem; }
.auth-heading { margin-bottom: 17px; }
.auth-card h1 { margin: 3px 0 3px; font-size: 1.55rem; }
.stack { display: grid; gap: 13px; }
.stack-lg { display: grid; gap: 14px; }

label { display: grid; gap: 6px; font-weight: 600; color: #28384c; font-size: .91rem; }
input, select, textarea {
  width: 100%;
  border: 1px solid #c7d1dc;
  border-radius: 8px;
  padding: 9px 11px;
  min-height: 42px;
  background: #fff;
  color: var(--ink);
  font-weight: 500;
  transition: border-color .15s ease, box-shadow .15s ease;
}
input:focus, select:focus, textarea:focus { outline: none; border-color: var(--brand-blue); box-shadow: 0 0 0 3px rgba(40, 84, 163, .11); }
textarea { resize: vertical; }
.mixed-select { direction: ltr; unicode-bidi: isolate; text-align: right; }
.button, button {
  border-radius: 8px;
  padding: 8px 14px;
  font-weight: 600;
  border: 1px solid transparent;
  cursor: pointer;
  text-decoration: none;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 40px;
  transition: background .12s ease, border-color .12s ease, box-shadow .12s ease;
}
.primary { background: var(--brand-blue); color: #fff; border-color: var(--brand-blue); }
.primary:hover:not(:disabled) { background: var(--brand-blue-dark); border-color: var(--brand-blue-dark); }
.secondary { background: #fff; color: #33455a; border-color: #c8d2dc; }
.secondary:hover { border-color: #8d9eaf; background: #fafbfc; }
button:disabled { opacity: .45; cursor: not-allowed; }
.text-link { color: var(--brand-blue); font-weight: 600; text-decoration: none; }
.text-link:hover { text-decoration: underline; }

.alert { padding: 10px 13px; border-radius: 9px; margin: 0 0 14px; font-size: .9rem; }
.alert.success { background: var(--brand-green-soft); border: 1px solid #b9dfc0; color: #1e6530; }
.alert.danger { background: var(--danger-soft); border: 1px solid #e9bebe; color: #7f2929; }
.alert ul { margin: 0; padding-right: 20px; }
.dev-note { margin-top: 16px; padding: 10px 11px; background: #f7f8fa; border: 1px dashed #d7dce2; border-radius: 8px; font-size: .8rem; }

/* Operation dashboard */
.dashboard-tools { padding: 10px 12px; margin-bottom: 10px; display: flex; align-items: center; justify-content: space-between; gap: 12px; flex-wrap: wrap; }
.search-form { display: flex; align-items: center; gap: 7px; min-width: min(580px, 100%); flex: 1 1 560px; }
.search-label { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.search-form input[type="search"] { max-width: 430px; min-height: 38px; padding-block: 7px; }
.search-form .button, .search-form button { min-height: 38px; }
.clear-search { font-size: .8rem; white-space: nowrap; }
.status-filters { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.filter-chip { display: inline-flex; align-items: center; min-height: 32px; padding: 4px 10px; border-radius: 999px; border: 1px solid #d5dde5; background: #fff; color: #536273; text-decoration: none; font-size: .78rem; font-weight: 600; }
.filter-chip:hover { border-color: #aab5c0; }
.filter-chip.active { color: var(--brand-blue-dark); border-color: #96acd3; background: var(--brand-blue-soft); }
.filter-chip.sent.active { color: #765600; border-color: #e0c673; background: var(--warning-soft); }
.filter-chip.received.active { color: var(--brand-blue-dark); border-color: #9ab0d7; background: var(--brand-blue-soft); }
.filter-chip.loaded.active { color: var(--brand-green-dark); border-color: #a9d5b1; background: var(--brand-green-soft); }

.table-card { overflow: hidden; }
.table-wrap { overflow: auto; }
table { width: 100%; border-collapse: collapse; min-width: 1040px; }
th, td { text-align: right; padding: 10px 11px; border-bottom: 1px solid #e9edf1; vertical-align: middle; }
th { background: #f7f9fb; color: #59697b; font-size: .79rem; font-weight: 700; white-space: nowrap; }
td { font-size: .87rem; }
tbody tr:hover { background: #fafcff; }
.orders-table tbody tr { height: 58px; }
.order-link { color: var(--brand-blue-dark); font-weight: 600; text-decoration: none; }
.order-link:hover { text-decoration: underline; }
.spec { font-weight: 700; color: var(--brand-blue-dark); }
.quantity-cell { font-weight: 700; font-size: .98rem; white-space: nowrap; }
.status { display: inline-flex; align-items: center; border-radius: 999px; padding: 4px 9px; font-size: .75rem; font-weight: 700; white-space: nowrap; border: 1px solid transparent; }
.status.sent { background: var(--warning-soft); color: #765600; border-color: #efd98f; }
.status.received { background: var(--brand-blue-soft); color: var(--brand-blue-dark); border-color: #c4d3ed; }
.status.loaded { background: var(--brand-green-soft); color: var(--brand-green-dark); border-color: #c2dfc8; }
.empty { padding: 28px; text-align: center; color: var(--ink-soft); }

/* Forms */
.form-section { padding: 18px 20px; }
.section-title { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin-bottom: 13px; }
.section-title h2 { margin: 1px 0 0; font-size: 1.06rem; }
.grid { display: grid; gap: 13px; }
.grid.two { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.required { color: #b42318; }
.important-section { border: 2px solid rgba(40, 84, 163, .34); box-shadow: 0 7px 20px rgba(40, 84, 163, .06); }
.critical-note { color: #774f00; background: var(--warning-soft); padding: 4px 8px; border-radius: 999px; font-size: .74rem; font-weight: 700; }
.input-unit { display: flex; align-items: center; border: 1px solid #c7d1dc; border-radius: 8px; overflow: hidden; background: #fff; direction: ltr; }
.input-unit:focus-within { border-color: var(--brand-blue); box-shadow: 0 0 0 3px rgba(40, 84, 163, .11); }
.input-unit input { border: 0; border-radius: 0; box-shadow: none !important; direction: ltr; text-align: left; }
.input-unit span { padding: 0 12px; font-weight: 700; color: var(--brand-blue-dark); background: #f7f9fb; align-self: stretch; display: grid; place-items: center; border-left: 1px solid #dfe5eb; white-space: nowrap; }
.trusted-data-note { margin: 13px 0 0; padding: 9px 11px; border-radius: 7px; background: #f7f9fb; color: #637286; font-size: .79rem; border-right: 3px solid #aeb9c6; }
.form-actions { display: flex; justify-content: flex-start; gap: 8px; }
.send-button { min-width: 170px; }

/* Banko dashboard */
.order-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(330px, 1fr)); gap: 11px; }
.order-card { display: grid; gap: 9px; background: #fff; border: 1px solid var(--line); border-radius: 11px; padding: 14px 15px; color: inherit; text-decoration: none; box-shadow: var(--shadow); transition: border-color .13s ease, box-shadow .13s ease; }
.order-card:hover { border-color: #9faebd; box-shadow: 0 7px 22px rgba(23, 35, 51, .09); }
.order-card.new-order { border-right: 4px solid #d29a00; }
.order-card.received-order { border-right: 4px solid var(--brand-blue); }
.order-card-top { display: flex; justify-content: space-between; gap: 10px; align-items: center; }
.order-ref-small { color: #738091; font-size: .76rem; }
.banko-critical { background: linear-gradient(135deg, #f1f6ff, #fff); border: 1px solid #d6e1f3; border-radius: 9px; padding: 12px 13px; display: flex; justify-content: space-between; align-items: baseline; gap: 14px; }
.big-spec { font-size: 1.55rem; font-weight: 700; color: var(--brand-blue-dark); line-height: 1.25; }
.big-quantity { font-size: 1.45rem; font-weight: 700; color: #17273d; white-space: nowrap; }
.order-core { display: flex; justify-content: space-between; align-items: center; gap: 12px; color: var(--ink-soft); font-size: .84rem; }
.order-core strong { color: var(--ink); font-weight: 600; }
.customer-line { font-weight: 600; }

/* Order details and operational actions */
.load-focus { padding: 19px 22px; margin-bottom: 11px; text-align: center; border: 2px solid rgba(40, 84, 163, .38); background: linear-gradient(180deg, #f6f9ff 0%, #fff 100%); }
.operation-focus { border-width: 1px; }
.eyebrow { color: var(--brand-blue); font-weight: 700; font-size: .78rem; }
.hero-spec { font-size: clamp(2.05rem, 4vw, 3.25rem); font-weight: 700; color: var(--brand-blue-dark); margin: 3px 0 12px; line-height: 1.22; }
.hero-row { display: flex; justify-content: center; gap: clamp(32px, 7vw, 84px); }
.hero-row > div { display: grid; gap: 1px; min-width: 145px; }
.hero-row strong { font-size: 1.3rem; font-weight: 700; }
.hero-quantity { font-size: 1.72rem !important; }
.details-grid { padding: 16px 18px; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px 18px; }
.details-grid > div { display: grid; gap: 2px; padding-bottom: 7px; border-bottom: 1px solid #edf1f4; }
.details-grid > div > span { font-size: .77rem; }
.details-grid > div > strong { font-weight: 600; font-size: .9rem; }
.details-grid .wide { grid-column: 1 / -1; }
.action-panel { margin-top: 11px; border-radius: 11px; padding: 15px 18px; display: flex; justify-content: space-between; align-items: center; gap: 16px; }
.action-panel h2 { margin: 1px 0 3px; font-size: 1.08rem; }
.action-panel p { margin: 0; color: var(--ink-soft); font-size: .84rem; }
.receive-panel { background: #fff; border: 1px solid var(--line); box-shadow: var(--shadow); }
.large { font-size: .96rem; padding: 9px 21px; min-width: 175px; }
.receipt-stamp { display: flex; justify-content: space-between; gap: 14px; align-items: center; }
.load-panel { display: block; background: #fff; border: 2px solid rgba(52, 139, 67, .34); box-shadow: 0 6px 20px rgba(52, 139, 67, .06); }
.compact-load-panel { padding: 15px 17px; }
.load-panel-head { margin-bottom: 9px; }
.load-check-grid { display: grid; grid-template-columns: 1.4fr .85fr 1fr; gap: 8px; margin: 9px 0 11px; }
.load-check-grid > div { background: #f7faf8; border: 1px solid #d9e8dc; border-radius: 8px; padding: 10px 11px; display: grid; gap: 1px; }
.load-check-grid span { color: #637269; font-size: .75rem; font-weight: 600; }
.load-check-grid strong { font-size: 1.16rem; font-weight: 700; color: #163e22; }
.load-confirm-form { border-top: 1px solid #e6ece7; padding-top: 11px; display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 12px; }
.confirm-check { grid-template-columns: auto 1fr; align-items: center; gap: 8px; font-size: .84rem; }
.confirm-check input { width: 19px; height: 19px; min-height: 0; margin: 0; accent-color: var(--brand-green); }
.load-button { background: var(--brand-green); border-color: var(--brand-green); font-size: .94rem; min-height: 43px; min-width: 220px; }
.load-button:hover:not(:disabled) { background: var(--brand-green-dark); border-color: var(--brand-green-dark); }
.loaded-panel { margin-top: 11px; padding: 15px 17px; border-radius: 11px; background: var(--brand-green-soft); border: 1px solid #b8dfc0; display: flex; align-items: center; gap: 13px; color: #1d5d2b; }
.loaded-panel h2 { margin: 1px 0 2px; color: #1d5d2b; font-size: 1.08rem; }
.loaded-panel p { margin: 0; font-size: .84rem; }
.loaded-icon { width: 42px; height: 42px; border-radius: 999px; display: grid; place-items: center; background: var(--brand-green); color: #fff; font-size: 1.35rem; font-weight: 700; flex: 0 0 auto; }

/* Print view: browser-generated headers/footers remain controlled by the print dialog. */
.print-page { background: #e8edf2; padding: 18px; }
.print-toolbar { width: min(900px, 100%); margin: 0 auto 9px; display: flex; gap: 7px; justify-content: flex-start; align-items: center; flex-wrap: wrap; }
.print-browser-note { flex: 1 1 100%; margin: 2px 0 0; padding: 8px 10px; background: #fff6d8; border: 1px solid #ead58a; border-radius: 7px; color: #725400; font-size: .78rem; }
.print-sheet { width: min(900px, 100%); margin: 0 auto; background: #fff; padding: 22px 24px; border: 1px solid #cfd6df; box-shadow: var(--shadow); }
.print-header { display: grid; grid-template-columns: 145px 1fr auto; align-items: center; gap: 15px; padding-bottom: 12px; border-bottom: 3px solid var(--brand-blue); }
.print-header img { width: 132px; max-height: 70px; object-fit: cover; object-position: center top; }
.print-brand-copy { display: grid; gap: 1px; }
.print-brand-copy > strong { color: var(--brand-blue-dark); font-size: .96rem; font-weight: 700; }
.print-header h1 { margin: 0; font-size: 1.34rem; color: var(--ink); }
.print-header p { margin: 1px 0 0; color: var(--ink-soft); font-size: .78rem; }
.print-order-no { display: grid; gap: 2px; text-align: left; }
.print-order-no span { color: var(--ink-soft); font-size: .74rem; }
.print-order-no strong { font-size: .92rem; }
.print-info-table { min-width: 0; margin-top: 12px; border: 1px solid #b8c1cb; table-layout: fixed; }
.print-info-table th, .print-info-table td { border: 1px solid #c2c9d1; padding: 7px 8px; font-size: .79rem; }
.print-info-table th { width: 16%; background: #f4f6f8; color: #29394e; font-weight: 700; }
.print-info-table td { width: 34%; font-weight: 500; }
.print-info-table.compact { margin-top: 11px; }
.print-critical { margin: 12px 0; display: grid; grid-template-columns: 1.5fr 1fr; gap: 9px; }
.print-critical > div { border: 2px solid var(--brand-blue); padding: 11px; display: grid; gap: 1px; text-align: center; }
.print-critical span { color: var(--ink-soft); font-weight: 600; font-size: .78rem; }
.print-critical strong { font-size: 1.55rem; font-weight: 700; color: var(--brand-blue-dark); }
.print-trust-note { margin-top: 10px; font-size: .7rem; color: #687587; border-right: 3px solid #aab4c0; padding: 5px 8px; background: #f7f8fa; }
.print-footer { margin-top: 13px; padding-top: 8px; border-top: 1px solid #cfd6df; text-align: center; color: #667385; font-size: .7rem; }

@media (max-width: 920px) {
  .details-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .dashboard-tools { align-items: stretch; }
  .status-filters { width: 100%; }
}

@media (max-width: 760px) {
  .topbar { align-items: flex-start; flex-direction: column; padding: 9px 14px; }
  .userbox { width: 100%; }
  .brand-logo { width: 76px; height: 41px; }
  .brand-copy strong, .brand-copy small { white-space: normal; }
  .container { width: min(100% - 20px, 1380px); margin-top: 14px; }
  .page-head { align-items: stretch; flex-direction: column; }
  .page-head .button { align-self: flex-start; }
  .grid.two, .details-grid, .load-check-grid { grid-template-columns: 1fr; }
  .details-grid .wide { grid-column: auto; }
  .hero-row { gap: 20px; }
  .action-panel { align-items: stretch; flex-direction: column; }
  .action-panel form, .action-panel button { width: 100%; }
  .load-confirm-form { grid-template-columns: 1fr; }
  .banko-critical { align-items: flex-start; flex-direction: column; }
  .search-form { min-width: 100%; flex-wrap: wrap; }
  .search-form input[type="search"] { max-width: none; flex: 1 1 100%; }
  .print-page { padding: 7px; }
  .print-sheet { padding: 14px; }
  .print-header { grid-template-columns: 1fr; text-align: center; }
  .print-header img { margin: auto; }
  .print-order-no { text-align: center; }
  .print-critical { grid-template-columns: 1fr; }
}

@media print {
  @page {
    size: A4 portrait;
    margin: 9mm 10mm;
  }
  html, body { width: 210mm; min-height: auto; background: #fff !important; font-family: var(--font-family) !important; }
  body { margin: 0 !important; }
  .print-hide, .topbar, .print-toolbar { display: none !important; }
  .print-page { padding: 0 !important; }
  .print-sheet { width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; border: 0 !important; box-shadow: none !important; }
  .print-header, .print-critical, .print-info-table, .print-footer, .print-trust-note { break-inside: avoid; page-break-inside: avoid; }
  .print-header { padding-bottom: 9px; }
  .print-info-table { margin-top: 9px; }
  .print-info-table th, .print-info-table td { padding: 5.5px 6px; font-size: 8.9pt; }
  .print-critical { margin: 9px 0; }
  .print-critical > div { padding: 8px; }
  .print-critical strong { font-size: 16pt; }
  .print-trust-note { margin-top: 7px; }
  .print-footer { margin-top: 9px; }
  .status { background: transparent !important; border-width: 1px !important; }
}

/* Iteration 4 — operational safety/data integrity additions */
.status.cancelled,
.filter-chip.cancelled.active {
  background: #fde8e8;
  color: #9f1d1d;
  border-color: #efb5b5;
}

.review-dialog {
  width: min(760px, calc(100vw - 32px));
  border: 0;
  border-radius: 18px;
  padding: 0;
  box-shadow: 0 24px 70px rgb(0 0 0 / 24%);
}
.review-dialog::backdrop { background: rgb(18 28 34 / 56%); }
.review-modal-head { padding: 22px 24px 12px; border-bottom: 1px solid var(--border); }
.review-modal-head h2 { margin: 4px 0 6px; }
.review-grid {
  padding: 18px 24px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.review-grid > div { border: 1px solid var(--border); border-radius: 12px; padding: 12px 14px; background: #fff; }
.review-grid > div > span { display: block; color: var(--muted); font-size: .82rem; margin-bottom: 5px; }
.review-grid > div > strong { display: block; font-size: 1.05rem; }
.review-grid .review-critical { border: 2px solid #173e4d; background: #f1f7f9; }
.review-grid .review-critical strong { font-size: 1.65rem; font-weight: 700; }
.review-grid .wide { grid-column: 1 / -1; }
.review-ack { margin: 0 24px 6px; padding: 11px 13px; border-radius: 10px; background: #eef7f1; font-weight: 700; }
.review-dialog .form-actions { padding: 16px 24px 22px; margin: 0; }

.inline-master { margin-top: 12px; border-top: 1px dashed var(--border); padding-top: 10px; }
.inline-master summary { cursor: pointer; color: var(--accent, #15516a); font-weight: 700; }
.driver-change-card { padding-top: 14px; padding-bottom: 14px; }
.driver-change-card .section-title { margin-bottom: 10px; }
.master-fields { margin-top: 12px; }
.stack-sm { display: grid; gap: 10px; }
.compact-focus { margin-bottom: 12px; }

.cancel-card { display: grid; grid-template-columns: 1fr 1.4fr; gap: 18px; align-items: end; border-color: #edc1c1; }
.cancel-card h2 { margin: 4px 0; }
.cancel-form { display: grid; grid-template-columns: 1fr auto; gap: 10px; align-items: end; }
.danger-button { background: #a52525; color: #fff; border: 0; border-radius: 10px; padding: 11px 16px; font: inherit; font-weight: 700; cursor: pointer; }
.danger-button:hover { background: #861d1d; }

.audit-card { margin-top: 14px; }
.audit-list { list-style: none; padding: 0; margin: 0; display: grid; }
.audit-list li { display: grid; grid-template-columns: 185px 1fr; gap: 14px; padding: 11px 0; border-bottom: 1px solid var(--border); align-items: start; }
.audit-list li:last-child { border-bottom: 0; }
.audit-list time { direction: ltr; unicode-bidi: isolate; white-space: nowrap; color: var(--muted); font-size: .86rem; }
.audit-list li div { display: grid; gap: 2px; }

.superseded-banner { background: #a52525; color: #fff; font-size: 1.05rem; font-weight: 700; text-align: center; padding: 8px 12px; margin: -1px -1px 10px; }
.superseded-print { border: 2px solid #a52525; }

@media (max-width: 760px) {
  .review-grid { grid-template-columns: 1fr; }
  .review-grid .wide { grid-column: auto; }
  .cancel-card { grid-template-columns: 1fr; }
  .cancel-form { grid-template-columns: 1fr; }
  .audit-list li { grid-template-columns: 1fr; gap: 3px; }
}
.alert.warning { background: #fff7dc; color: #6f5200; border-color: #ead38a; }

/* Iteration 6: small role-scoped settings surfaces */
.settings-link { color: var(--brand-blue-dark); font-size: .82rem; font-weight: 700; text-decoration: none; padding: 5px 8px; border-radius: 7px; }
.settings-link:hover { background: var(--brand-blue-soft); }
.settings-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; margin-bottom: 14px; }
.settings-section { padding: 18px 20px; margin-bottom: 14px; }
.settings-add-form { display: grid; grid-template-columns: minmax(0, 1.4fr) minmax(0, 1fr) auto; gap: 10px; align-items: end; margin-bottom: 16px; }
.settings-table { width: 100%; border-collapse: collapse; font-size: .86rem; }
.settings-table th, .settings-table td { padding: 9px 10px; border-bottom: 1px solid var(--line); text-align: right; vertical-align: middle; }
.settings-table th { color: var(--ink-soft); font-weight: 700; background: #f8fafc; }
.master-state { display: inline-flex; padding: 3px 8px; border-radius: 999px; font-size: .74rem; font-weight: 700; }
.master-state.active { color: var(--brand-green-dark); background: var(--brand-green-soft); }
.master-state.inactive { color: #7b3030; background: #fbeaea; }
.assignment-actions { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.driver-change-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 10px; align-items: end; }

@media (max-width: 820px) {
  .settings-grid { grid-template-columns: 1fr; }
  .settings-add-form { grid-template-columns: 1fr; }
  .assignment-actions { align-items: stretch; flex-direction: column-reverse; }
  .driver-change-row { grid-template-columns: 1fr; }
}

/* Iteration 7 — split-load workflow and unambiguous numeric entry */
[data-decimal-input],
input[inputmode="decimal"] {
  direction: ltr;
  unicode-bidi: isolate;
  text-align: left;
  font-variant-numeric: tabular-nums;
}
.field-hint { color: var(--ink-soft); font-size: .76rem; font-weight: 500; }
.row-actions { display: flex; align-items: center; gap: 9px; flex-wrap: wrap; white-space: nowrap; }
.group-note { margin: 0 0 12px; padding: 8px 11px; border: 1px solid #cfdbea; border-radius: 8px; background: #f6f9fd; color: #3d526c; font-size: .83rem; }
.split-start-actions { margin-top: -2px; }
.split-panel { padding: 18px 20px; }
.split-summary { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-bottom: 15px; }
.split-summary > div { border: 1px solid var(--line); border-radius: 9px; padding: 10px 12px; background: #f8fafc; display: grid; gap: 2px; }
.split-summary span { color: var(--ink-soft); font-size: .77rem; font-weight: 600; }
.split-summary strong { font-size: 1.08rem; font-weight: 700; }
.split-summary strong[data-state="ok"] { color: var(--brand-green-dark); }
.split-summary strong[data-state="error"] { color: var(--danger); }
.split-loads { display: grid; gap: 8px; }
.split-load-row { display: grid; grid-template-columns: 105px minmax(180px, 280px) auto; gap: 10px; align-items: center; padding: 9px 10px; border: 1px solid #e0e6ec; border-radius: 9px; background: #fff; }
.split-load-label { font-weight: 700; color: var(--brand-blue-dark); }
.compact-button { min-height: 36px; padding: 6px 10px; }
.split-actions { display: flex; justify-content: space-between; align-items: center; gap: 10px; margin-top: 14px; }

@media (max-width: 760px) {
  .split-summary { grid-template-columns: 1fr; }
  .split-load-row { grid-template-columns: 1fr; }
  .split-actions { align-items: stretch; flex-direction: column; }
  .split-actions .button, .split-actions button { width: 100%; }
}

/* Iteration 8 - pre-release overflow and responsive hardening */
.container > *, .card, .page-head > *, .topbar > *, .brand, .brand-copy, .userbox,
.settings-grid > *, .account-grid > *, .field-grid > *, .critical-grid > *, .assignment-grid > * {
  min-width: 0;
}
.brand-copy strong, .brand-copy small, .user-name, .alert, .muted, .event-text,
.detail-list dd, .settings-table td, .settings-table th, .orders-table td, .orders-table th,
.print-info-table td, .print-info-table th, label, p, h1, h2, h3 {
  overflow-wrap: anywhere;
}
.orders-table, .settings-table { width: 100%; }
.orders-table { table-layout: auto; min-width: 980px; }
.settings-table { table-layout: auto; min-width: 560px; }
.orders-table td, .orders-table th, .settings-table td, .settings-table th { vertical-align: middle; }
.order-link, .bidi-code, .bidi-phone, .bidi-date, .quantity-value { max-width: 100%; }
.row-actions, .head-actions, .userbox, .user-admin-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.row-actions a, .user-admin-actions summary, .user-admin-actions button { white-space: nowrap; }
.user-name { max-width: 220px; }
.settings-link, .link-button { white-space: nowrap; }
.error-card { max-width: 720px; margin: 48px auto; text-align: center; padding: clamp(24px, 4vw, 44px); }
.error-icon { width: 56px; height: 56px; border-radius: 50%; display: grid; place-items: center; margin: 0 auto 14px; background: var(--danger-soft); color: var(--danger); font-size: 30px; font-weight: 700; }
.error-card .head-actions { justify-content: center; margin-top: 22px; }
.account-grid { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 18px; }
.compact-list { margin: 0; }
.compact-list > div { display: grid; grid-template-columns: minmax(110px, .35fr) minmax(0, 1fr); gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line); }
.compact-list dt { color: var(--ink-soft); font-weight: 600; }
.compact-list dd { margin: 0; font-weight: 600; }
.admin-create-user { margin-bottom: 18px; }
.admin-user-form { grid-template-columns: repeat(5, minmax(140px, 1fr)); align-items: end; }
.users-table { min-width: 980px; }
.user-admin-actions { align-items: flex-start; }
.user-admin-actions details { position: relative; }
.user-admin-actions summary { cursor: pointer; color: var(--brand-blue-dark); font-weight: 600; }
.mini-admin-form { margin-top: 8px; min-width: 250px; padding: 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--surface-soft); display: grid; gap: 9px; }
.danger-link { color: var(--danger) !important; }
.print-sheet, .print-sheet * { overflow-wrap: anywhere; }
.print-order-no strong { max-width: 220px; overflow-wrap: anywhere; }

@media (max-width: 900px) {
  .topbar { align-items: flex-start; flex-direction: column; }
  .userbox { width: 100%; }
  .account-grid { grid-template-columns: 1fr; }
  .admin-user-form { grid-template-columns: 1fr 1fr; }
  .page-head { align-items: flex-start; }
}
@media (max-width: 620px) {
  .admin-user-form { grid-template-columns: 1fr; }
  .brand-logo { width: 72px; height: 40px; }
  .user-name { max-width: 100%; }
}

/* Iteration 9 — institutional archive + broad RTL/responsive hardening */
html, body { max-width: 100%; overflow-x: clip; }
.topbar, .brand, .brand-copy, .userbox, .container, .page-head, .head-actions,
.card, .grid, .details-grid, .settings-grid, .settings-section, .table-card,
.table-wrap, .audit-list li, .audit-list li > *, .report-section-grid,
.report-section, .archive-filter-card, .archive-results, .review-grid > div,
.load-focus, .hero-row, .action-panel, .loaded-panel { min-width: 0; }

.card, .alert, .group-note, .report-definition-grid dd, .report-definition-grid dt,
.audit-list strong, .audit-list span, td, .wrap-text, .prewrap-text, .brand-copy,
.user-name, .section-title, .page-head > div, .customer-total-list span {
  overflow-wrap: anywhere;
  word-break: normal;
}
.prewrap-text { white-space: pre-wrap; }
.head-actions, .row-actions, .user-admin-actions, .settings-add-form, .action-panel { flex-wrap: wrap; }
.table-wrap { width: 100%; max-width: 100%; overflow-x: auto; overscroll-behavior-inline: contain; }
td { max-width: 420px; }
.orders-table td, .settings-table td, .archive-table td { white-space: normal; }
.bidi-code, .bidi-phone, .bidi-date, .quantity-value, .mixed-spec { max-width: 100%; }
select { max-width: 100%; }
option { font-family: var(--font-family); }
.review-dialog { max-width: calc(100vw - 24px); }
.review-dialog, dialog { overflow-wrap: anywhere; }

.archive-filter-card { padding: 15px; margin-bottom: 13px; }
.archive-filters {
  display: grid;
  grid-template-columns: repeat(4, minmax(160px, 1fr));
  gap: 11px 12px;
  align-items: end;
}
.archive-filters label { min-width: 0; }
.archive-filter-actions { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }

.report-summary-grid {
  display: grid;
  grid-template-columns: repeat(6, minmax(0, 1fr));
  gap: 10px;
  margin-bottom: 13px;
}
.report-metric { padding: 13px 14px; display: grid; gap: 3px; border-top: 3px solid #aab6c3; }
.report-metric span { color: var(--ink-soft); font-size: .77rem; font-weight: 600; }
.report-metric strong { font-size: 1.28rem; color: var(--ink); font-weight: 700; }
.report-metric.loaded { border-top-color: var(--brand-green); }
.report-metric.received { border-top-color: var(--brand-blue); }
.report-metric.sent { border-top-color: #c49618; }
.report-metric.cancelled { border-top-color: var(--danger); }

.report-customer-summary { padding: 14px 16px; margin-bottom: 13px; }
.customer-total-list { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 7px 14px; }
.customer-total-list > div { display: flex; justify-content: space-between; gap: 8px; min-width: 0; padding: 7px 0; border-bottom: 1px solid #edf0f3; }
.customer-total-list strong { direction: ltr; unicode-bidi: isolate; white-space: nowrap; color: var(--brand-blue-dark); }

.archive-results-head { display: flex; justify-content: space-between; align-items: end; gap: 12px; padding: 14px 16px 7px; }
.archive-table { min-width: 980px; table-layout: fixed; }
.archive-table th:nth-child(1) { width: 15%; }
.archive-table th:nth-child(2) { width: 13%; }
.archive-table th:nth-child(3) { width: 17%; }
.archive-table th:nth-child(4) { width: 14%; }
.archive-table th:nth-child(5) { width: 9%; }
.archive-table th:nth-child(6) { width: 14%; }
.archive-table th:nth-child(7) { width: 10%; }
.archive-table th:nth-child(8) { width: 8%; }
.compact-button { min-height: 34px; padding: 5px 9px; font-size: .78rem; }
.pagination { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 10px; padding: 12px 15px; border-top: 1px solid var(--line); }
.pagination > :last-child { justify-self: end; }
.pagination > span { color: var(--ink-soft); font-size: .82rem; }

.report-section-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; margin-bottom: 12px; }
.report-section { padding: 16px; }
.report-section .section-title { margin-bottom: 11px; }
.report-definition-grid { margin: 0; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; }
.report-definition-grid > div { min-width: 0; border: 1px solid #e3e8ed; border-radius: 9px; padding: 9px 10px; background: #fafbfd; }
.report-definition-grid > div.wide { grid-column: 1 / -1; }
.report-definition-grid dt { color: var(--ink-soft); font-size: .76rem; font-weight: 600; margin-bottom: 2px; }
.report-definition-grid dd { margin: 0; font-weight: 600; }
.report-notes { margin-bottom: 12px; }
.report-notes p { margin-bottom: 0; }
.cancel-reason { margin-top: 10px !important; padding: 9px 10px; background: var(--danger-soft); border-radius: 8px; color: #7f2929; }
.report-timeline .audit-list li { grid-template-columns: minmax(150px, 185px) minmax(0, 1fr); }
.report-critical-card .hero-spec { overflow-wrap: anywhere; }
.group-summary-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.group-orders-table { min-width: 940px; }

/* Keep operational tables compact on desktop, while allowing deliberate scrolling on tablet. */
@media (max-width: 1180px) {
  .archive-filters { grid-template-columns: repeat(3, minmax(150px, 1fr)); }
  .report-summary-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .customer-total-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 900px) {
  .archive-filters { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .report-section-grid { grid-template-columns: 1fr; }
  .report-definition-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .archive-results-head { align-items: flex-start; flex-direction: column; }
}

@media (max-width: 680px) {
  html, body { overflow-x: hidden; }
  .brand-copy strong, .brand-copy small { white-space: normal; }
  .userbox { align-items: flex-start; }
  .archive-filters { grid-template-columns: 1fr; }
  .report-summary-grid, .group-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .customer-total-list { grid-template-columns: 1fr; }
  .report-definition-grid { grid-template-columns: 1fr; }
  .report-definition-grid > div.wide { grid-column: auto; }
  .report-timeline .audit-list li { grid-template-columns: 1fr; }
  .pagination { grid-template-columns: 1fr 1fr; }
  .pagination > span { grid-column: 1 / -1; grid-row: 1; text-align: center; }
  .pagination > :first-child { grid-column: 1; }
  .pagination > :last-child { grid-column: 2; }
}

/* Iteration 10 responsive closure: keep settings cards contained at 1366px and
   deliberate archive table scrolling inside its own wrapper on tablet widths. */
.settings-section, .archive-results { overflow: hidden; }
.settings-section > .table-wrap, .archive-results > .table-wrap { max-width: 100%; }
.settings-add-form > *, .customer-settings-add > * { min-width: 0; }
@media (max-width: 1380px) {
  .settings-table { min-width: 540px; }
}
@media (max-width: 820px) {
  .settings-table { min-width: 520px; }
}
@media (max-width: 560px) {
  .settings-table { min-width: 480px; }
}

/* Iteration 10 — operation-assigned mixer, customer location and QR hardening */
.operation-load-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.customer-location-grid > *, .operation-load-grid > *, .split-load-row > *,
.customer-location-cell, .inline-location-form, .report-location-block,
.print-location-block, .location-qr { min-width: 0; }
.wrap-anywhere, .customer-location-cell, .inline-location-form input,
.print-location-text, .report-location-block a {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.customer-location-cell { min-width: 260px; }
.inline-location-form { display: grid; grid-template-columns: minmax(220px, 1fr) auto; gap: 7px; align-items: center; margin-top: 7px; }
.inline-location-form input { width: 100%; }
.customer-settings-add { grid-template-columns: repeat(3, minmax(0, 1fr)) auto; }
.operation-vehicle-add { grid-template-columns: minmax(220px, 1.4fr) minmax(180px, .8fr) auto; }
.settings-inline-input { width: 100%; min-width: 0; }
.compact-input-unit { min-width: 150px; }
.settings-row-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.vehicle-settings-table td:first-child { min-width: 180px; }
.vehicle-settings-table td:nth-child(2) { min-width: 170px; }
.settings-location-field { min-width: 0; }

.split-load-row {
  grid-template-columns: 82px minmax(135px, 190px) minmax(210px, 1fr) minmax(210px, 1fr) auto;
  align-items: end;
}
.split-vehicle-field, .split-driver-field { margin: 0; min-width: 0; }
.split-vehicle-field > span, .split-driver-field > span { display: block; margin-bottom: 4px; font-size: .78rem; color: var(--ink-soft); font-weight: 600; }
.split-vehicle-field select, .split-driver-field select { width: 100%; }
.optional-assignment-grid { margin-top: 12px; }

.report-location-block { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 14px; align-items: center; }
.location-qr { display: grid; justify-items: center; gap: 4px; text-align: center; }
.location-qr img { width: 112px; height: 112px; object-fit: contain; background: #fff; padding: 4px; border: 1px solid #dfe5ea; border-radius: 8px; }
.location-qr span { font-size: .68rem; color: var(--ink-soft); font-weight: 600; max-width: 130px; }
.compact-qr img { width: 96px; height: 96px; }

.print-location-block { display: grid; grid-template-columns: minmax(0, 1fr) 105px; gap: 10px; align-items: center; }
.print-location-text { direction: ltr; unicode-bidi: isolate; text-align: left; font-size: .78rem; line-height: 1.45; }
.print-location-block .location-qr img { width: 92px; height: 92px; padding: 2px; border-radius: 4px; }
.print-location-block .location-qr span { font-size: .58rem; max-width: 100px; }
.driver-assignment-card { border-inline-start: 4px solid var(--brand-blue); }
.driver-stamp { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; }

@media (max-width: 1180px) {
  .operation-load-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .customer-settings-add { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .customer-settings-add button { justify-self: start; }
  .operation-vehicle-add { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .operation-vehicle-add button { justify-self: start; }
}

@media (max-width: 900px) {
  .split-load-row { grid-template-columns: 74px minmax(120px, 170px) minmax(180px, 1fr) minmax(180px, 1fr); }
  .split-load-row .compact-button { grid-column: 4; justify-self: end; }
  .report-location-block { grid-template-columns: 1fr; }
  .location-qr { justify-items: start; text-align: start; }
}

@media (max-width: 680px) {
  .operation-load-grid, .customer-settings-add, .operation-vehicle-add { grid-template-columns: 1fr; }
  .split-load-row { grid-template-columns: 1fr; align-items: stretch; }
  .split-load-row .compact-button { grid-column: auto; justify-self: start; }
  .inline-location-form { grid-template-columns: 1fr; }
  .customer-location-cell { min-width: 220px; }
  .print-location-block { grid-template-columns: minmax(0, 1fr) 92px; }
}

@media print {
  .print-location-block { break-inside: avoid; page-break-inside: avoid; }
  .print-location-text { overflow-wrap: anywhere; word-break: break-word; }
}

/* Iteration 10 final document split: customer delivery note vs internal report. */
.customer-delivery-sheet { max-width: 900px; }
.customer-delivery-header { grid-template-columns: 145px minmax(0, 1fr) minmax(190px, auto); }
.customer-delivery-header .print-brand-copy p { display: none; }
.delivery-section { margin-top: 12px; min-width: 0; }
.delivery-section h2 { margin: 0 0 6px; font-size: .9rem; color: var(--brand-blue-dark); }
.delivery-info-table { margin-top: 0; }
.delivery-location-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 130px;
  gap: 14px;
  align-items: center;
  border: 1px solid #d9e1e8;
  border-radius: 10px;
  padding: 11px 12px;
  background: #fafbfd;
  min-width: 0;
}
.delivery-location-copy { display: grid; gap: 3px; min-width: 0; }
.delivery-location-copy strong { font-size: .9rem; color: var(--ink); }
.delivery-location-copy span { color: var(--ink-soft); font-size: .76rem; }
.delivery-qr img { width: 108px; height: 108px; }
.delivery-critical { margin-top: 12px; }
.customer-receipt-signature {
  margin-top: 18px;
  padding-top: 14px;
  border-top: 1px solid #cfd6df;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}
.customer-receipt-signature > div { display: grid; gap: 12px; min-width: 0; }
.customer-receipt-signature span { color: var(--ink-soft); font-size: .78rem; font-weight: 600; }
.customer-receipt-signature strong { font-weight: 500; letter-spacing: .02em; white-space: nowrap; }
.customer-delivery-footer { margin-top: 20px; }

.internal-audit-section { margin-top: 14px; border-top: 2px solid #d7dee6; padding-top: 10px; }
.internal-audit-section h2 { margin: 0 0 8px; font-size: .95rem; color: var(--brand-blue-dark); }
.internal-audit-list { margin: 0; padding: 0; list-style: none; display: grid; gap: 5px; }
.internal-audit-list li {
  display: grid;
  grid-template-columns: 150px minmax(0, 1fr);
  gap: 9px;
  align-items: start;
  padding: 6px 8px;
  border: 1px solid #e4e8ed;
  border-radius: 7px;
  background: #fafbfd;
  min-width: 0;
  break-inside: avoid;
  page-break-inside: avoid;
}
.internal-audit-list time { color: var(--ink-soft); font-size: .68rem; }
.internal-audit-list div { min-width: 0; display: grid; gap: 2px; }
.internal-audit-list strong { font-size: .74rem; overflow-wrap: anywhere; }
.internal-audit-list span { color: var(--ink-soft); font-size: .64rem; overflow-wrap: anywhere; }
.delivery-unavailable-note { font-size: .78rem; color: var(--ink-soft); margin: 0; max-width: 330px; }
.button.disabled, .button[aria-disabled="true"] { opacity: .58; pointer-events: none; cursor: not-allowed; }

@media (max-width: 760px) {
  .customer-delivery-header { grid-template-columns: 1fr; }
  .delivery-location-card { grid-template-columns: 1fr; }
  .delivery-qr { justify-items: center; text-align: center; }
  .customer-receipt-signature { grid-template-columns: 1fr; }
  .internal-audit-list li { grid-template-columns: 1fr; }
}

@media print {
  .customer-delivery-sheet .print-info-table,
  .customer-delivery-sheet .print-critical,
  .customer-delivery-sheet .delivery-section,
  .customer-delivery-sheet .customer-receipt-signature,
  .delivery-location-card { break-inside: avoid; page-break-inside: avoid; }
  .customer-delivery-sheet .delivery-section { margin-top: 8px; }
  .customer-delivery-sheet .delivery-section h2 { margin-bottom: 4px; font-size: 9pt; }
  .customer-delivery-sheet .delivery-location-card { padding: 7px 8px; gap: 8px; }
  .customer-delivery-sheet .delivery-qr img { width: 92px; height: 92px; }
  .customer-receipt-signature { margin-top: 11px; padding-top: 9px; gap: 12px; }
  .customer-delivery-footer { margin-top: 12px; }
}

@media print {
  /* A4's printable CSS width can fall below the tablet breakpoint. Keep the
     customer delivery note compact and single-sheet oriented in print media. */
  .customer-delivery-header {
    grid-template-columns: 120px minmax(0, 1fr) minmax(165px, auto) !important;
    text-align: start !important;
    gap: 10px;
  }
  .customer-delivery-header img { width: 110px; max-height: 58px; margin: 0 !important; }
  .customer-delivery-header .print-order-no { text-align: left !important; }
  .customer-receipt-signature { grid-template-columns: repeat(3, minmax(0, 1fr)) !important; }
  .customer-receipt-signature > div { gap: 8px; }
  .customer-delivery-sheet .print-critical { grid-template-columns: 1.5fr 1fr !important; }
  .customer-delivery-sheet .print-header h1 { font-size: 15pt; }
}

/* Iteration 10 Fixed3 — final UI / print polish */
.container { margin-top: 16px; margin-bottom: 32px; }
.page-head { margin-bottom: 12px; }
.card, .alert, .workflow-card, .banko-load-card { min-width: 0; }
.page-head h1 { letter-spacing: 0; }
.section-title { gap: 10px; }

/* Banko order: compact data hierarchy and explicit three-stage workflow. */
.banko-page-head { align-items: center; }
.banko-delivery-note { margin: -4px 0 10px; max-width: none; }
.banko-load-card { padding: 14px 16px; margin-bottom: 10px; }
.banko-load-card-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-bottom: 9px; border-bottom: 1px solid var(--line); }
.banko-load-card-head > * { min-width: 0; }
.banko-load-card-head h2 { margin: 1px 0 0; font-size: 1rem; }
.banko-critical-strip { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(145px, .75fr) minmax(150px, .8fr); gap: 8px; padding: 10px 0; }
.banko-critical-strip > div { min-width: 0; border: 1px solid #d7e1ef; border-radius: 9px; background: #f8fbff; padding: 9px 11px; display: grid; gap: 1px; }
.banko-critical-strip span, .banko-info-grid span { color: var(--ink-soft); font-size: .73rem; font-weight: 600; }
.banko-critical-strip strong { color: var(--brand-blue-dark); font-size: 1.18rem; font-weight: 700; overflow-wrap: anywhere; }
.banko-critical-strip .banko-critical-main strong { font-size: clamp(1.45rem, 2.3vw, 2rem); line-height: 1.25; }
.banko-info-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 16px; border-top: 1px solid #edf1f4; }
.banko-info-grid > div { min-width: 0; display: grid; gap: 1px; padding: 8px 0; border-bottom: 1px solid #edf1f4; }
.banko-info-grid strong { font-size: .88rem; font-weight: 600; overflow-wrap: anywhere; }
.banko-info-grid .banko-info-wide { grid-column: span 3; }

.banko-workflow { display: grid; gap: 7px; margin-top: 10px; }
.workflow-card { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 11px; padding: 11px 13px; border: 1px solid var(--line); border-radius: 10px; background: #fff; box-shadow: 0 2px 9px rgba(23, 35, 51, .035); }
.workflow-card h2 { margin: 1px 0 2px; font-size: 1rem; }
.workflow-card p { margin: 0; color: var(--ink-soft); font-size: .8rem; }
.workflow-body { min-width: 0; display: grid; gap: 1px; }
.workflow-body > strong { font-size: .88rem; }
.workflow-body > span:not(.section-kicker) { color: var(--ink-soft); font-size: .77rem; overflow-wrap: anywhere; }
.workflow-step-no, .workflow-check { width: 30px; height: 30px; display: grid; place-items: center; border-radius: 50%; font-size: .84rem; font-weight: 700; flex: 0 0 auto; }
.workflow-step-no { color: var(--brand-blue-dark); background: var(--brand-blue-soft); border: 1px solid #bbcae3; }
.workflow-check { color: #fff; background: var(--brand-green); }
.workflow-card-active { border-color: #b9c9e2; border-inline-start: 4px solid var(--brand-blue); }
.banko-detail-workflow .workflow-card-correction { grid-template-columns: minmax(0, 1fr); }
.workflow-card-pending { padding-block: 8px; background: #f8fafc; box-shadow: none; color: #6b7787; }
.workflow-card-pending .workflow-step-no { background: #eef1f4; color: #7b8795; border-color: #d9dfe5; }
.workflow-card-complete { padding-block: 8px; background: #f5fbf6; border-color: #cce2d0; box-shadow: none; }
.workflow-card-loaded { border-color: #9dcea5; }
.workflow-action { margin: 0; }
.workflow-driver-body, .workflow-load-body { grid-column: 2 / -1; }
.driver-inline-form { display: grid; grid-template-columns: minmax(240px, 1fr) auto; gap: 9px; align-items: end; margin-top: 7px; }
.driver-inline-form label { margin: 0; }
.driver-inline-form select { min-height: 40px; }
.driver-change-compact { grid-column: 3; min-width: min(330px, 100%); }
.driver-change-compact summary { cursor: pointer; color: var(--brand-blue-dark); font-size: .78rem; font-weight: 700; text-align: left; }
.compact-driver-form { margin-top: 8px; grid-template-columns: minmax(190px, 1fr) auto; }
.banko-load-check-grid { margin: 7px 0 8px; }
.banko-load-confirm-form { padding-top: 9px; }
.load-enable-hint { display: block; margin-top: 4px; color: #8a6412; font-size: .72rem; font-weight: 600; }
.load-enable-hint[data-state="ready"] { color: var(--brand-green-dark); }
.compact-audit-card { margin-top: 10px; padding: 12px 14px; }
.compact-audit-card .section-title { margin-bottom: 2px; }
.compact-audit-card .audit-list li { padding: 7px 0; gap: 10px; }

/* Broad day-to-day density polish without changing the visual identity. */
.settings-section { padding: 15px 17px; }
.split-panel { padding: 15px 17px; }
.auth-card { padding: 23px 25px; }
.report-section { padding: 14px; }
.audit-card { margin-top: 11px; }
.details-grid { padding: 14px 16px; gap: 9px 16px; }
.dashboard-tools { margin-bottom: 9px; }
.error-card { margin-top: 34px; }

/* Internal report PDF: compact audit table; never force the whole timeline to a new page. */
.internal-report-sheet { font-size: .88rem; }
.internal-report-header { grid-template-columns: 120px minmax(0, 1fr) minmax(150px, auto); gap: 10px; padding-bottom: 7px; }
.internal-report-header img { width: 108px; max-height: 58px; }
.internal-report-header h1 { font-size: 1.15rem; }
.internal-summary-table, .internal-execution-table { margin-top: 7px; }
.internal-location-compact { display: flex; justify-content: space-between; align-items: center; gap: 10px; min-width: 0; }
.internal-location-compact > span { color: var(--ink-soft); font-size: .72rem; }
.internal-location-qr { flex: 0 0 auto; }
.internal-location-qr img { width: 66px; height: 66px; padding: 2px; }
.internal-location-qr span { font-size: .55rem; }
.internal-critical { margin: 7px 0; }
.internal-critical > div { padding: 6px 8px; }
.internal-critical strong { font-size: 1.28rem; }
.internal-audit-section { margin-top: 8px; padding-top: 6px; border-top-width: 1px; }
.internal-audit-section h2 { margin-bottom: 4px; font-size: .84rem; }
.internal-audit-table { width: 100%; min-width: 0; table-layout: fixed; border-collapse: collapse; margin: 0; font-size: .68rem; }
.internal-audit-table th, .internal-audit-table td { padding: 3px 5px; border: 1px solid #dfe5eb; vertical-align: top; overflow-wrap: anywhere; }
.internal-audit-table th { background: #f4f6f8; color: #48586a; font-size: .64rem; white-space: nowrap; }
.internal-audit-table th:nth-child(1), .internal-audit-table td:nth-child(1) { width: 29%; white-space: nowrap; overflow-wrap: normal; word-break: normal; }
.internal-audit-table th:nth-child(2), .internal-audit-table td:nth-child(2) { width: 15%; }
.internal-audit-table th:nth-child(3), .internal-audit-table td:nth-child(3) { width: 47%; }
.internal-audit-table th:nth-child(4), .internal-audit-table td:nth-child(4) { width: 9%; text-align: center; }
.internal-audit-table tbody tr { break-inside: avoid; page-break-inside: avoid; }
.internal-audit-table thead { display: table-header-group; }
.internal-report-footer { margin-top: 6px; padding-top: 5px; }

/* Customer delivery note: compact professional one-page layout. */
.customer-delivery-sheet { font-size: .9rem; }
.customer-delivery-header { padding-bottom: 8px; gap: 10px; }
.customer-delivery-header h1 { font-size: 1.22rem; }
.customer-delivery-sheet .delivery-section { margin-top: 8px; }
.customer-delivery-sheet .delivery-section h2 { margin-bottom: 4px; font-size: .84rem; }
.delivery-location-compact { padding: 7px 9px; grid-template-columns: minmax(0, 1fr) 100px; gap: 8px; }
.delivery-location-compact .delivery-qr img { width: 82px; height: 82px; padding: 2px; }
.delivery-location-compact .delivery-qr span { font-size: .55rem; max-width: 92px; }
.delivery-critical { margin: 8px 0; }
.customer-delivery-sheet .print-info-table th, .customer-delivery-sheet .print-info-table td { padding: 5px 6px; }
.customer-receipt-signature { margin-top: 12px; padding-top: 9px; gap: 12px; }
.customer-delivery-footer { margin-top: 10px; }

@media (max-width: 1100px) {
  .banko-info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .banko-info-grid .banko-info-wide { grid-column: span 2; }
  .banko-critical-strip { grid-template-columns: 1.4fr .8fr .9fr; }
  .workflow-card { grid-template-columns: 34px minmax(0, 1fr); }
  .workflow-action, .driver-change-compact { grid-column: 2; justify-self: start; }
  .workflow-driver-body, .workflow-load-body { grid-column: 2; }
}

@media (max-width: 820px) {
  .banko-critical-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .banko-critical-main { grid-column: 1 / -1; }
  .banko-info-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .driver-inline-form, .compact-driver-form { grid-template-columns: minmax(0, 1fr) auto; }
}

@media (max-width: 620px) {
  .banko-load-card { padding: 12px; }
  .banko-load-card-head { align-items: flex-start; }
  .banko-critical-strip, .banko-info-grid { grid-template-columns: 1fr; }
  .banko-info-grid .banko-info-wide, .banko-critical-main { grid-column: auto; }
  .workflow-card { grid-template-columns: 30px minmax(0, 1fr); padding: 10px; }
  .workflow-action, .driver-change-compact { grid-column: 1 / -1; width: 100%; }
  .workflow-action button { width: 100%; }
  .workflow-driver-body, .workflow-load-body { grid-column: 1 / -1; }
  .driver-inline-form, .compact-driver-form { grid-template-columns: 1fr; }
  .banko-load-confirm-form { grid-template-columns: 1fr; }
}

@media print {
  .internal-report-sheet .print-header { padding-bottom: 6px; }
  .internal-report-sheet .print-info-table { margin-top: 6px; }
  .internal-report-sheet .print-info-table th,
  .internal-report-sheet .print-info-table td { padding: 3.5px 4.5px; font-size: 7.5pt; line-height: 1.32; }
  .internal-report-sheet .print-critical { margin: 6px 0; }
  .internal-report-sheet .print-critical > div { padding: 5px 6px; }
  .internal-report-sheet .print-critical strong { font-size: 13pt; }
  .internal-report-sheet .internal-audit-section { break-inside: auto; page-break-inside: auto; }
  .internal-report-sheet .internal-audit-table { break-inside: auto; page-break-inside: auto; font-size: 6.6pt; }
  .internal-report-sheet .internal-audit-table tr { break-inside: avoid; page-break-inside: avoid; }
  .internal-report-sheet .internal-audit-table th,
  .internal-report-sheet .internal-audit-table td { padding: 2.5px 4px; line-height: 1.28; }
  .internal-report-sheet .internal-location-qr img { width: 58px; height: 58px; }
  .internal-report-sheet .print-footer { margin-top: 5px; padding-top: 4px; font-size: 6.5pt; }

  .customer-delivery-sheet .print-header { padding-bottom: 7px; }
  .customer-delivery-sheet .delivery-section { margin-top: 6px; }
  .customer-delivery-sheet .delivery-location-card { padding: 6px 8px; }
  .customer-delivery-sheet .delivery-location-compact .delivery-qr img { width: 76px; height: 76px; }
  .customer-delivery-sheet .print-critical { margin: 6px 0; }
  .customer-delivery-sheet .print-info-table th,
  .customer-delivery-sheet .print-info-table td { padding: 4px 5px; font-size: 8.1pt; line-height: 1.35; }
  .customer-delivery-sheet .customer-receipt-signature { margin-top: 8px; padding-top: 7px; }
  .customer-delivery-sheet .print-footer { margin-top: 7px; padding-top: 5px; }
}

@media print {
  /* Keep the customer-facing delivery note visually balanced across the A4 sheet.
     min-height is deliberate (not fixed): long historical data may still expand naturally. */
  .customer-delivery-sheet {
    min-height: 258mm !important;
    display: flex !important;
    flex-direction: column;
  }
  .customer-delivery-sheet .customer-receipt-signature { margin-top: auto !important; }
  .customer-delivery-sheet .customer-delivery-footer { margin-top: 8px !important; }
}

/* Iteration 10 Fixed4 — physical printing belongs to Operations/Admin. */
.print-ready-label {
  display: inline-flex;
  align-items: center;
  gap: 4px;
  margin-top: 3px;
  padding: 2px 7px;
  border-radius: 999px;
  background: var(--brand-green-soft);
  border: 1px solid #b9dfc0;
  color: var(--brand-green-dark);
  font-size: .72rem;
  font-weight: 700;
  white-space: nowrap;
}
.compact-print-action {
  min-height: 32px;
  padding: 4px 9px;
  font-size: .74rem;
  white-space: nowrap;
}
.print-ready-banner { margin-bottom: 10px; }
.banko-print-handoff { margin-bottom: 10px; }

.print-view-toolbar {
  width: min(210mm, calc(100% - 20px));
  margin: 0 auto 10px;
  padding: 9px 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
  background: #fff;
  border: 1px solid var(--line);
  border-radius: 9px;
  box-shadow: var(--shadow);
}
.print-view-toolbar span {
  color: var(--ink-soft);
  font-size: .76rem;
  margin-inline-start: 2px;
}

@media (max-width: 760px) {
  .print-view-toolbar { width: calc(100% - 14px); }
  .print-view-toolbar span { flex-basis: 100%; }
}

@media print {
  .no-print { display: none !important; }
}

/* Iteration 10 Fixed6 — final factory workflow + lightweight UI polish.
   The workflow stays simple: concrete order -> Banko load -> Operations exit data. */
.operation-form-shell {
  width: min(1160px, 100%);
  margin-inline: auto;
  gap: 12px;
}
.operation-form-card {
  padding: 15px 17px;
  transition: border-color .18s ease, box-shadow .18s ease, transform .18s ease;
}
.operation-form-card:hover {
  border-color: #c8d3df;
  box-shadow: 0 7px 22px rgba(23, 35, 51, .075);
}
.operation-form-card .section-title { margin-bottom: 10px; }
.operation-form-card label { min-width: 0; gap: 5px; }
.operation-form-card input,
.operation-form-card select,
.operation-form-card textarea,
.exit-data-form input { min-height: 46px; }
.operation-form-card textarea { min-height: 82px; }
.compact-form-grid { gap: 10px 13px; }
.operation-concrete-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px 13px;
}
.field-hint { color: var(--ink-soft); font-size: .72rem; font-weight: 500; line-height: 1.45; }
.operation-form-shell .form-actions { padding-inline: 2px; }
.operation-form-shell .send-button { min-width: 210px; }

/* Searchable pour/spec selector; native select remains in the form as the source of truth. */
.smart-select-native {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  opacity: 0 !important;
  pointer-events: none !important;
  margin: 0 !important;
  padding: 0 !important;
}
.smart-select { position: relative; min-width: 0; width: 100%; font-weight: 500; }
.smart-select-trigger {
  width: 100%;
  min-height: 46px;
  padding: 8px 12px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  border: 1px solid #c7d1dc;
  border-radius: 9px;
  background: #fff;
  color: var(--ink);
  text-align: start;
  font-weight: 500;
  overflow: hidden;
  transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}
.smart-select-trigger::after {
  content: "⌄";
  color: #6b7887;
  font-size: .92rem;
  flex: 0 0 auto;
  transform: translateY(-1px);
}
.smart-select-trigger:hover { border-color: #9eacba; background: #fcfdff; }
.smart-select-trigger:focus,
.smart-select-trigger[aria-expanded="true"] {
  outline: none;
  border-color: var(--brand-blue);
  box-shadow: 0 0 0 3px rgba(40, 84, 163, .11);
}
.smart-select-trigger.placeholder { color: #788596; }
.smart-select-trigger.smart-select-invalid { border-color: #c44545; box-shadow: 0 0 0 3px rgba(180, 35, 24, .10); }
.smart-select-panel {
  position: absolute;
  z-index: 80;
  inset-inline: 0;
  top: calc(100% + 5px);
  padding: 7px;
  border: 1px solid #c8d2dc;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 14px 34px rgba(23, 35, 51, .16);
  min-width: 0;
}
.smart-select-panel[hidden] { display: none !important; }
.smart-select-search { min-height: 40px !important; margin-bottom: 6px; padding-block: 7px; }
.smart-select-options {
  display: grid;
  gap: 2px;
  max-height: 240px;
  overflow-y: auto;
  overscroll-behavior: contain;
  padding-inline-end: 2px;
}
.smart-select-option {
  width: 100%;
  min-height: 36px;
  justify-content: flex-start;
  padding: 6px 9px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: var(--ink);
  text-align: start;
  font-weight: 500;
  line-height: 1.45;
  white-space: normal;
  overflow-wrap: anywhere;
}
.smart-select-option:hover,
.smart-select-option.active { background: var(--brand-blue-soft); color: var(--brand-blue-dark); }
.smart-select-ltr .smart-select-trigger,
.smart-select-ltr .smart-select-option { direction: ltr; unicode-bidi: isolate; text-align: left; }
.smart-select-ltr .smart-select-search { direction: rtl; text-align: right; }

/* Multi-load Fixed6 rows contain quantity only. */
.split-loads-simple { display: grid; gap: 7px; }
.split-load-row-simple {
  display: grid !important;
  grid-template-columns: 92px minmax(180px, 280px) auto !important;
  align-items: center !important;
  gap: 10px !important;
  padding: 9px 10px !important;
  border: 1px solid #e0e6ec;
  border-radius: 9px;
  background: #fff;
}
.split-load-row-simple .input-unit { min-width: 0; }
.split-load-row-simple .compact-button { justify-self: start !important; grid-column: auto !important; }
.split-summary { gap: 8px; }
.split-panel[hidden] { display: none !important; }

/* Operations exit-data handoff after Banko confirms loading. */
.exit-data-card {
  margin-top: 11px;
  padding: 16px 17px;
  min-width: 0;
  border-inline-start: 4px solid var(--brand-blue);
  transition: border-color .18s ease, box-shadow .18s ease;
}
.exit-data-required { background: linear-gradient(135deg, #fffdf7, #fff); border-color: #e6d79e; border-inline-start-color: #c38b00; }
.exit-data-complete { background: linear-gradient(135deg, #f7fcf8, #fff); border-color: #c6dfcb; border-inline-start-color: var(--brand-green); }
.exit-data-form {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr)) auto;
  gap: 10px 12px;
  align-items: end;
}
.exit-data-form > * { min-width: 0; }
.exit-data-form button { min-height: 46px; white-space: nowrap; }
.exit-data-summary {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 8px;
}
.exit-data-summary > div {
  min-width: 0;
  display: grid;
  gap: 2px;
  padding: 9px 11px;
  border: 1px solid #d5e5d8;
  border-radius: 9px;
  background: rgba(255,255,255,.78);
}
.exit-data-summary span { color: var(--ink-soft); font-size: .72rem; font-weight: 600; }
.exit-data-summary strong { font-size: .92rem; overflow-wrap: anywhere; }
.exit-data-edit { margin-top: 8px; border-top: 1px solid #dce6de; padding-top: 7px; }
.exit-data-edit > summary { cursor: pointer; color: var(--brand-blue-dark); font-size: .78rem; font-weight: 700; margin-bottom: 9px; }
.exit-data-edit[open] > summary { margin-bottom: 10px; }
.exit-data-needed-label { color: #8a6412; font-weight: 700; }

/* Fixed6 Banko has two stages only and no vehicle/driver assignment controls. */
.banko-workflow-two { gap: 8px; }
.banko-workflow-two .workflow-card { min-height: 62px; }
.banko-info-grid-simple { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.banko-info-grid-simple .banko-info-wide { grid-column: span 3; }

/* Small modern interactions across operational controls. */
.button, button { transition: transform .15s ease, background .15s ease, border-color .15s ease, box-shadow .15s ease; }
.button:hover:not(:disabled), button:hover:not(:disabled) { transform: translateY(-1px); }
.button:active:not(:disabled), button:active:not(:disabled) { transform: translateY(0); }
.card { transition: border-color .18s ease, box-shadow .18s ease; }
input:hover:not(:disabled), textarea:hover:not(:disabled), select:hover:not(:disabled) { border-color: #aebac7; }
input:focus, select:focus, textarea:focus { box-shadow: 0 0 0 3px rgba(40, 84, 163, .12); }

/* Archive now searches/displays Fixed6 manual exit data while retaining legacy fallback. */
.archive-filters input[name="vehicle"],
.archive-filters input[name="driver"] { min-width: 0; }

@media (max-width: 980px) {
  .operation-concrete-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .exit-data-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .exit-data-form button { justify-self: start; }
  .banko-info-grid-simple { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .banko-info-grid-simple .banko-info-wide { grid-column: span 2; }
}

@media (max-width: 680px) {
  .operation-form-card { padding: 13px; }
  .operation-concrete-grid,
  .exit-data-form,
  .exit-data-summary { grid-template-columns: 1fr; }
  .split-load-row-simple { grid-template-columns: 1fr !important; align-items: stretch !important; }
  .split-load-row-simple .compact-button { justify-self: start !important; }
  .banko-info-grid-simple { grid-template-columns: 1fr; }
  .banko-info-grid-simple .banko-info-wide { grid-column: auto; }
  .smart-select-panel { position: fixed; inset-inline: 10px; top: 18vh; max-height: 64vh; }
  .smart-select-options { max-height: calc(64vh - 58px); }
}

/* Fixed6 UI2 — targeted visual cleanup only. No workflow or print logic changes. */

/* Internal load report: comfortable, consistent breathing room inside cards/cells. */
.report-section-grid {
  gap: 14px;
  margin-bottom: 14px;
}
.report-section,
.report-notes,
.report-timeline {
  padding: 18px 20px;
}
.report-section .section-title,
.report-notes .section-title,
.report-timeline .section-title {
  margin-bottom: 14px;
}
.report-definition-grid {
  gap: 11px 12px;
}
.report-definition-grid > div {
  padding: 11px 13px;
  line-height: 1.5;
}
.report-definition-grid dt {
  margin-bottom: 4px;
  line-height: 1.45;
}
.report-definition-grid dd {
  line-height: 1.55;
  padding-block: 1px;
}
.report-location-block {
  gap: 16px;
  padding-block: 2px;
}
.report-location-block .location-qr {
  margin: 2px 4px;
}
.report-notes p {
  line-height: 1.7;
  margin-block: 2px 0;
}
.report-timeline .audit-list {
  padding-inline: 2px;
}
.report-timeline .audit-list li {
  padding: 12px 4px;
  gap: 16px;
  line-height: 1.5;
}
.report-timeline .audit-list time {
  padding-inline: 2px;
  line-height: 1.5;
}
.report-timeline .audit-list li > div {
  gap: 4px;
  padding-inline: 2px;
}
.report-timeline .audit-list strong,
.report-timeline .audit-list span {
  line-height: 1.5;
}
.report-critical-card {
  padding-inline: 22px;
}

/* New load: keep pour/spec/quantity controls on the same visual baseline. */
.operation-concrete-grid > label {
  align-content: start;
  grid-template-rows: auto 46px minmax(18px, auto);
  row-gap: 5px;
}
.operation-concrete-grid .smart-select,
.operation-concrete-grid .input-unit {
  height: 46px;
  min-height: 46px;
  align-self: stretch;
}
.operation-concrete-grid .smart-select-trigger {
  height: 46px;
  min-height: 46px;
}
.operation-concrete-grid .input-unit input {
  height: 44px;
  min-height: 44px;
  padding-block: 8px;
}
.operation-concrete-grid .field-hint {
  min-height: 18px;
  margin: 0;
}

/* Operation dashboard actions: make View and Internal Report unmistakably separate. */
.operation-order-actions {
  gap: 7px 9px;
  white-space: normal;
}
.dashboard-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 32px;
  padding: 5px 10px;
  border-radius: 7px;
  border: 1px solid transparent;
  text-decoration: none;
  white-space: nowrap;
  font-size: .79rem;
  font-weight: 700;
  line-height: 1.25;
  transition: background .15s ease, border-color .15s ease, color .15s ease;
}
.dashboard-action-view {
  color: var(--brand-blue-dark);
  background: var(--brand-blue-soft);
  border-color: #bfd0eb;
}
.dashboard-action-view:hover {
  background: #e6eefb;
  border-color: #9fb6dc;
  text-decoration: none;
}
.dashboard-action-report {
  color: #415166;
  background: #fff;
  border-color: #cbd5df;
}
.dashboard-action-report:hover {
  color: var(--brand-blue-dark);
  background: #f8fafc;
  border-color: #aebbc8;
  text-decoration: none;
}
.dashboard-action-edit {
  padding-inline: 3px;
}

@media (max-width: 680px) {
  .report-section,
  .report-notes,
  .report-timeline {
    padding: 15px 16px;
  }
  .report-definition-grid > div {
    padding: 10px 11px;
  }
  .report-timeline .audit-list li {
    padding: 10px 2px;
    gap: 5px;
  }
  .operation-concrete-grid > label {
    grid-template-rows: auto 46px minmax(18px, auto);
  }
}


/* V1.2 — Banko Arabic/English UI and separated concrete fields. */
body.banko-ar { --font-family: "Cairo", Tahoma, Arial, sans-serif; direction: rtl; }
body.banko-en { --font-family: Arial, Helvetica, sans-serif; direction: ltr; }
body.banko-en, body.banko-en button, body.banko-en input, body.banko-en select,
body.banko-en textarea, body.banko-en table, body.banko-en th, body.banko-en td, body.banko-en a {
  font-family: Arial, Helvetica, sans-serif;
}
body.banko-en .bidi-code, body.banko-en .bidi-phone, body.banko-en .bidi-date,
body.banko-en bdi[dir="auto"] { unicode-bidi: isolate; }
.banko-critical-five {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 10px;
}
.banko-critical-five > * { min-width: 0; }
.banko-critical-five strong, .banko-critical-five .value { overflow-wrap: anywhere; }
.banko-driver-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.operation-concrete-grid-iteration11 {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}
.operation-quantity-pump-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 12px;
}
.iteration11-master-grid { display: grid; gap: 14px; }
.iteration11-master-table input, .iteration11-master-table select { min-width: 0; max-width: 100%; }
.archive-filters select, .archive-filters input { min-width: 0; max-width: 100%; }
.print-sheet, .report-section, .card, td, th { overflow-wrap: anywhere; }

@media (max-width: 1100px) {
  .banko-critical-five { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 820px) {
  .banko-critical-five, .operation-concrete-grid-iteration11 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 680px) {
  .banko-critical-five, .banko-driver-grid, .operation-concrete-grid-iteration11,
  .operation-quantity-pump-grid { grid-template-columns: 1fr; }
}

/* Iteration 11 UI polish — Banko queue clarity and compact customer master. */
.banko-dashboard-head { align-items: center; }
.banko-order-list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 430px), 1fr));
  gap: 12px;
}
.banko-order-row {
  position: relative;
  display: grid;
  gap: 12px;
  padding: 15px 16px 14px;
  min-width: 0;
  overflow: hidden;
  border-inline-start: 4px solid #d5dde6;
}
.banko-order-row.is-sent { border-inline-start-color: #d39a00; }
.banko-order-row.is-received { border-inline-start-color: var(--brand-blue); }
.banko-order-row-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 14px;
  padding-bottom: 10px;
  border-bottom: 1px solid #e8edf2;
}
.banko-order-id-block,
.banko-order-status-block,
.banko-order-customer,
.banko-dashboard-fact { min-width: 0; }
.banko-order-id-block,
.banko-order-status-block { display: grid; gap: 3px; }
.banko-order-status-block { justify-items: end; }
body.banko-en .banko-order-status-block { justify-items: start; }
.banko-order-meta-label,
.banko-order-customer > span,
.banko-dashboard-fact > span {
  color: var(--ink-soft);
  font-size: .73rem;
  font-weight: 700;
  line-height: 1.35;
}
.banko-order-code { color: var(--brand-blue-dark); font-size: 1rem; line-height: 1.35; }
.banko-order-customer {
  display: grid;
  gap: 2px;
  padding: 0 1px;
}
.banko-order-customer strong {
  font-size: 1.02rem;
  font-weight: 700;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.banko-dashboard-facts {
  display: grid;
  grid-template-columns: minmax(0, 1.45fr) repeat(3, minmax(90px, .7fr));
  gap: 8px;
}
.banko-dashboard-fact {
  display: grid;
  align-content: start;
  gap: 2px;
  min-height: 66px;
  padding: 9px 10px;
  border: 1px solid #dbe3ec;
  border-radius: 9px;
  background: #f8fafc;
}
.banko-dashboard-fact strong {
  color: #20324a;
  font-size: .93rem;
  font-weight: 700;
  line-height: 1.45;
  overflow-wrap: anywhere;
}
.banko-dashboard-fact-primary {
  background: #f4f8ff;
  border-color: #cfdaeb;
}
.banko-dashboard-fact-primary strong { color: var(--brand-blue-dark); font-size: 1.03rem; }
.banko-pour-arabic {
  display: block;
  margin-top: 2px;
  color: #6d7886;
  font-size: .72rem;
  font-weight: 600;
  line-height: 1.35;
}
body.banko-en .banko-pour-arabic { text-align: left; }
.banko-order-row-actions {
  display: flex;
  justify-content: flex-end;
  padding-top: 1px;
}
body.banko-en .banko-order-row-actions { justify-content: flex-start; }
.banko-open-order { min-width: 132px; min-height: 38px; padding-block: 7px; }

/* Keep English Banko UI LTR while isolating Arabic/customer data inside bdi. */
body.banko-en .banko-order-row,
body.banko-en .banko-load-card,
body.banko-en .banko-workflow { text-align: left; }
body.banko-en .banko-order-customer bdi,
body.banko-en .banko-info-grid bdi,
body.banko-en .banko-critical-strip bdi { unicode-bidi: isolate; }

/* Customer master: denser inputs without changing form behavior. */
.customer-master-section { padding: 12px 15px 13px; }
.customer-master-section .section-title { margin-bottom: 7px; }
.customer-create-form {
  display: grid;
  grid-template-columns: minmax(220px, 3fr) minmax(150px, 2fr) minmax(280px, 5fr);
  gap: 6px 10px;
  align-items: end;
}
.customer-create-form label { gap: 3px; min-width: 0; font-size: .81rem; }
.customer-create-form input {
  min-height: 42px;
  height: 42px;
  padding: 7px 9px;
  border-radius: 7px;
  font-size: .86rem;
}
.customer-create-form > button {
  grid-column: 3;
  justify-self: end;
  min-height: 38px;
  padding: 6px 13px;
  margin-top: 1px;
  align-self: end;
}
.customer-master-section .table-wrap { margin-top: 8px; }
.customer-master-section .settings-table th,
.customer-master-section .settings-table td { padding-top: 7px; padding-bottom: 7px; }
.customer-location-compact { margin-top: 0; gap: 5px; }
.customer-location-compact input { min-height: 34px; padding: 5px 8px; font-size: .82rem; }
.customer-location-compact .link-button { padding-block: 3px; }

@media (max-width: 1100px) {
  .banko-dashboard-facts { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .banko-dashboard-fact-primary { grid-column: 1 / -1; }
}
@media (max-width: 820px) {
  .banko-order-list { grid-template-columns: 1fr; }
  .banko-order-row { padding: 13px 14px; }
  .customer-create-form { grid-template-columns: minmax(0, 1fr) minmax(160px, .72fr); }
  .customer-create-form .customer-location-field { grid-column: 1 / -1; }
  .customer-create-form > button { grid-column: 1 / -1; justify-self: start; }
}
@media (max-width: 560px) {
  .banko-order-row-head { align-items: stretch; }
  .banko-dashboard-facts { grid-template-columns: 1fr; }
  .banko-dashboard-fact-primary { grid-column: auto; }
  .banko-order-row-actions,
  body.banko-en .banko-order-row-actions { justify-content: stretch; }
  .banko-open-order { width: 100%; }
  .customer-create-form { grid-template-columns: 1fr; }
  .customer-create-form .customer-location-field,
  .customer-create-form > button { grid-column: 1; }
}

/* Fix3 — Operation dashboard table panel: distinct desktop work area without trapping page scroll. */
.operation-dashboard-table-panel {
  padding: 0;
  overflow: hidden;
  border: 1px solid #d8e0e8;
  border-radius: 12px;
  background: #fff;
  box-shadow: 0 3px 12px rgba(23, 35, 51, .045);
}
.operation-table-panel-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 13px 16px 11px;
  border-bottom: 1px solid #e5eaf0;
  background: linear-gradient(180deg, #fff 0%, #fbfcfd 100%);
}
.operation-table-panel-head h2 { margin: 0 0 2px; font-size: 1rem; color: #26384e; }
.operation-table-panel-head p { margin: 0; line-height: 1.45; }
.operation-table-count {
  flex: 0 0 auto;
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: 4px 10px;
  border: 1px solid #d6dee7;
  border-radius: 999px;
  background: #f7f9fb;
  color: #5b6b7d;
  font-size: .76rem;
  font-weight: 700;
  white-space: nowrap;
}
.operation-dashboard-table-panel .operation-orders-scroll {
  max-height: max(320px, calc(100vh - 330px));
  overflow: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
}
.operation-dashboard-table-panel .orders-table { margin: 0; }
.operation-dashboard-table-panel .orders-table thead th {
  position: sticky;
  top: 0;
  z-index: 2;
  box-shadow: inset 0 -1px 0 #dfe5eb;
}
.operation-dashboard-table-panel .orders-table tbody tr:last-child td { border-bottom: 0; }

@media (max-width: 900px) {
  .operation-dashboard-table-panel .operation-orders-scroll {
    max-height: none;
    overflow-y: visible;
    scrollbar-gutter: auto;
  }
  .operation-table-panel-head { padding: 11px 13px 10px; }
}
@media (max-width: 560px) {
  .operation-table-panel-head { align-items: flex-start; }
  .operation-table-panel-head p { display: none; }
}

/* Fix4 — Reports archive table: compact desktop layout, safe contained tablet scrolling. */
.archive-results {
  margin-top: 0;
  border-color: #d4dde7;
  box-shadow: 0 5px 16px rgba(23, 35, 51, .055);
}
.archive-results-head {
  padding: 14px 16px 11px;
  border-bottom: 1px solid #e4eaf0;
  background: linear-gradient(180deg, #fff, #fbfcfd);
}
.archive-table-wrap {
  width: auto;
  max-width: none;
  margin: 0 12px 12px;
  border: 1px solid #e1e7ed;
  border-radius: 9px;
  overflow-x: auto;
  overflow-y: auto;
  overscroll-behavior-inline: contain;
  background: #fff;
  scrollbar-gutter: stable;
}
.archive-table {
  width: 100%;
  min-width: 0;
  margin: 0;
  table-layout: fixed;
  border-collapse: separate;
  border-spacing: 0;
}
.archive-table th,
.archive-table td {
  padding: 9px 9px;
  max-width: none;
  line-height: 1.45;
  vertical-align: middle;
  overflow-wrap: normal !important;
  word-break: normal !important;
}
.archive-table th {
  position: sticky;
  top: 0;
  z-index: 2;
  background: #f5f8fb;
  border-bottom-color: #dce4ec;
  color: #4c5e72;
  font-size: .76rem;
}
.archive-table tbody tr:last-child td { border-bottom: 0; }
.archive-table tbody tr:hover { background: #f9fbfd; }
.archive-table th:nth-child(1), .archive-table td:nth-child(1) { width: 11%; }
.archive-table th:nth-child(2), .archive-table td:nth-child(2) { width: 10%; }
.archive-table th:nth-child(3), .archive-table td:nth-child(3) { width: 15%; }
.archive-table th:nth-child(4), .archive-table td:nth-child(4) { width: 18%; }
.archive-table th:nth-child(5), .archive-table td:nth-child(5) { width: 10%; }
.archive-table th:nth-child(6), .archive-table td:nth-child(6) { width: 9%; }
.archive-table th:nth-child(7), .archive-table td:nth-child(7) { width: 12%; }
.archive-table th:nth-child(8), .archive-table td:nth-child(8) { width: 7%; }
.archive-table th:nth-child(9), .archive-table td:nth-child(9) { width: 8%; }
.archive-primary,
.archive-secondary {
  display: block;
  min-width: 0;
}
.archive-primary {
  color: var(--ink);
  font-weight: 600;
}
.archive-secondary {
  margin-top: 2px;
  color: var(--ink-soft);
  font-size: .74rem;
  line-height: 1.35;
}
.archive-order-cell .order-link { color: var(--brand-blue-dark); }
.archive-date-cell .archive-primary { font-size: .79rem; font-weight: 500; }
.archive-customer-cell .archive-primary,
.archive-spec-cell .archive-primary,
.archive-banko-cell .archive-primary,
.archive-driver-cell .archive-primary {
  overflow-wrap: break-word !important;
}
.archive-spec-secondary { white-space: normal; }
.archive-status-cell { text-align: center; }
.archive-status-cell .status-badge { white-space: nowrap; }
.archive-actions-heading,
.archive-actions-cell {
  min-width: 96px;
  white-space: nowrap !important;
  overflow-wrap: normal !important;
  word-break: keep-all !important;
  text-align: center;
}
.archive-report-action {
  width: auto;
  min-width: 86px;
  max-width: 100%;
  padding-inline: 8px;
  white-space: nowrap;
  line-height: 1.2;
}
.archive-results .pagination { margin-top: 0; }

@media (min-width: 901px) {
  .archive-table-wrap { overflow-x: hidden; }
  .archive-table { min-width: 0; }
}

@media (max-width: 1180px) and (min-width: 901px) {
  .archive-table th,
  .archive-table td { padding-inline: 7px; font-size: .82rem; }
  .archive-table th { font-size: .72rem; }
  .archive-secondary { font-size: .7rem; }
  .archive-report-action { min-width: 80px; padding-inline: 6px; font-size: .73rem; }
}

@media (max-width: 900px) {
  .archive-table-wrap {
    max-width: calc(100% - 20px);
    margin: 0 10px 10px;
    overflow-x: auto;
    overflow-y: visible;
    scrollbar-gutter: auto;
  }
  .archive-table { min-width: 980px; }
  .archive-table th,
  .archive-table td { padding: 8px 9px; }
  .archive-actions-heading,
  .archive-actions-cell { min-width: 102px; }
}

/* Fix6 — Smart Customer Picker: server-side results, no giant customer DOM lists. */
.customer-picker {
  position: relative;
  min-width: 0;
}
.customer-picker-search-label {
  display: grid;
  gap: 5px;
  margin: 0;
  font-size: .84rem;
  font-weight: 700;
  color: #33465d;
}
.customer-picker-search-label input[type="search"] {
  min-height: 44px;
  width: 100%;
  padding: 8px 11px;
  border-radius: 8px;
  background: #fff;
}
.customer-picker-results {
  position: absolute;
  z-index: 80;
  inset-inline: 0;
  top: calc(100% + 5px);
  max-height: 360px;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 1px solid #cfd9e5;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0 12px 28px rgba(21, 35, 53, .14);
  padding: 5px;
}
.customer-picker-result {
  width: 100%;
  min-height: 58px;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 12px;
  align-items: center;
  padding: 8px 10px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #23364d;
  text-align: right;
  cursor: pointer;
}
.customer-picker-result:hover,
.customer-picker-result.is-active {
  background: #eef5ff;
}
.customer-picker-result strong {
  min-width: 0;
  overflow-wrap: anywhere;
  font-size: .9rem;
  line-height: 1.45;
}
.customer-picker-result-meta {
  grid-column: 2;
  grid-row: 1;
  color: #506177;
  font-size: .79rem;
  white-space: nowrap;
}
.customer-picker-result-location {
  grid-column: 1 / -1;
  color: #788797;
  font-size: .72rem;
  line-height: 1.35;
}
.customer-picker-message {
  margin-top: 5px;
  font-size: .74rem;
  line-height: 1.4;
}
.customer-picker-selected {
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 12px;
  border: 1px solid #d6e2ef;
  border-radius: 9px;
  background: #f8fbff;
}
.customer-picker-selected[hidden] { display: none !important; }
.customer-selected-copy {
  min-width: 0;
  display: grid;
  grid-template-columns: auto auto minmax(0, 1fr);
  align-items: baseline;
  gap: 2px 10px;
}
.customer-selected-label {
  grid-column: 1 / -1;
  color: #748397;
  font-size: .7rem;
  font-weight: 700;
}
.customer-selected-copy strong {
  min-width: 0;
  color: #22374f;
  font-size: .91rem;
  overflow-wrap: anywhere;
}
.customer-selected-meta {
  color: #506177;
  font-size: .78rem;
  white-space: nowrap;
}
.customer-selected-location {
  min-width: 0;
  color: #6c7c8e;
  font-size: .75rem;
  direction: ltr;
  text-align: left;
  overflow-wrap: anywhere;
}
.customer-order-fields {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(280px, .8fr);
  gap: 12px 16px;
  align-items: start;
}
.customer-picker-order { min-width: 0; }
.customer-order-location { min-width: 0; }

/* Customer Master now loads only the selected customer instead of a 3000+ row table. */
.customer-master-head {
  align-items: center;
  gap: 16px;
}
.customer-master-head p { margin: 3px 0 0; }
.customer-picker-settings { margin-top: 4px; max-width: 900px; }
.customer-settings-editor {
  margin-top: 10px;
  padding: 11px 12px;
  border: 1px solid #dce4ed;
  border-radius: 9px;
  background: #fbfcfe;
}
.customer-settings-editor[hidden] { display: none !important; }
.customer-editor-status {
  display: flex;
  justify-content: flex-end;
  margin-bottom: 7px;
}
.customer-edit-form {
  display: grid;
  grid-template-columns: minmax(200px, 3fr) minmax(150px, 2fr) minmax(280px, 5fr);
  gap: 7px 10px;
  align-items: end;
}
.customer-edit-form label {
  min-width: 0;
  display: grid;
  gap: 3px;
  font-size: .8rem;
}
.customer-edit-form input {
  min-height: 42px;
  height: 42px;
  padding: 7px 9px;
  border-radius: 7px;
  font-size: .85rem;
}
.customer-edit-form > button {
  grid-column: 3;
  justify-self: end;
  min-height: 38px;
  padding: 6px 13px;
}
.customer-toggle-form {
  margin-top: -38px;
  display: flex;
  justify-content: flex-start;
  pointer-events: none;
}
.customer-toggle-form button { pointer-events: auto; }
.customer-new-form {
  margin-top: 11px;
  padding-top: 10px;
  border-top: 1px solid #e3e8ee;
}
.customer-new-form[hidden] { display: none !important; }
.customer-new-form-head {
  grid-column: 1 / -1;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 1px;
}
.customer-new-form-head .text-link {
  border: 0;
  background: transparent;
  cursor: pointer;
}

@media (max-width: 900px) {
  .customer-order-fields { grid-template-columns: 1fr; }
  .customer-edit-form { grid-template-columns: minmax(0, 1fr) minmax(160px, .72fr); }
  .customer-edit-form label:nth-of-type(3) { grid-column: 1 / -1; }
  .customer-edit-form > button { grid-column: 1 / -1; justify-self: start; }
  .customer-toggle-form { margin-top: 8px; }
}
@media (max-width: 620px) {
  .customer-picker-results {
    max-height: 320px;
    inset-inline: 0;
  }
  .customer-picker-result {
    grid-template-columns: 1fr;
    gap: 2px;
    min-height: 62px;
  }
  .customer-picker-result-meta,
  .customer-picker-result-location {
    grid-column: 1;
    grid-row: auto;
    justify-self: start;
  }
  .customer-picker-selected {
    align-items: stretch;
    flex-direction: column;
  }
  .customer-selected-copy { grid-template-columns: 1fr; }
  .customer-selected-label,
  .customer-selected-copy strong,
  .customer-selected-meta,
  .customer-selected-location { grid-column: 1; }
  .customer-picker-selected .compact-button { width: 100%; }
  .customer-edit-form { grid-template-columns: 1fr; }
  .customer-edit-form label:nth-of-type(3),
  .customer-edit-form > button { grid-column: 1; }
  .customer-edit-form > button { width: 100%; }
  .customer-master-head { align-items: stretch; flex-direction: column; }
  .customer-master-head > button { width: 100%; }
}
/* The generic settings section clips overflow; the customer search dropdown must escape its card. */
.customer-master-section { overflow: visible; }

/* Final delivery UI polish — scoped visual finish only. */
:root {
  --polish-blue-1: #eef5ff;
  --polish-blue-2: #f8fbff;
  --polish-green-1: #edf8f0;
  --polish-gold-1: #fff8e7;
  --polish-shadow: 0 14px 34px rgba(29, 58, 103, .075);
}

/* Login: branded two-panel surface with calm motion and no exposed demo credentials. */
body.auth-page {
  min-height: 100vh;
  background:
    radial-gradient(circle at 12% 12%, rgba(52, 139, 67, .12), transparent 28rem),
    radial-gradient(circle at 88% 16%, rgba(40, 84, 163, .16), transparent 32rem),
    linear-gradient(135deg, #eef4fb 0%, #f8fbfd 48%, #edf5ef 100%);
  overflow-x: hidden;
}
body.auth-page .container-auth { width: min(1240px, calc(100% - 36px)); }
.auth-shell {
  min-height: 100vh;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(380px, .72fr);
  align-items: center;
  gap: clamp(26px, 5vw, 76px);
  padding: clamp(28px, 5vh, 58px) 0;
}
.auth-welcome {
  position: relative;
  min-height: 580px;
  display: grid;
  align-items: center;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.72);
  border-radius: 30px;
  background: linear-gradient(145deg, rgba(255,255,255,.82), rgba(247,251,255,.58));
  box-shadow: 0 24px 80px rgba(24, 61, 124, .11);
  backdrop-filter: blur(8px);
}
.auth-watermark { position: absolute; inset: 0; display: grid; place-items: center; pointer-events: none; }
.auth-watermark img { width: min(74%, 620px); opacity: .045; filter: saturate(.75); transform: rotate(-4deg) scale(1.05); }
.auth-welcome::before,
.auth-welcome::after { content: ""; position: absolute; border-radius: 999px; pointer-events: none; }
.auth-welcome::before { width: 330px; height: 330px; inset-inline-start: -130px; top: -90px; background: rgba(40,84,163,.08); }
.auth-welcome::after { width: 280px; height: 280px; inset-inline-end: -90px; bottom: -120px; background: rgba(52,139,67,.09); }
.auth-welcome-content { position: relative; z-index: 1; padding: clamp(42px, 6vw, 78px); animation: authReveal .7s ease-out both; }
.auth-eyebrow { display: inline-flex; color: var(--brand-blue); font: 700 .72rem/1.3 Arial, sans-serif; letter-spacing: .13em; margin-bottom: 26px; }
.auth-hero-logo { width: min(330px, 65%); max-height: 112px; object-fit: contain; object-position: right center; margin-bottom: 28px; }
.auth-welcome-copy { max-width: 680px; }
.auth-welcome-copy h1 { margin: 0; color: #14366f; font-size: clamp(2rem, 4vw, 3.5rem); line-height: 1.28; letter-spacing: -.02em; }
.auth-welcome-copy p { margin: 13px 0 0; color: #405a7d; font-size: clamp(1.03rem, 1.8vw, 1.34rem); font-weight: 700; }
.auth-trust-points { margin-top: 34px; display: flex; align-items: center; gap: 10px; color: #687a8f; font-size: .78rem; font-weight: 700; }
.auth-trust-points i { width: 5px; height: 5px; border-radius: 50%; background: #8fb49a; }
.auth-card-premium { width: 100%; padding: clamp(24px, 3vw, 34px); border-radius: 22px; border-color: rgba(200,213,228,.86); box-shadow: 0 20px 60px rgba(23,35,51,.12); animation: authReveal .72s .08s ease-out both; }
.auth-brandmark-compact { padding-bottom: 15px; margin-bottom: 20px; }
.auth-brandmark-compact img { width: 104px; height: 55px; object-fit: contain; background: #fff; }
.auth-card-premium .auth-heading h2 { margin: 2px 0 4px; font-size: 1.55rem; color: #1e3553; }
.auth-login-form { gap: 15px; }
.auth-login-form input { min-height: 48px; border-radius: 10px; background: #fbfdff; }
.password-field { position: relative; display: block; }
.password-field input { padding-inline-end: 52px; }
.password-toggle { position: absolute; inset-inline-end: 6px; top: 50%; transform: translateY(-50%); width: 38px; min-height: 36px; padding: 0; border: 0; border-radius: 8px; background: transparent; color: #718095; box-shadow: none; }
.password-toggle:hover, .password-toggle.is-visible { background: var(--brand-blue-soft); color: var(--brand-blue-dark); }
.password-toggle span { font-size: 1rem; line-height: 1; }
.auth-form-options { display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.remember-choice { display: inline-flex; align-items: center; grid-template-columns: auto 1fr; gap: 8px; font-size: .84rem; cursor: pointer; }
.remember-choice input { width: 17px; height: 17px; min-height: 0; padding: 0; accent-color: var(--brand-blue); }
.auth-security-note { color: #7a899a; font-size: .75rem; }
.auth-submit { width: 100%; min-height: 48px; border-radius: 10px; box-shadow: 0 8px 20px rgba(40,84,163,.16); }
@keyframes authReveal { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: none; } }
@media (prefers-reduced-motion: reduce) { .auth-welcome-content, .auth-card-premium { animation: none; } }

/* Operation New: richer step cards and a robust selected-customer summary. */
.operation-new-head { padding: 3px 2px 2px; }
.operation-form-shell { gap: 16px; }
.operation-form-card {
  border-color: #d6e0eb;
  box-shadow: 0 7px 22px rgba(23,35,51,.055);
  background: linear-gradient(180deg, #fff, #fcfdff);
}
.operation-form-card::before { content: ""; display: block; height: 3px; margin: -15px -17px 13px; border-radius: 12px 12px 0 0; background: linear-gradient(90deg, rgba(40,84,163,.75), rgba(52,139,67,.38), transparent 82%); }
.operation-customer-card { background: linear-gradient(145deg, #fff, #f8fbff 70%); }
.customer-selected-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 16px;
  padding: 14px 15px;
  border: 1px solid #bfd0e6;
  border-radius: 12px;
  background: linear-gradient(135deg, #f4f8ff, #fff 62%, #f1f8f2);
  box-shadow: 0 8px 22px rgba(40,84,163,.065);
  overflow: hidden;
}
.customer-selected-copy { display: grid; gap: 5px; min-width: 0; }
.customer-selected-label { color: var(--brand-blue); font-size: .72rem; font-weight: 800; }
.customer-selected-name { color: #203752; font-size: 1.06rem; line-height: 1.45; overflow-wrap: anywhere; }
.customer-selected-facts { display: grid; grid-template-columns: minmax(130px,.45fr) minmax(0,1.55fr); gap: 8px; min-width: 0; }
.customer-selected-fact { min-width: 0; display: grid; gap: 1px; padding: 7px 9px; border-radius: 8px; background: rgba(255,255,255,.76); border: 1px solid #e0e8f0; color: #465a70; font-size: .82rem; }
.customer-selected-fact small { color: #8290a0; font-size: .68rem; font-weight: 700; }
.customer-selected-fact bdi { display: block; min-width: 0; white-space: normal; overflow-wrap: anywhere; word-break: normal; unicode-bidi: isolate; }
.customer-change-button { align-self: center; white-space: nowrap; min-width: 112px; }
.customer-picker-results { border-radius: 10px; box-shadow: 0 16px 38px rgba(23,35,51,.12); }
.customer-picker-result { min-height: 62px; }

/* Order details: visual hierarchy with subtle operational color coding. */
.order-detail-head { align-items: center; padding: 3px 0 5px; }
.order-detail-head h1 { color: #183d7c; }
.order-detail-head .head-actions .button { box-shadow: 0 3px 10px rgba(23,35,51,.035); }
.order-detail-hero,
.banko-detail-main-card {
  border-color: #cddaea;
  background: linear-gradient(145deg, #ffffff 0%, #f7faff 54%, #f5fbf6 100%);
  box-shadow: var(--polish-shadow);
}
.order-detail-hero { position: relative; overflow: hidden; }
.order-detail-hero::after { content: ""; position: absolute; width: 170px; height: 170px; inset-inline-end: -80px; top: -95px; border-radius: 50%; background: rgba(40,84,163,.055); pointer-events: none; }
.order-detail-hero .banko-critical-strip > div,
.banko-detail-main-card .banko-critical-strip > div {
  border: 1px solid #d7e2ee;
  background: rgba(255,255,255,.82);
  box-shadow: 0 3px 10px rgba(23,35,51,.025);
}
.order-detail-hero .banko-critical-strip > div:nth-child(1),
.banko-detail-main-card .banko-critical-strip > div:nth-child(1) { background: var(--polish-blue-1); border-color: #c7d7ed; }
.order-detail-hero .banko-critical-strip > div:nth-child(4),
.banko-detail-main-card .banko-critical-strip > div:nth-child(4) { background: var(--polish-green-1); border-color: #cde3d2; }
.order-detail-facts { padding: 16px; gap: 10px 14px; border-color: #d8e2ec; box-shadow: 0 7px 22px rgba(23,35,51,.045); }
.order-detail-facts > div { border: 1px solid #e1e7ee; border-radius: 9px; padding: 10px 11px; background: #fbfcfe; }
.order-detail-facts > div.wide { background: linear-gradient(90deg, #fbfcfe, #f7faff); }
.order-detail-facts strong { color: #263b53; }
.order-detail-audit { border-color: #dce4ec; }
.banko-detail-main-card { padding: 16px 18px; }
.banko-detail-main-card .banko-info-grid > div { border: 1px solid #e0e7ee; border-radius: 9px; background: rgba(255,255,255,.8); padding: 9px 10px; }
.banko-detail-workflow .workflow-card-active { box-shadow: 0 10px 26px rgba(40,84,163,.09); }
.banko-detail-workflow .workflow-card-complete { border-color: #bcdac2; background: linear-gradient(135deg, #f2faf4, #fff); }
.banko-print-button { box-shadow: 0 8px 20px rgba(40,84,163,.14); }

/* Settings: final user-facing surface hides compatibility implementation notes. */
.customer-master-section { background: linear-gradient(145deg, #fff, #f9fbff); border-color: #d4dfeb; }

@media (max-width: 980px) {
  .auth-shell { grid-template-columns: 1fr; max-width: 700px; margin: auto; }
  .auth-welcome { min-height: 300px; }
  .auth-welcome-content { padding: 36px; }
  .auth-hero-logo { width: min(260px, 58%); margin-bottom: 18px; }
  .auth-trust-points { margin-top: 22px; }
  .auth-card-premium { max-width: 620px; justify-self: center; }
  .customer-selected-facts { grid-template-columns: 1fr; }
}
@media (max-width: 680px) {
  body.auth-page .container-auth { width: min(100% - 22px, 620px); }
  .auth-shell { gap: 16px; padding: 16px 0 24px; }
  .auth-welcome { min-height: 245px; border-radius: 20px; }
  .auth-welcome-content { padding: 25px 22px; }
  .auth-eyebrow, .auth-trust-points { display: none; }
  .auth-hero-logo { width: min(220px, 62%); max-height: 78px; margin-bottom: 13px; }
  .auth-welcome-copy h1 { font-size: clamp(1.45rem, 7vw, 2rem); }
  .auth-welcome-copy p { font-size: .96rem; }
  .auth-card-premium { padding: 21px 18px; border-radius: 17px; }
  .auth-brandmark-compact img { width: 88px; height: 46px; }
  .auth-form-options { align-items: flex-start; }
  .customer-selected-card { grid-template-columns: 1fr; gap: 11px; }
  .customer-change-button { width: 100%; }
  .order-detail-head { align-items: flex-start; }
  .order-detail-head .head-actions { width: 100%; }
  .order-detail-head .head-actions .button { flex: 1 1 150px; }
  .banko-detail-main-card { padding: 13px; }
}

/* V1 RC final polish — login password field only. Keep the eye control physically left in Arabic RTL. */
.auth-page .auth-login-form .password-field input[data-password-input] {
  direction: rtl;
  text-align: right;
  padding-right: 12px;
  padding-left: 54px;
}
.auth-page .auth-login-form .password-field .password-toggle {
  left: 6px;
  right: auto;
  inset-inline-start: auto;
  inset-inline-end: 6px;
}

/* V1.1 archive current-driver trip count */
.driver-trip-count-card {
  margin: -2px 0 14px;
  padding: 10px 14px;
  display: inline-flex;
  align-items: baseline;
  gap: 8px;
  border-inline-start: 3px solid var(--brand-blue);
  background: #f7f9fc;
}
.driver-trip-count-card span { color: var(--ink-soft); font-size: .84rem; font-weight: 600; }
.driver-trip-count-card strong { font-size: 1.28rem; color: var(--brand-blue-dark); }
.driver-trip-count-card small { color: var(--ink-soft); }
.sync-countdown {
  display: inline-block;
  min-width: 4.3em;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}

/* RC2 acceptance polish — correction stays read-only until explicitly opened. */
.load-truth-card { padding: 14px 16px; }
.load-truth-head { margin-bottom: 9px; }
.load-truth-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 9px;
  margin-bottom: 10px;
}
.load-truth-grid > div {
  min-width: 0;
  display: grid;
  gap: 2px;
  padding: 9px 11px;
  border: 1px solid #e0e7ef;
  border-radius: 9px;
  background: #f9fbfd;
}
.load-truth-grid span { color: var(--ink-soft); font-size: .72rem; font-weight: 700; }
.load-truth-grid strong { color: #263b53; overflow-wrap: anywhere; }
.correction-disclosure { min-width: 0; }
.correction-disclosure > summary { list-style: none; cursor: pointer; user-select: none; }
.correction-disclosure > summary::-webkit-details-marker { display: none; }
.correction-edit-trigger { width: fit-content; white-space: nowrap; }
.correction-panel { margin-top: 10px; padding-top: 10px; border-top: 1px solid #e3e9ef; }
.master-correction-form {
  display: grid;
  grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) minmax(180px, 1fr) auto;
  gap: 10px;
  align-items: end;
}
.master-correction-form label { min-width: 0; }
.master-correction-form button { white-space: nowrap; }
.banko-correction-disclosure {
  display: block;
  padding: 11px 12px;
  border: 1px solid #d8e2ed;
  border-radius: 10px;
  background: #fff;
}
.banko-correction-disclosure[open] { box-shadow: 0 8px 22px rgba(40,84,163,.07); }
.banko-correction-disclosure > .correction-edit-trigger {
  color: var(--brand-blue-dark);
  font-weight: 800;
  line-height: 1.35;
}
.banko-correction-disclosure[open] > .correction-edit-trigger { margin-bottom: 2px; }

/* RC2 acceptance polish — compact Driver / Mixer / Pump masters only. */
.master-management-section {
  scroll-margin-top: 86px;
  padding: 14px 16px;
}
.master-management-section .section-title { margin-bottom: 9px; }
.master-compact-form {
  display: grid;
  gap: 9px 10px;
  align-items: end;
  width: 100%;
  max-width: 1020px;
  margin-bottom: 10px;
}
.master-compact-form label { min-width: 0; }
.driver-master-form { grid-template-columns: minmax(180px, 1fr) minmax(180px, 1fr) 125px auto; }
.mixer-master-form { grid-template-columns: minmax(145px, 180px) minmax(180px, 220px) 125px auto; }
.pump-master-form { grid-template-columns: minmax(130px, 170px) minmax(180px, 220px) auto; max-width: 650px; }
.master-compact-form input { min-height: 40px; }
.master-add-button { white-space: nowrap; min-height: 40px; }
.master-table-wrap { margin-top: 5px; }
.master-compact-table th,
.master-compact-table td { padding: 7px 8px; }
.master-compact-table input { min-height: 36px; padding-block: 5px; }
.driver-master-table th:nth-child(3), .driver-master-table td:nth-child(3) { width: 130px; }
.driver-master-table .master-code-cell input { width: 110px; max-width: 100%; }
.mixer-master-table th:nth-child(1), .mixer-master-table td:nth-child(1) { width: 180px; }
.mixer-master-table th:nth-child(2), .mixer-master-table td:nth-child(2) { width: 220px; }
.mixer-master-table th:nth-child(3), .mixer-master-table td:nth-child(3) { width: 130px; }
.mixer-master-table .master-capacity-cell input { width: 105px; max-width: 100%; }
.pump-master-table th:nth-child(1), .pump-master-table td:nth-child(1) { width: 170px; }
.pump-master-table th:nth-child(2), .pump-master-table td:nth-child(2) { width: 220px; }

/* RC2 archive filters: primary 4-column grid + a calm advanced historical group. */
.archive-filters-professional { display: block; }
.archive-primary-filters,
.archive-advanced-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px 12px;
  align-items: end;
}
.archive-primary-filters label,
.archive-advanced-grid label { min-width: 0; }
.archive-advanced-filters {
  margin-top: 12px;
  border-top: 1px solid #e4e9ef;
  padding-top: 9px;
}
.archive-advanced-filters > summary {
  cursor: pointer;
  color: var(--brand-blue-dark);
  font-size: .8rem;
  font-weight: 800;
  width: fit-content;
  margin-bottom: 9px;
}
.archive-advanced-filters:not([open]) > summary { margin-bottom: 0; }
.archive-filter-actions { margin-top: 12px; }
.polished-summary-grid .report-metric { min-height: 82px; align-content: center; }
.polished-summary-grid .report-metric span { min-height: 1.3em; line-height: 1.3; }
.polished-summary-grid .report-metric strong { line-height: 1.1; }
.archive-table td { vertical-align: middle; }
.archive-status-cell .status,
.archive-actions-cell .button,
.archive-actions-heading { white-space: nowrap !important; }
.archive-status-cell .status { display: inline-flex; justify-content: center; min-width: max-content; }
.archive-date-cell .bidi-date { white-space: nowrap; }
.archive-actions-cell { padding-inline: 6px !important; }
.archive-report-action { min-width: 90px; }

@media (max-width: 1100px) {
  .master-correction-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .master-correction-form button { justify-self: start; }
  .driver-master-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .driver-master-form .master-code-field { max-width: 160px; }
  .mixer-master-form { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .mixer-master-form .master-capacity-field { max-width: 160px; }
  .pump-master-form { grid-template-columns: repeat(2, minmax(0, 1fr)); max-width: 680px; }
  .archive-primary-filters,
  .archive-advanced-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .load-truth-grid { grid-template-columns: 1fr; }
  .master-correction-form,
  .driver-master-form,
  .mixer-master-form,
  .pump-master-form { grid-template-columns: 1fr; max-width: none; }
  .driver-master-form .master-code-field,
  .mixer-master-form .master-capacity-field { max-width: none; }
  .master-add-button { justify-self: stretch; }
  .archive-primary-filters,
  .archive-advanced-grid { grid-template-columns: 1fr; }
  .polished-summary-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* RC3 acceptance — Banko keeps assigned loaded orders visible without turning the dashboard into an archive. */
.banko-status-groups { display: grid; gap: 18px; }
.banko-status-section { min-width: 0; }
.banko-status-section-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin: 0 2px 9px; }
.banko-status-section-head h2 { margin: 0; font-size: 1rem; color: var(--brand-blue-dark); }
.banko-status-count { min-width: 30px; min-height: 26px; padding: 3px 9px; display: inline-flex; align-items: center; justify-content: center; border-radius: 999px; background: #eef3f8; color: #35506d; font-weight: 800; }
.banko-order-row.is-loaded { border-inline-start-color: #2f8a4c; }
.banko-status-loaded .banko-order-list { opacity: .98; }
.banko-loaded-preview { display: flex; flex-wrap: wrap; gap: 6px 18px; padding: 8px 10px; border-radius: 8px; background: #f6faf7; color: #3d5369; font-size: .78rem; }
.banko-status-empty { padding: 12px 14px; }

/* RC3 reports — calmer primary filter grid, stable metrics, and collision-safe cells. */
.reports-page-head { align-items: center; }
.reports-return-action { white-space: nowrap; font-weight: 800; }
.archive-primary-filters,
.archive-advanced-grid { grid-template-columns: repeat(4, minmax(170px, 1fr)); }
.archive-primary-filters label,
.archive-advanced-grid label { overflow: hidden; }
.archive-primary-filters input,
.archive-primary-filters select,
.archive-advanced-grid input,
.archive-advanced-grid select { width: 100%; min-width: 0; }
.polished-summary-grid { align-items: stretch; }
.polished-summary-grid .report-metric { min-height: 86px; display: grid; grid-template-rows: minmax(2.6em, auto) auto; align-content: center; gap: 5px; }
.polished-summary-grid .report-metric span { min-height: 0; display: flex; align-items: center; justify-content: center; text-wrap: balance; overflow-wrap: normal; word-break: normal; }
.polished-summary-grid .report-metric strong { font-size: 1.35rem; }
.rc3-archive-table td { vertical-align: middle; }
.archive-cell-line { display: block; }
.archive-driver-cell .archive-primary,
.archive-quantity-cell .archive-primary { margin-bottom: 3px; }
.archive-customer-name { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; line-height: 1.45; }
.archive-status-cell .status,
.archive-actions-cell .button,
.archive-actions-heading { white-space: nowrap !important; }
.rc3-archive-table { min-width: 1120px; }
.archive-table th:nth-child(8),
.archive-table td:nth-child(8) { width: 140px; min-width: 140px; }
.archive-table th:nth-child(9),
.archive-table td:nth-child(9) { width: 104px; min-width: 104px; }
.archive-status-cell,
.archive-actions-heading,
.archive-actions-cell { padding-inline: 12px !important; vertical-align: middle; }
.archive-status-cell { text-align: center; }
.archive-status-cell .status { box-sizing: border-box; white-space: nowrap !important; }
.archive-actions-cell { text-align: center; }
.archive-report-action { min-width: 90px; padding-inline: 8px; white-space: nowrap; }
.archive-table-wrap { max-width: 100%; overflow-x: auto; }

@media (max-width: 1180px) {
  .archive-primary-filters,
  .archive-advanced-grid { grid-template-columns: repeat(3, minmax(160px, 1fr)); }
  .archive-table th,
  .archive-table td { padding-inline: 7px; }
}
@media (max-width: 820px) {
  .archive-primary-filters,
  .archive-advanced-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .archive-table-wrap { overflow-x: auto !important; overflow-y: hidden; -webkit-overflow-scrolling: touch; }
  .archive-table { min-width: 980px !important; }
  .rc3-archive-table { min-width: 1120px !important; }
}
@media (max-width: 560px) {
  .archive-primary-filters,
  .archive-advanced-grid { grid-template-columns: 1fr; }
  .reports-page-head .head-actions,
  .reports-return-action { width: 100%; }
  .reports-return-action { justify-content: center; }
}