@import url("https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600;700&family=Cormorant+Garamond:wght@600;700&display=swap");
/* ==========================================================================
   UMAR TILES - light premium theme.  Change the colours in :root only.
   ========================================================================== */
:root {
  --brand:          #B8864B;   /* champagne gold / bronze accent */
  --brand-dark:     #96693A;   /* hover / pressed */
  --brand-soft:     #F5EBDD;   /* light tint of the accent */
  --brand-contrast: #FFFFFF;   /* text on accent buttons */
  --bg:             #FAF8F5;   /* page background (warm off-white) */
  --surface:        #FFFFFF;   /* cards, navbar */
  --sidebar-bg:     #FFFDF9;   /* very light cream */
  --text:           #2E2A27;   /* charcoal */
  --text-muted:     #7A726A;
  --border:         #E9E2D8;
  --danger-soft:    #FBEAE6;
  --danger:         #B5412F;
  --success:        #4E7D5B;
  --shadow:         0 1px 3px rgba(60, 45, 30, .06), 0 4px 14px rgba(60, 45, 30, .05);
  --sidebar-w:      240px;

  /* map to Bootstrap 5 variables so every component follows the theme */
  --bs-body-bg: var(--bg);
  --bs-body-color: var(--text);
  --bs-secondary-color: var(--text-muted);
  --bs-border-color: var(--border);
  --bs-link-color: var(--brand-dark);
  --bs-link-hover-color: var(--brand);
  --bs-primary: var(--brand);
  --bs-primary-rgb: 184, 134, 75;
  --bs-danger: var(--danger);
  --bs-success: var(--success);
}

body { padding-top: 56px; background: var(--bg); color: var(--text); }
a { color: var(--brand-dark); }
h3, h4, h5, h6 { color: var(--text); font-weight: 600; }
.text-muted { color: var(--text-muted) !important; }
.text-danger { color: var(--danger) !important; }
.text-success { color: var(--success) !important; }

/* top bar */
.erp-navbar { background: var(--surface); border-bottom: 1px solid var(--border); box-shadow: var(--shadow); height: 56px; }
.erp-navbar .navbar-brand { color: var(--brand-dark); font-weight: 800; letter-spacing: .1em; }
.erp-navbar .brand-sub { color: var(--text-muted); letter-spacing: .05em; }
.erp-navbar .small { color: var(--text); }

/* sidebar */
.erp-sidebar { width: var(--sidebar-w); top: 56px; background: var(--sidebar-bg); color: var(--text); border-right: 1px solid var(--border); }
@media (min-width: 992px) {
  .erp-sidebar { position: fixed; bottom: 0; left: 0; overflow-y: auto; visibility: visible !important; }
  .erp-main.with-sidebar { margin-left: var(--sidebar-w); }
}
.erp-sidebar .nav-link { color: var(--text); padding: .38rem 1rem; font-size: .92rem; border-left: 3px solid transparent; }
.erp-sidebar .nav-link:hover { background: var(--brand-soft); border-left-color: var(--brand); color: var(--text); }
.erp-sidebar .nav-link i { width: 1.4rem; display: inline-block; color: var(--brand); }
.erp-sidebar .nav-link.disabled { color: #A59D93; font-size: .85rem; }
.nav-header { list-style: none; font-size: .72rem; text-transform: uppercase; letter-spacing: .08em; color: var(--text-muted); padding: .9rem 1rem .2rem; font-weight: 600; }
.sidebar-brand .wordmark { font-weight: 800; letter-spacing: .14em; font-size: 1.2rem; color: var(--brand-dark); }

/* cards & tables */
.card { background: var(--surface); border: 1px solid var(--border); border-radius: .75rem; box-shadow: var(--shadow); }
.card-header { background: var(--brand-soft); border-bottom: 1px solid var(--border); color: var(--text); }
.card-header-alert { background: var(--danger-soft) !important; color: var(--danger); }
.card-stat .display-6 { font-weight: 600; color: var(--brand-dark); }
.card-stat.border-danger { border-color: var(--danger) !important; }
.table { --bs-table-bg: transparent; --bs-table-hover-bg: #FBF6EE; --bs-table-striped-bg: #FCFAF6; --bs-table-border-color: var(--border); color: var(--text); }
.table-light, .table > thead.table-light > tr > *, .table > tfoot.table-light > tr > * { --bs-table-bg: #F7F1E8; --bs-table-color: var(--text); color: var(--text); border-color: var(--border); }
.table-danger { --bs-table-bg: var(--danger-soft); --bs-table-color: var(--text); --bs-table-border-color: #F0D4CD; }
.table-secondary { --bs-table-bg: #F1EEE9; --bs-table-color: var(--text-muted); }
.list-group-item { background: var(--surface); border-color: var(--border); }
.list-group-item-action:hover { background: var(--brand-soft); }

/* buttons */
.btn-primary { --bs-btn-bg: var(--brand); --bs-btn-border-color: var(--brand); --bs-btn-color: var(--brand-contrast);
  --bs-btn-hover-bg: var(--brand-dark); --bs-btn-hover-border-color: var(--brand-dark); --bs-btn-hover-color: var(--brand-contrast);
  --bs-btn-active-bg: var(--brand-dark); --bs-btn-active-border-color: var(--brand-dark); --bs-btn-active-color: var(--brand-contrast);
  --bs-btn-disabled-bg: var(--brand); --bs-btn-disabled-border-color: var(--brand); }
.btn-outline-primary { --bs-btn-color: var(--brand-dark); --bs-btn-border-color: var(--brand);
  --bs-btn-hover-bg: var(--brand); --bs-btn-hover-border-color: var(--brand); --bs-btn-hover-color: var(--brand-contrast);
  --bs-btn-active-bg: var(--brand-dark); --bs-btn-active-border-color: var(--brand-dark); --bs-btn-active-color: var(--brand-contrast); }
.btn-outline-brand { --bs-btn-color: var(--brand-dark); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand); --bs-btn-hover-border-color: var(--brand); --bs-btn-hover-color: var(--brand-contrast); }
.btn-outline-secondary { --bs-btn-color: var(--text); --bs-btn-border-color: var(--border); --bs-btn-hover-bg: var(--brand-soft); --bs-btn-hover-border-color: var(--brand); --bs-btn-hover-color: var(--text); --bs-btn-active-bg: var(--brand-soft); --bs-btn-active-color: var(--text); }
.btn-outline-danger { --bs-btn-color: var(--danger); --bs-btn-border-color: #E3B8AF; --bs-btn-hover-bg: var(--danger); --bs-btn-hover-border-color: var(--danger); }
.btn-danger { --bs-btn-bg: var(--danger); --bs-btn-border-color: var(--danger); --bs-btn-hover-bg: #98301F; --bs-btn-hover-border-color: #98301F; }
.btn-link { color: var(--brand-dark); }

/* forms */
.form-control, .form-select { background-color: var(--surface); border-color: var(--border); color: var(--text); }
.form-control:focus, .form-select:focus { border-color: var(--brand); box-shadow: 0 0 0 .2rem rgba(184, 134, 75, .18); }
.form-check-input:checked { background-color: var(--brand); border-color: var(--brand); }
.form-text { color: var(--text-muted); }
.pagination { --bs-pagination-color: var(--brand-dark); --bs-pagination-hover-bg: var(--brand-soft); --bs-pagination-hover-color: var(--brand-dark);
  --bs-pagination-active-bg: var(--brand); --bs-pagination-active-border-color: var(--brand); --bs-pagination-border-color: var(--border); --bs-pagination-bg: var(--surface); }

/* badges / alerts */
.badge.bg-danger { background-color: var(--danger) !important; }
.badge.bg-secondary { background-color: #8C847B !important; }
.badge-soft { background: var(--brand-soft); color: var(--brand-dark); border: 1px solid var(--border); font-weight: 500; }
.badge-soft-gold { background: var(--brand); color: var(--brand-contrast); }
.alert-success { --bs-alert-bg: #EEF5F0; --bs-alert-border-color: #CFE2D5; --bs-alert-color: #2F5A3C; }
.alert-danger { --bs-alert-bg: var(--danger-soft); --bs-alert-border-color: #F0D4CD; --bs-alert-color: #8A2F20; }
.alert-info { --bs-alert-bg: #F7F1E8; --bs-alert-border-color: var(--border); --bs-alert-color: var(--text); }

/* item form live preview */
.conv-preview { background: var(--brand-soft); border: 1px dashed var(--brand); border-radius: .75rem; }
.num { font-variant-numeric: tabular-nums; }

/* login */
.login-card { border-top: 4px solid var(--brand); }
@media print { .erp-navbar, .erp-sidebar, .btn, form { display: none !important; } .erp-main { margin-left: 0 !important; } }

/* dashboard KPI cards */
.kpi .card-body { padding: 1rem 1.1rem; }
.kpi-label { font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; color: var(--text-muted); font-weight: 600; }
.kpi-label i { color: var(--brand); margin-right: .25rem; }
.kpi-value { font-size: 1.75rem; font-weight: 700; color: var(--text); line-height: 1.25; font-variant-numeric: tabular-nums; }
.kpi-sub { font-size: .8rem; color: var(--text-muted); }
.kpi-accent { border-top: 3px solid var(--brand); background: linear-gradient(180deg, var(--brand-soft), var(--surface) 70%); }
.kpi-alert { border-color: #E3B8AF; background: var(--danger-soft); }
a .kpi:hover { box-shadow: 0 2px 6px rgba(60,45,30,.1), 0 8px 20px rgba(60,45,30,.08); }

/* ---- line entry (Box / Pcs / Meter) + Net Total ---- */
.net-total-box { float: right; text-align: center; border: 1px solid var(--erp-border, #e8dfd2); background: #fff; border-radius: 10px;
  padding: .35rem 1.5rem .5rem; margin: 0 0 .75rem .75rem; min-width: 240px; box-shadow: 0 1px 3px rgba(60,40,10,.08); }
.net-total-label { color: #c0392b; font-weight: 700; font-size: 1.15rem; letter-spacing: .03em; }
.net-total-value { font-size: 2.6rem; font-weight: 800; line-height: 1.1; color: #c0392b; font-variant-numeric: tabular-nums; }
.q-qty { font-weight: 600; }
.line-totals th { color: #c0392b; font-weight: 700; background: #faf6ef; }
#table-lines input.q-in, #table-lines input.q-qty { min-width: 70px; }
.erp-version { font-size: .7rem; color: #9a8f82; letter-spacing: .04em; }

/* order-linked invoice lines */
.row-excluded { opacity: .45; }
.row-excluded input, .row-excluded select { text-decoration: line-through; }
.row-excluded .include-wrap { opacity: 1; }

/* ==========================================================================
   THEME HOOKS (new) - extra variables so a whole theme is only a :root block.
   Defaults below == the current gold theme.
   ========================================================================== */
:root {
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --font-head: var(--font-body);
  --font-brand: var(--font-body);
  --body-weight: 400;
  --head-weight: 600;
  --brand-weight: 800;
  --radius: .75rem;           /* cards */
  --btn-radius: .375rem;      /* buttons & inputs */
  --topbar-bg: var(--surface);
  --topbar-fg: var(--text);
  --topbar-border: var(--border);
  --topbar-accent: transparent;   /* coloured line under top bar */
  --topbar-brand: var(--brand-dark);
  --topbar-btn-border: var(--border);
  --sidebar-fg: var(--text);
  --sidebar-muted: var(--text-muted);
  --sidebar-border: var(--border);
  --sidebar-hover-bg: var(--brand-soft);
  --sidebar-active-bg: var(--brand-soft);
  --sidebar-active-fg: var(--text);
  --sidebar-icon: var(--brand);
  --sidebar-brand: var(--brand-dark);
  --sidebar-link-radius: 0;
  --sidebar-link-margin: 0;
  --thead-bg: #F7F1E8;
  --thead-fg: var(--text);
  --row-hover: #FBF6EE;
  --stripe: #FCFAF6;
  --card-header-bg: var(--brand-soft);
  --card-header-fg: var(--text);
  --total-color: #c0392b;     /* Net Total + totals row */
  --total-bg: #faf6ef;
  --kpi-top: 3px;             /* thickness of the KPI accent line */
  --kpi-bg: linear-gradient(180deg, var(--brand-soft), var(--surface) 70%);
  --shadow-hover: 0 2px 6px rgba(60,45,30,.1), 0 8px 20px rgba(60,45,30,.08);
  --btn-weight: 500;
  --label-transform: uppercase;
}
body { font-family: var(--font-body); font-weight: var(--body-weight); }
h1,h2,h3,h4,h5,h6, .kpi-value, .net-total-value { font-family: var(--font-head); }
h3, h4, h5, h6 { font-weight: var(--head-weight); }
.erp-navbar { background: var(--topbar-bg); color: var(--topbar-fg); border-bottom: 1px solid var(--topbar-border); box-shadow: var(--shadow), inset 0 -3px 0 var(--topbar-accent); }
.erp-navbar .navbar-brand { color: var(--topbar-brand); font-family: var(--font-brand); font-weight: var(--brand-weight); }
.erp-navbar .brand-sub { color: var(--topbar-fg); opacity: .65; }
.erp-navbar .small { color: var(--topbar-fg); }
.erp-navbar .btn-outline-secondary, .erp-navbar .btn-outline-brand { --bs-btn-border-color: var(--topbar-btn-border); --bs-btn-color: var(--topbar-fg); }
.erp-sidebar { background-color: var(--sidebar-bg) !important; color: var(--sidebar-fg); border-right: 1px solid var(--sidebar-border); }
.sidebar-brand { border-color: var(--sidebar-border) !important; }
.sidebar-brand .wordmark { color: var(--sidebar-brand); font-family: var(--font-brand); font-weight: var(--brand-weight); }
.sidebar-brand .text-muted, .sidebar-brand .erp-version { color: var(--sidebar-muted) !important; }
.erp-sidebar .nav-link { color: var(--sidebar-fg); border-radius: var(--sidebar-link-radius); margin: 0 var(--sidebar-link-margin); }
.erp-sidebar .nav-link:hover { background: var(--sidebar-hover-bg); color: var(--sidebar-active-fg); }
.erp-sidebar .nav-link.active { background: var(--sidebar-active-bg); color: var(--sidebar-active-fg); border-left-color: var(--brand); font-weight: 600; }
.erp-sidebar .nav-link i { color: var(--sidebar-icon); }
.nav-header { color: var(--sidebar-muted); text-transform: var(--label-transform); }
.card { border-radius: var(--radius); }
.card-header { background: var(--card-header-bg); color: var(--card-header-fg); border-top-left-radius: var(--radius) !important; border-top-right-radius: var(--radius) !important; }
.table { --bs-table-hover-bg: var(--row-hover); --bs-table-striped-bg: var(--stripe); }
.table-light, .table > thead.table-light > tr > *, .table > tfoot.table-light > tr > * { --bs-table-bg: var(--thead-bg); --bs-table-color: var(--thead-fg); color: var(--thead-fg); }
.btn, .form-control, .form-select { border-radius: var(--btn-radius); }
.btn { font-weight: var(--btn-weight); }
.kpi-label { text-transform: var(--label-transform); }
.kpi-accent { border-top: var(--kpi-top) solid var(--brand); background: var(--kpi-bg); }
a .kpi:hover { box-shadow: var(--shadow-hover); }
.net-total-box { border-radius: var(--radius); }
.net-total-label, .net-total-value { color: var(--total-color); }
.line-totals th { color: var(--total-color); background: var(--total-bg); }
.card-header-alert { background: var(--danger-soft) !important; color: var(--danger); }
:root { --focus-ring: rgba(184, 134, 75, .18); }
:root { --info-bg: #F7F1E8; }
.form-control:focus, .form-select:focus { box-shadow: 0 0 0 .2rem var(--focus-ring); }
.btn-outline-danger { --bs-btn-border-color: var(--danger-border, #E3B8AF); }
.alert-info { --bs-alert-bg: var(--info-bg); --bs-alert-color: var(--text); }
.table-secondary { --bs-table-bg: var(--stripe); }
/* OPTION 5 - Charcoal & Gold : dark charcoal sidebar + top bar, white content, gold accent, serif brand */
:root {
  --info-bg: #F8F0DC;
  --brand: #C79A3B; --brand-dark: #A57B22; --brand-soft: #F8F0DC; --brand-contrast: #1F1F1F;
  --bs-primary-rgb: 199, 154, 59; --focus-ring: rgba(199, 154, 59, .25);
  --bg: #F7F7F5; --surface: #FFFFFF; --sidebar-bg: #25272B;
  --text: #25272B; --text-muted: #77797F; --border: #E4E4E0;
  --success: #3F8A5A; --danger: #B83A2E; --danger-soft: #FBEAE7;
  --shadow: 0 1px 2px rgba(0, 0, 0, .06), 0 6px 18px rgba(0, 0, 0, .05);
  --font-body: "Inter", system-ui, sans-serif; --font-head: "Inter", system-ui, sans-serif; --font-brand: "Cormorant Garamond", Georgia, serif;
  --head-weight: 600; --brand-weight: 700; --btn-weight: 600;
  --radius: .6rem; --btn-radius: .4rem;
  --topbar-bg: #1B1D20; --topbar-fg: #EDEBE6; --topbar-border: #1B1D20; --topbar-brand: #D9B35A; --topbar-btn-border: #55575C; --topbar-accent: #C79A3B;
  --sidebar-fg: #D8D6D0; --sidebar-muted: #8E8F94; --sidebar-border: #383A3F;
  --sidebar-hover-bg: #34363B; --sidebar-active-bg: #34363B; --sidebar-active-fg: #FFFFFF; --sidebar-icon: #C79A3B; --sidebar-brand: #D9B35A;
  --thead-bg: #F1EEE6; --thead-fg: #25272B; --row-hover: #FBF8F0; --stripe: #FAFAF8;
  --card-header-bg: #FFFFFF; --total-color: #A57B22; --total-bg: #F8F0DC;
  --kpi-top: 3px; --kpi-bg: #FFFFFF;
  --shadow-hover: 0 6px 20px rgba(0, 0, 0, .14);
}
.erp-navbar .brand-sub { color: #C79A3B; opacity: 1; }
.erp-navbar .navbar-brand { font-size: 1.5rem; letter-spacing: .12em; }
.erp-navbar .btn-outline-secondary, .erp-navbar .btn-outline-brand { --bs-btn-hover-bg: #C79A3B; --bs-btn-hover-color: #1B1D20; --bs-btn-hover-border-color:#C79A3B; }
.erp-navbar .badge-soft, .erp-navbar .badge-soft-gold { background: #C79A3B; color: #1B1D20; border-color:#C79A3B; }
.sidebar-brand .wordmark { font-size: 1.7rem; letter-spacing: .14em; }
.erp-sidebar .nav-link.active { border-left-color: #C79A3B; }
.erp-sidebar .nav-link:hover { border-left-color: #C79A3B; }
.nav-header { color: #C79A3B; opacity: .85; }
.btn-primary { --bs-btn-color: #1F1F1F; --bs-btn-hover-color: #1F1F1F; --bs-btn-active-color:#1F1F1F; }
.card-header { border-bottom: 2px solid #C79A3B; font-weight: 600; }
.erp-sidebar { scrollbar-color: #55575C #25272B; }

/* ==========================================================================
   v3.0 additions: reports, print, live search, order progress badges
   ========================================================================== */
.print-only { display: none; }
.live-loading { opacity: .55; transition: opacity .15s; }
.btn-outline-brand { --bs-btn-color: var(--brand-dark); --bs-btn-border-color: var(--brand); --bs-btn-hover-bg: var(--brand); --bs-btn-hover-color: var(--brand-contrast, #1F1F1F); --bs-btn-hover-border-color: var(--brand); }
.badge-soft { background: var(--brand-soft); color: var(--brand-dark); border: 1px solid var(--brand); }
.badge-soft-gold { background: var(--brand); color: var(--brand-contrast, #1F1F1F); }

/* report tiles on the Reports page */
.report-section-title { color: var(--brand-dark); text-transform: uppercase; letter-spacing: .08em; font-size: .85rem; font-weight: 700; border-bottom: 2px solid var(--brand); padding-bottom: .3rem; }
.report-tile { display: flex; gap: .85rem; align-items: center; padding: .85rem 1rem; background: var(--surface); border: 1px solid var(--border); border-left: 4px solid var(--brand);
  border-radius: var(--radius); text-decoration: none; color: var(--text); height: 100%; box-shadow: var(--shadow); }
.report-tile:hover { box-shadow: var(--shadow-hover); border-left-color: var(--brand-dark); color: var(--text); }
.report-tile .rt-icon { font-size: 1.6rem; color: var(--brand); line-height: 1; }
.report-tile .rt-title { display: block; font-weight: 700; }
.report-tile .rt-text { display: block; font-size: .8rem; color: var(--text-muted); }

/* report tables */
.rpt-table thead th { background: var(--thead-bg); color: var(--thead-fg); font-size: .8rem; text-transform: uppercase; letter-spacing: .03em; white-space: nowrap; border-bottom: 2px solid var(--brand); }
.rpt-table tfoot th, .rpt-table tfoot td { background: var(--total-bg); color: var(--total-color); font-weight: 700; border-top: 2px solid var(--brand); }
.rpt-table .grp-row td { background: var(--brand-soft); font-weight: 700; color: var(--text); }
.rpt-table .sub-row td { background: var(--stripe); font-weight: 600; }
.rpt-table .total-row td { background: var(--total-bg); color: var(--total-color); font-weight: 700; border-top: 2px solid var(--brand); }
.rpt-table .items-row td { background: #FCFBF8; }
.rpt-table .sub-party td { background: #FCFBF8; }
.rpt-table .inner-items { background: transparent; }
.rpt-table .inner-items th { background: transparent; border-bottom: 1px solid var(--border); font-size: .72rem; }
.rpt-table .inner-items td { border-bottom: 0; padding-top: .1rem; padding-bottom: .1rem; }
.adv-toggle { color: var(--brand-dark); font-weight: 600; text-decoration: none; cursor: pointer; }
.adv-box { border: 1px solid var(--border); border-radius: var(--radius); padding: .75rem 1rem 1rem; background: var(--stripe); }
.adv-title { font-weight: 700; color: var(--brand-dark); margin-bottom: .5rem; }

/* Sale order progress */
.progress-table th { white-space: nowrap; font-size: .75rem; }
.progress-table .grp-ordered { background: #EEF1F7; } .progress-table .grp-invoiced { background: #F4EFE3; }
.progress-table .grp-delivered { background: #E9F3EC; } .progress-table .grp-pending { background: #FBEAE7; }
.qty-badge { display: inline-block; min-width: 2.2rem; padding: .05rem .4rem; border-radius: 1rem; font-weight: 700; text-align: right; }
.qb-wait { background: #FFF1CC; color: #7A5A00; } .qb-part { background: #DCEBFA; color: #1B4F80; } .qb-done { background: #DDF0E3; color: #266A3D; } .qb-cancel { background: #E6E6E6; color: #666; }
.state-badge { display: inline-block; padding: .15rem .6rem; border-radius: 1rem; font-size: .75rem; font-weight: 700; }
.sb-wait { background: #FFE9A8; color: #7A5A00; } .sb-part { background: #BFDDF7; color: #1B4F80; } .sb-done { background: #BFE5CB; color: #266A3D; } .sb-cancel { background: #D6D6D6; color: #555; }

/* printing (A4 pages: reports, ledgers, detail pages) */
.report-print-head { text-align: center; margin-bottom: 8px; }
.report-print-head .rp-brand { font-family: var(--font-brand); font-size: 22px; font-weight: 700; letter-spacing: .12em; }
.report-print-head .rp-title { font-size: 16px; font-weight: 700; }
.report-print-head .rp-period, .report-print-head .rp-meta { font-size: 11px; color: #444; }
@media print {
  @page { margin: 10mm; }
  body { background: #fff !important; }
  .print-only { display: block !important; }
  .no-print, .erp-navbar, .erp-sidebar, .btn, .alert-dismissible .btn-close, .adv-toggle, .pagination, #live-results + nav { display: none !important; }
  form { display: none !important; }
  .erp-main { margin: 0 !important; padding: 0 !important; }
  .card { box-shadow: none !important; border: 1px solid #bbb !important; }
  .card-header { background: #fff !important; }
  .table-responsive { overflow: visible !important; }
  .rpt-table { font-size: 10.5px; }
  .rpt-table tr { page-break-inside: avoid; }
  a { color: #000 !important; text-decoration: none !important; }
  .rpt-table .grp-row td, .rpt-table .sub-row td, .rpt-table tfoot th { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}
.rpt-table .inner-items, .ledger-table .inner-items { table-layout: fixed; width: 100%; }
.inner-items th:nth-child(n+2), .inner-items td:nth-child(n+2) { width: 64px; }
.inner-items th:nth-child(5), .inner-items td:nth-child(5) { width: 110px; }
.inner-items th:nth-child(6), .inner-items td:nth-child(6) { width: 100px; }

/* ===== v3.0 shared quantity-status colours (Sale Order detail, Sale Order Report, Pending Orders, Delivery screens) =====
   Ordered = neutral charcoal, Invoiced = blue, Delivered = green, Pending / Remaining = bold deep orange-red.
   Always use these classes (templates/sales/_qty3.html, _qs.html) - never colour a quantity by hand. */
:root { --qs-ordered-bg:#E7E4DF; --qs-ordered-fg:#2E2A27; --qs-invoiced-bg:#D6E8FB; --qs-invoiced-fg:#0B4A8F;
        --qs-delivered-bg:#D5EEDB; --qs-delivered-fg:#16622C; --qs-pending-bg:#C73A12; --qs-pending-fg:#FFFFFF; }
.qs { display: inline-block; min-width: 2.2rem; padding: .08rem .5rem; border-radius: .35rem; font-weight: 600; text-align: right; line-height: 1.35;
      -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.qs-ordered   { background: var(--qs-ordered-bg);   color: var(--qs-ordered-fg);   border: 1px solid #CFC8BD; }
.qs-invoiced  { background: var(--qs-invoiced-bg);  color: var(--qs-invoiced-fg);  border: 1px solid #9CC4EE; }
.qs-delivered { background: var(--qs-delivered-bg); color: var(--qs-delivered-fg); border: 1px solid #98CDA6; }
.qs-pending   { background: var(--qs-pending-bg);   color: var(--qs-pending-fg);   border: 1px solid #A32D0B; font-weight: 800; }
.qs-pending.qs-zero { background: transparent; color: var(--text-muted); border-color: transparent; font-weight: 400; }
th.qs-h-ordered   { background: var(--qs-ordered-bg) !important;   color: var(--qs-ordered-fg) !important;   border-bottom: 3px solid #6B645C !important; }
th.qs-h-invoiced  { background: var(--qs-invoiced-bg) !important;  color: var(--qs-invoiced-fg) !important;  border-bottom: 3px solid #1F6FC4 !important; }
th.qs-h-delivered { background: var(--qs-delivered-bg) !important; color: var(--qs-delivered-fg) !important; border-bottom: 3px solid #2E8B4A !important; }
th.qs-h-pending   { background: var(--qs-pending-bg) !important;   color: var(--qs-pending-fg) !important;   border-bottom: 3px solid #7A1F05 !important; }
td.qs-cell-pending { background: #FDE9E2; }                    /* soft tint behind a pending cell so it stands out in a row */
/* Delivery priority */
.pri-badge { display: inline-block; padding: .1rem .55rem; border-radius: .35rem; font-size: .72rem; font-weight: 800; letter-spacing: .06em; }
.pri-urgent { background: #C0281B; color: #fff; -webkit-print-color-adjust: exact; print-color-adjust: exact; }
.pri-normal { background: #EFEBE5; color: #6B645C; font-weight: 600; }
tr.row-urgent > td { background: #FCE4E0 !important; }
tr.row-urgent > td:first-child { box-shadow: inset 4px 0 0 #C0281B; }
select.priority-urgent { border-color: #C0281B !important; color: #C0281B; font-weight: 700; background-color: #FCE4E0; }
/* Urdu text on screens (bundled font, works offline) */
@font-face { font-family: "UrduNaskh"; src: url("../fonts/NotoNaskhArabic.ttf") format("truetype"); font-weight: 400 700; font-display: block; }
.urdu-label, .urdu-text { font-family: "UrduNaskh", "Noto Naskh Arabic", "Jameel Noori Nastaleeq", "Urdu Typesetting", Tahoma, serif; direction: rtl; unicode-bidi: isolate; font-size: 1.1em; }
.freight-choices .form-check { padding: .35rem .6rem .35rem 1.8rem; border: 1px solid var(--border); border-radius: .4rem; background: #fff; }
.pay-box { border: 1px solid var(--border); border-left: 4px solid var(--brand); border-radius: .4rem; background: #fff; padding: .5rem .8rem; }
.pay-box .due { font-weight: 800; }
.pay-box .due.pos { color: var(--qs-pending-bg); } .pay-box .due.zero { color: var(--qs-delivered-fg); }
/* Sale Order Report: items are always shown when printing */
@media print { .order-report tr.ord-items { display: table-row !important; } .ord-toggle { display: none !important; } }
.order-report .ord-head td { border-top: 2px solid var(--border); }
@media print { .commission-table tr.com-detail { display: table-row !important; } .com-toggle { display: none !important; } }

/* ===== Ledger (same layout as the printed reference ledger) ===== */
.ledger-ref { max-width: 1100px; margin: 0 auto; }
.ledger-sheet { width: 100%; border-collapse: collapse; table-layout: fixed; background: #fff; border: 1px solid #333; font-size: .82rem; color: #000; }
.ledger-sheet th, .ledger-sheet td { border: 1px solid #333; padding: 3px 6px; vertical-align: top; }
.ledger-sheet .lg-title th { text-align: left; font-size: 1.05rem; padding: 6px 8px; background: #fff; border-bottom: 0; }
.ledger-sheet .lg-sub th { text-align: center; color: var(--text-muted, #777); font-weight: 700; background: #fff; border-top: 0; }
.ledger-sheet .lg-head th { text-align: center; background: var(--brand-soft, #f5ebdd); font-weight: 700; }
.ledger-sheet .lg-begin td, .ledger-sheet .lg-end td { font-weight: 700; background: #faf8f5; vertical-align: middle; }
.ledger-sheet .lg-begin td:first-child { text-align: center; }
.ledger-sheet .lg-end td:first-child { text-align: center; }
.ledger-sheet .lg-c { text-align: center; white-space: nowrap; vertical-align: middle; }
.ledger-sheet .lg-num { text-align: right; white-space: nowrap; vertical-align: middle; }
.ledger-sheet .lg-row .lg-desc { padding: 2px; }
.ledger-sheet .lg-row > td:not(.lg-desc) { vertical-align: middle; }
.ledger-sheet col.c-date { width: 9%; } .ledger-sheet col.c-vch { width: 11.5%; } .ledger-sheet col.c-desc { width: 49.5%; }
.ledger-sheet col.c-dr { width: 9%; } .ledger-sheet col.c-cr { width: 9%; } .ledger-sheet col.c-bal { width: 12%; }
.ledger-sheet .lg-docid { font-size: .72rem; padding: 1px 4px; }
.lg-items { width: 100%; border-collapse: collapse; table-layout: fixed; margin: 0; }
.lg-items td { border: 1px solid #333; padding: 3px 5px; font-size: .75rem; vertical-align: middle; overflow: visible; }
.lg-items col.k-m { width: 20%; } .lg-items col.k-b { width: 20%; } .lg-items col.k-it { width: 35%; } .lg-items col.k-rt { width: 10%; } .lg-items col.k-am { width: 15%; }
.lg-items td.q { text-align: right; white-space: nowrap; }
.lg-items td.it { text-align: left; white-space: normal; word-break: normal; overflow-wrap: anywhere; line-height: 1.25; }
.lg-items td.rt { text-align: right; white-space: nowrap; }
.lg-items td.am { text-align: right; white-space: nowrap; }
.lg-items tr.tot td { font-weight: 700; }
.lg-tools { display: flex; justify-content: center; gap: 34px; margin: 16px 0; }
.lg-tools a { text-align: center; text-decoration: none; color: var(--text); font-size: .78rem; }
.lg-tools i { display: block; font-size: 1.7rem; color: var(--brand-dark); }
@media print {
  @page { size: A4; margin: 8mm; }
  .ledger-ref { max-width: none; }
  .ledger-sheet { font-size: 8.5pt; }
  .ledger-sheet tr.lg-row { break-inside: auto; }
  .lg-items tr { break-inside: avoid; }
  .ledger-sheet th, .ledger-sheet td { padding: 2px 4px; }
  .lg-items td { padding: 2px 3px; font-size: 7.5pt; }
  .ledger-sheet .lg-docid { font-size: 7.5pt; }
  .ledger-sheet thead { display: table-header-group; }
  .ledger-sheet .lg-head th, .ledger-sheet .lg-begin td, .ledger-sheet .lg-end td { -webkit-print-color-adjust: exact; print-color-adjust: exact; }
}

/* ===== Dashboard quick shortcuts ===== */
.shortcut-btn { display: flex; align-items: center; justify-content: center; gap: .6rem; min-height: 64px; padding: .6rem .8rem; border-radius: .6rem; text-decoration: none; font-weight: 700; font-size: 1.02rem; text-align: center;
  background: #2E2A27; color: #E7C37A; border: 2px solid #B8864B; box-shadow: var(--shadow); transition: transform .08s, background .15s; }
.shortcut-btn i { font-size: 1.6rem; }
.shortcut-btn:hover { background: #B8864B; color: #1c1c1c; transform: translateY(-1px); }
@media (max-width: 575px) { .shortcut-btn { min-height: 56px; font-size: .92rem; flex-direction: column; gap: .15rem; } .shortcut-btn i { font-size: 1.35rem; } }
/* ===== rich lists ===== */
.rich-table .due-red { color: #C73A12; font-weight: 800; } .rich-table .due-ok { color: var(--qs-delivered-fg); font-weight: 600; }
.rich-table .items-first { max-width: 16rem; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.rich-table th .sort-link { color: inherit; }
.rich-table td { vertical-align: middle; }
/* ===== users & roles ===== */
.role-chip { border: 1px solid var(--bs-border-color); border-radius: .5rem; padding: .35rem .8rem; cursor: pointer; background: var(--bs-body-bg); }
.role-chip:has(input:checked) { border-color: var(--gold, #B8893B); background: rgba(184,137,59,.14); font-weight: 600; }
.perm-matrix .perm-group th { background: var(--bs-tertiary-bg); font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.perm-matrix .perm-cb, .perm-matrix .row-all { width: 1.25rem; height: 1.25rem; cursor: pointer; }
.perm-matrix td:first-child { min-width: 16rem; }
/* ===== line stock / godown / rate history ===== */
.stock-line { margin-top: .2rem; color: var(--bs-secondary-color); line-height: 1.35; }
.stock-line b { color: var(--bs-body-color); }
.stock-warn { margin-top: .2rem; padding: .15rem .45rem; border-radius: .3rem; font-weight: 600; }
.stock-warn.warn-yellow { background: #FFF3C4; color: #6B4E00; border: 1px solid #E8C547; }
.stock-warn.warn-red { background: #FDE2DD; color: #A0260C; border: 1px solid #E5806A; }
.stock-warn a { color: inherit; text-decoration: underline; cursor: pointer; }
.rate-history { font-size: .75rem; line-height: 1.35; max-width: 22rem; }
.rate-history .rate-pick { font-weight: 700; text-decoration: none; padding: 0 .15rem; border-radius: .2rem; }
.rate-history .rate-pick:hover { background: rgba(184,137,59,.25); }
.rate-history .rate-pick.rate-mine { background: #D6E8FB; color: #0B4A8F; outline: 1px solid #0B4A8F; }
.rate-history .rate-mine-note { color: #0B4A8F; }
[data-bs-theme="dark"] .stock-warn.warn-yellow { background: #4a3d0c; color: #ffe08a; border-color: #8a7220; }
[data-bs-theme="dark"] .stock-warn.warn-red { background: #4d1c13; color: #ffb4a2; border-color: #9a4b3b; }
/* ===== chart of accounts ===== */
.chart-table .chart-group th { background: var(--bs-tertiary-bg); font-size: .8rem; text-transform: uppercase; letter-spacing: .04em; }
.lg-code { color: #6c757d; font-weight: 400; }
@media print { .chart-card { break-inside: avoid; } }

.f10-hint { font-size: .72rem; background: #f1efe9; color: #6b5a3a; border: 1px solid #d9d2c3; border-radius: 4px; padding: 1px 6px; box-shadow: none; font-weight: 600; }
@media print { .f10-hint { display: none; } }

/* ---- Reports page (note 62a): 3 columns of cards, one per group ---- */
.rp-search { position: relative; min-width: 280px; }
.rp-search i { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); color: var(--text-muted); }
.rp-search input { padding-left: 2rem; }
.rp-cards { column-count: 3; column-gap: 1.1rem; }
@media (max-width: 1199px) { .rp-cards { column-count: 2; } }
@media (max-width: 767px) { .rp-cards { column-count: 1; } .rp-search { min-width: 100%; } }
.rp-card { break-inside: avoid; background: var(--surface); border: 1px solid var(--border); border-radius: 1rem; padding: 1rem 1.15rem .6rem; margin-bottom: 1.1rem; box-shadow: var(--shadow); }
.rp-card-title { font-weight: 700; margin: 0 0 .5rem; padding-bottom: .5rem; border-bottom: 2px solid var(--brand-soft); color: var(--text); }
.rp-fav .rp-card-title i { color: var(--brand); }
.rp-list { list-style: none; margin: 0; padding: 0; }
.rp-item { display: flex; justify-content: space-between; align-items: flex-start; gap: .5rem; padding: .5rem 0; border-bottom: 1px solid var(--border); }
.rp-item:last-child { border-bottom: 0; }
.rp-link { font-weight: 600; color: var(--brand-dark); text-decoration: none; }
.rp-link:hover { color: var(--text); text-decoration: underline; }
.rp-desc { font-size: .8rem; color: var(--text-muted); line-height: 1.25; }
.rp-new { font-size: .62rem; font-weight: 700; background: var(--brand); color: #fff; border-radius: 99px; padding: 1px 7px; vertical-align: middle; text-transform: uppercase; letter-spacing: .03em; }
.rp-star { background: none; border: 0; color: #c9bfae; font-size: 1.05rem; padding: 0 .15rem; cursor: pointer; }
.rp-star:hover, .rp-star.on { color: var(--brand); }

/* ---- Business Overview module (note 55) ---- */
.bo-tabs .nav-link { color: var(--text); border-radius: 99px; padding: .35rem .95rem; }
.bo-tabs .nav-link.active { background: var(--brand); color: #fff; }
.bo-card { display: block; background: var(--surface); border: 1px solid var(--border); border-radius: 1rem; padding: 1.1rem 1.2rem; box-shadow: var(--shadow); color: var(--text); text-decoration: none; height: 100%; }
.bo-card:hover { box-shadow: var(--shadow-hover); color: var(--text); }
.bo-icon { font-size: 1.5rem; color: var(--brand); }
.bo-title { font-weight: 700; }
.bo-fig { font-size: 1.6rem; font-weight: 800; color: var(--brand-dark); }

/* status chips (list + detail): same colours everywhere */
.st-pending { background: #e9ecef !important; color: #495057 !important; }
.st-sent { background: #d9e8ff !important; color: #0b4a9e !important; }
.st-partial { background: #ffe8b3 !important; color: #8a5a00 !important; }
.st-invoiced { background: #d3f2dc !important; color: #14653a !important; }

/* ---- Global search (note 64) ---- */
.gs-wrap { position: relative; max-width: 520px; min-width: 0; }
.gs-box { position: relative; }
.gs-box > i { position: absolute; left: .7rem; top: 50%; transform: translateY(-50%); color: var(--muted, #8a8f98); pointer-events: none; }
.gs-box input { padding-left: 2.1rem; padding-right: 3.6rem; border-radius: 99px; }
.gs-kbd { position: absolute; right: .6rem; top: 50%; transform: translateY(-50%); font-size: .68rem; background: #eee; color: #666; border-radius: .3rem; padding: .05rem .35rem; }
.gs-results { position: absolute; left: 0; right: 0; top: calc(100% + .35rem); background: #fff; border: 1px solid var(--border, #ddd); border-radius: .8rem; box-shadow: 0 10px 30px rgba(0,0,0,.18); max-height: 70vh; overflow-y: auto; z-index: 1080; min-width: 340px; }
.gs-head { font-size: .68rem; text-transform: uppercase; letter-spacing: .06em; color: #8a8f98; padding: .5rem .8rem .15rem; font-weight: 700; }
.gs-row { display: flex; align-items: center; gap: .6rem; padding: .35rem .8rem; color: inherit; text-decoration: none; }
.gs-row:hover, .gs-row.active { background: #f6efe0; }
.gs-title { font-weight: 600; flex: 0 1 auto; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-sub { flex: 1 1 auto; font-size: .8rem; color: #8a8f98; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gs-badge { font-size: .66rem; font-weight: 700; padding: .1rem .5rem; border-radius: 99px; background: #e9ecef; color: #495057; }
.gs-b-reports { background: #e3ecff; color: #1d4aa8; } .gs-b-items { background: #fff1cc; color: #8a5a00; } .gs-b-customers { background: #d8f3e3; color: #14653a; }
.gs-b-vendors { background: #fde0d6; color: #a1330f; } .gs-b-vouchers { background: #ece3fb; color: #5b2ea6; } .gs-b-accounts { background: #d9f1f5; color: #0c6171; }
.gs-empty { padding: .9rem; color: #8a8f98; text-align: center; }
.gs-icon { display: none; }
@media (max-width: 767.98px) {
  .gs-icon { display: inline-block; }
  .gs-wrap:not(.gs-open) { display: none; }
  .gs-wrap.gs-open { position: fixed; left: .5rem; right: .5rem; top: 3.4rem; max-width: none; margin: 0 !important; z-index: 1090; }
}
@media print { .gs-wrap, .gs-icon { display: none !important; } }
.gs-results, .gs-results a, .gs-results a:hover { color: #23262b !important; }
.gs-results .gs-sub { color: #7a8089 !important; }
.gs-results { min-width: 560px; }
.gs-results .gs-title { max-width: 55%; }
@media (max-width: 767.98px) { .gs-results { min-width: 0; } }

/* ---- v3.0.1: compact voucher screens - everything fits a 1366 / 1280 px laptop (and Windows 125% zoom) without sideways scrolling ---- */
.doc-head .form-label { font-size: .78rem; margin-bottom: .1rem; color: var(--bs-secondary-color); }
.doc-head .form-control, .doc-head .form-select { padding: .22rem .45rem; font-size: .85rem; min-height: 0; }
.doc-head .form-text { font-size: .72rem; margin-top: .1rem; }
.doc-head .row > [class*="col"] { min-width: 0; }
.doc-head select { max-width: 100%; text-overflow: ellipsis; }
.doc-grid { font-size: .84rem; }
.doc-grid > :not(caption) > * > * { padding: .25rem .3rem; }
.doc-grid .form-control, .doc-grid .form-select { padding: .2rem .35rem; font-size: .84rem; min-width: 0; width: 100%; }
.doc-grid .item-search { margin-bottom: .2rem !important; }
.doc-grid .rate-history { max-width: 100%; white-space: normal; max-height: 4.4em; overflow-y: auto; }
.doc-grid .stock-line, .doc-grid .godown-hint, .doc-grid .pending-hint, .doc-grid .rate-unit { font-size: .72rem; white-space: normal; overflow-wrap: anywhere; }
.doc-grid .btn-sm { padding: .15rem .4rem; }
.doc-grid .d-flex.gap-1 { flex-wrap: nowrap; }
.net-total-box { padding: .25rem .9rem; }
.net-total-value { font-size: 1.6rem; line-height: 1.1; }
.doc-grid td.line-godown-cell { max-width: 230px; }

/* ---- v3.0.2: live lists ("+ New ..." links, refresh button, toast) ---- */
.lookup-tools { font-size: .72rem; font-weight: 600; margin-left: .4rem; white-space: nowrap; }
.lookup-tools a { text-decoration: none; margin-left: .3rem; color: var(--brand-dark, #8a6a2f); }
.lookup-tools a:hover { text-decoration: underline; }
.lookup-toast { position: fixed; right: 1rem; bottom: 1rem; z-index: 2000; background: #2b2723; color: #f3e6c8; border: 1px solid var(--brand, #b8864b); border-radius: .5rem; padding: .5rem .9rem; font-size: .85rem; opacity: 0; pointer-events: none; transition: opacity .25s; max-width: 28rem; }
.lookup-toast.show { opacity: 1; }

/* v3.0.2 "+ Add Delivery" picker */
.dp-row.active .dp-left { color: #fff; }
.dp-row.dp-done { opacity: .6; }
.dp-left { color: #6b6b6b; }