:root {
  --primary: #6657d9;
  --primary-dark: #5142be;
  --primary-light: #eeecff;
  --success: #16835f;
  --warning: #c77a12;
  --danger: #c33d4a;
  --sidebar-bg: #111c33;
  --sidebar-text: #b8c3d7;
  --sidebar-hover: rgba(255, 255, 255, .055);
  --sidebar-border: #23304a;
  --body-bg: #f4f6f9;
  --text-primary: #172033;
  --text-secondary: #5f6c80;
  --text-muted: #8792a5;
  --border-light: #e6e9ef;
  --border-medium: #d7dce5;
  --card-shadow: 0 1px 2px rgba(15, 23, 42, .035);
  --card-shadow-hover: 0 2px 5px rgba(15, 23, 42, .055);
  --shell-sidebar-width: 240px;
  --space-1: .25rem;
  --space-2: .5rem;
  --space-3: .75rem;
  --space-4: 1rem;
  --space-5: 1.25rem;
  --space-6: 1.5rem;
  --radius-sm: 8px;
  --radius-md: 11px;
}

body { background: var(--body-bg); color: var(--text-primary); line-height: 1.5; }
.sidebar { width: var(--shell-sidebar-width); padding: 1.25rem .85rem 1rem; box-shadow: none; }
.brand { margin: 0 0 1.15rem; padding: .2rem .65rem 1.05rem; border-bottom: 1px solid var(--sidebar-border); }
.brand-link { display: flex; flex-direction: column; color: #fff; text-decoration: none; line-height: 1.15; }
.brand-name { font-size: 1.25rem; font-weight: 750; letter-spacing: .08em; }
.brand-context { margin-top: .34rem; color: #8998b2; font-size: .69rem; font-weight: 550; letter-spacing: .08em; text-transform: uppercase; }
.menu { overflow-y: auto; }
.menu li { margin-bottom: .12rem; }
.menu .menu-group-label { margin: .8rem .65rem .3rem; color: #6f809d; font-size: .62rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.menu a { gap: .7rem; min-height: 39px; padding: .58rem .7rem; border-radius: var(--radius-sm); font-size: .84rem; }
.menu a::before { height: 52%; width: 2px; }
.menu a:hover { transform: none; }
.menu a.active { background: rgba(102, 87, 217, .18); box-shadow: none; }
.menu a.active i { color: #a99fff; }
.sidebar-footer { padding: .8rem .5rem 0; font-size: .68rem; }
.main { margin-left: var(--shell-sidebar-width); width: calc(100% - var(--shell-sidebar-width)); padding: 1rem 1.5rem 2rem; }
.main > main, .flash-wrap { max-width: 1600px; margin-left: auto; margin-right: auto; }
.topbar { min-height: 66px; margin: 0 auto 1rem; padding: .7rem 1rem; border: 1px solid var(--border-light); border-radius: var(--radius-md); box-shadow: var(--card-shadow); max-width: 1600px; }
.page-heading-wrap, .page-heading { min-width: 0; }
.page-heading-wrap { display: flex; align-items: center; }
.page-title { display: block; font-size: 1.24rem; font-weight: 700; letter-spacing: -.015em; }
.page-title::before { display: none; }
.page-context { margin-top: .12rem; color: var(--text-muted); font-size: .76rem; }
.user-menu { gap: .55rem; }
.page-actions { margin-left: auto; }
.header-actions, .row-actions { display: flex; align-items: center; gap: .45rem; }
.page-actions:empty { display: none; }
.user-avatar { width: 32px; height: 32px; border-radius: 8px; background: var(--primary); box-shadow: none; }
.user-menu > .dropdown > .btn, .theme-toggle { min-height: 38px; padding: .42rem .68rem; }
.card, .search-container { border: 1px solid var(--border-light); border-radius: var(--radius-md); box-shadow: var(--card-shadow); }
.card { margin-bottom: 1rem; }
.card:hover { transform: none; box-shadow: var(--card-shadow); }
.card-header { padding: 1rem 1.15rem; border-radius: var(--radius-md) var(--radius-md) 0 0 !important; }
.card-body { padding: 1.15rem; }
.btn { border-radius: var(--radius-sm); padding: .6rem 1rem; }
.btn-primary { background: var(--primary); box-shadow: none; }
.btn-primary:hover { background: var(--primary-dark); transform: none; box-shadow: none; }
.form-control, .form-select { border-radius: var(--radius-sm); }
.pager-card { background: var(--card-bg); backdrop-filter: none; border: 1px solid var(--border-light); border-radius: var(--radius-md); box-shadow: var(--card-shadow); }

.dashboard-page { display: grid; gap: var(--space-4); }
.collection-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: var(--space-3); }
.summary-card, .dashboard-section, .remaining-due-summary { background: var(--card-bg); border: 1px solid var(--border-light); border-radius: var(--radius-md); box-shadow: var(--card-shadow); }
.summary-card { position: relative; min-height: 112px; padding: 1rem 1.05rem; overflow: hidden; }
.summary-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--primary); }
.summary-card-tomorrow::before { background: #748199; }
.summary-card-overdue::before { background: var(--danger); }
.summary-card-total::before { background: var(--warning); }
.summary-label, .remaining-due-label { color: var(--text-secondary); font-size: .7rem; font-weight: 750; letter-spacing: .075em; text-transform: uppercase; }
.summary-amount { margin-top: .38rem; color: var(--text-primary); font-size: 1.55rem; font-variant-numeric: tabular-nums; font-weight: 750; letter-spacing: -.025em; }
.summary-count { margin-top: .22rem; color: var(--text-muted); font-size: .78rem; }
.dashboard-section { overflow: hidden; }
.dashboard-section-header { display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: .78rem 1rem; border-bottom: 1px solid var(--border-light); }
.dashboard-section-title { margin: 0; font-size: .94rem; font-weight: 700; }
.dashboard-table-scroll { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.dashboard-table { min-width: 1120px; margin: 0; font-size: .78rem; }
.dashboard-table th, .dashboard-table td { vertical-align: middle; }
.dashboard-table thead th { padding: .72rem .68rem; font-size: .7rem; letter-spacing: .025em; text-transform: uppercase; }
.dashboard-table tbody td { padding: .72rem .68rem; }
.dashboard-actions { display: flex; flex-wrap: nowrap; gap: .35rem; }
.dashboard-actions-cell { min-width: 150px; }
.dashboard-actions .btn { white-space: nowrap; }
.dashboard-empty { padding: 1.2rem; color: var(--text-muted); text-align: center; }
.remaining-due-summary { display: flex; align-items: center; justify-content: space-between; gap: 2rem; padding: 1.15rem 1.3rem; border-left: 3px solid var(--primary); }
.remaining-due-label { margin: 0; color: var(--text-primary); }
.remaining-due-help { margin: .25rem 0 0; color: var(--text-muted); font-size: .8rem; }
.remaining-due-amount { color: var(--text-primary); font-size: 1.7rem; font-weight: 750; font-variant-numeric: tabular-nums; letter-spacing: -.03em; white-space: nowrap; }

/* Phase 1B operational workbenches */
.orders-kpi-card { min-height: 84px; margin-bottom: 0; }
.orders-kpi-card .card-body { display: flex; flex-direction: column; justify-content: center; padding: .72rem .9rem; }
.orders-kpi-card .text-uppercase { font-size: .67rem !important; font-weight: 700; letter-spacing: .055em; }
.orders-kpi-card .fs-4, .orders-kpi-card .fs-5 { margin-top: .28rem; font-size: 1.28rem !important; font-variant-numeric: tabular-nums; line-height: 1.15; }
.workbench-filter-card .card-body, .due-filter-panel { padding: .82rem !important; }
.orders-filter-form .form-label { margin-bottom: .28rem; color: var(--text-secondary); font-size: .7rem; font-weight: 650; }
.orders-filter-form .form-control, .orders-filter-form .form-select { min-height: 35px; padding-top: .38rem; padding-bottom: .38rem; font-size: .8rem; }
.orders-filter-secondary-row { display: flex; justify-content: flex-end; align-items: end; gap: .75rem; margin-top: .5rem; }
.orders-filter-secondary-row.has-admin-filter { justify-content: space-between; }
.orders-admin-filter { flex: 0 1 360px; min-width: 240px; }
.orders-filter-actions { flex: 0 0 auto; }
.orders-actions-column { width: 92px; }
.row-actions, .collection-actions { flex-wrap: nowrap !important; white-space: nowrap; }
.action-overflow-toggle { width: 32px; padding-left: .35rem; padding-right: .35rem; font-size: 1.05rem; font-weight: 700; line-height: 1; }
.dropdown-menu { padding: .35rem; border-color: var(--border-light); border-radius: var(--radius-sm); box-shadow: 0 8px 22px rgba(15, 23, 42, .12); }
.dropdown-item { border-radius: 6px; padding: .45rem .65rem; font-size: .82rem; }
.table-container .table tbody td { font-variant-numeric: tabular-nums; }
.table-container .table thead th { color: var(--text-secondary); font-size: .7rem; letter-spacing: .025em; text-transform: uppercase; }

.collection-page { gap: .8rem !important; }
.due-summary-grid { gap: .6rem !important; }
.due-summary-grid .summary-card { min-height: 82px !important; padding: .72rem .85rem !important; }
.due-summary-grid .summary-value { margin-top: .28rem !important; font-size: 1.22rem !important; font-variant-numeric: tabular-nums; }
.preset-segments { display: inline-flex !important; gap: 0 !important; margin-bottom: .7rem !important; padding: 3px; border: 1px solid var(--border-medium); border-radius: var(--radius-sm); background: #f7f8fb; }
.preset-segment { padding: .4rem .62rem; border-radius: 6px; color: var(--text-secondary); font-size: .76rem; font-weight: 650; text-decoration: none; white-space: nowrap; }
.preset-segment:hover { color: var(--primary-dark); background: #fff; }
.preset-segment.active { color: #fff; background: var(--primary); box-shadow: 0 1px 2px rgba(15, 23, 42, .08); }
.due-filter-panel .form-control, .due-filter-panel .form-select { min-height: 32px; }
.collection-table thead th { padding: .66rem .58rem; color: var(--text-secondary); font-size: .68rem; letter-spacing: .02em; text-transform: uppercase; }
.collection-table tbody td { padding: .68rem .58rem; font-variant-numeric: tabular-nums; }
.collection-table tbody tr > td:first-child { border-left: 3px solid transparent; }
.collection-table tbody tr.row-due-today > td { background: #f7faff !important; }
.collection-table tbody tr.row-due-today > td:first-child { border-left-color: #4a7bd8; }
.collection-table tbody tr.row-recent-overdue > td { background: #fffdf7 !important; }
.collection-table tbody tr.row-recent-overdue > td:first-child { border-left-color: var(--warning); }
.collection-table tbody tr.row-serious-overdue > td { background: #fff9f9 !important; }
.collection-table tbody tr.row-serious-overdue > td:first-child { border-left-color: var(--danger); }
.pager-card .page-number.active { color: #fff; background: var(--primary); }

/* Phase 1C remaining module unification */
.customers-search-card .card-body { padding: .72rem .82rem; }
.customers-search-card .form-control { min-height: 34px; }
.customer-check-card { max-width: 1100px; }
.management-search-card { padding: .75rem !important; }
.management-search-card form { align-items: center; }
.management-search-card .form-control { min-height: 35px; }
.table-container { overflow-x: auto; border: 1px solid var(--border-light); border-radius: var(--radius-md); background: var(--card-bg); box-shadow: var(--card-shadow); }
.table-container .table { --bs-table-striped-bg: #fafbfc; --bs-table-hover-bg: #f7f8fb; }
.table-container .table > :not(caption) > * > * { border-bottom-color: #edf0f4; }
.table-container .table tbody td, .card .table tbody td { padding-top: .68rem; padding-bottom: .68rem; }
.table-container .table thead th, .card .table thead th { background: #f7f8fa; color: var(--text-secondary); font-size: .69rem; font-weight: 700; letter-spacing: .025em; text-transform: uppercase; white-space: nowrap; }
.audit-details { max-width: 600px; white-space: normal; overflow-wrap: anywhere; }
.sales-report-scroll { width: 100%; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.sales-report-scroll:focus-visible { outline: 2px solid var(--primary); outline-offset: 2px; }
.sales-report-table { min-width: 1180px; }
.sales-report-table td { font-variant-numeric: tabular-nums; }
.sales-report-actions { width: 116px; min-width: 116px; white-space: nowrap; }
.pagination .page-item.active .page-link { color: #fff; background: var(--primary); border-color: var(--primary); }
.pagination .page-link { color: var(--primary-dark); }

/* Phase 1D final desktop polish */
.customer-search-toolbar { display: grid; grid-template-columns: minmax(260px, 1fr) auto auto; align-items: center; gap: .5rem; }
.filter-action-group { display: flex; align-items: center; gap: .45rem; min-height: 35px; }
.customer-check-card { width: 100%; max-width: none; margin-left: 0; margin-right: 0; }
.dashboard-section-meta { display: flex; align-items: center; gap: .55rem; color: var(--text-muted); font-size: .76rem; }
.dashboard-section-meta a { color: var(--primary-dark); font-weight: 650; text-decoration: none; }
.dashboard-section-meta a:hover { text-decoration: underline; }
.payments-filter-form { display: grid; grid-template-columns: minmax(220px,2fr) repeat(2,minmax(130px,1fr)) minmax(135px,1fr) 70px auto; align-items: end; gap: .5rem; }
.payments-filter-form > [class*="col-"] { width: auto; max-width: none; padding: 0; }
.payments-filter-form .filter-action-group { flex-wrap: nowrap; }
.payments-table { width: 100%; min-width: 900px; table-layout: fixed; }
.payments-col-id { width: 7%; }
.payments-col-date { width: 10%; }
.payments-col-customer { width: 22%; }
.payments-col-order { width: 8%; }
.payments-col-amount { width: 9%; }
.payments-col-recorder { width: 10%; }
.payments-col-note { width: 18%; }
.payments-col-actions { width: 16%; }
.payments-note-column { overflow: hidden; }
.payments-note-text { display: block; width: 100%; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; color: var(--text-secondary); }
.payments-actions-column { white-space: nowrap; }
.payments-row-actions { display: flex; align-items: center; gap: .55rem; white-space: nowrap; }
.payments-edit-link { color: var(--text-secondary); font-size: .78rem; font-weight: 650; text-decoration: none; }
.payments-edit-link:hover { color: var(--primary-dark); text-decoration: underline; }
.management-empty-state { display: flex; flex-direction: column; align-items: center; gap: .28rem; padding: 2rem 1rem; color: var(--text-muted); text-align: center; }
.management-empty-state strong { color: var(--text-primary); font-size: .94rem; }
.management-empty-state span { font-size: .82rem; }
.dropdown-menu { z-index: 1080; }
.modal-header { padding: .9rem 1rem; border-bottom-color: var(--border-light); }
.modal-title { font-size: 1rem; font-weight: 700; }
.modal-body { padding: 1rem; }
.modal-footer { gap: .4rem; padding: .75rem 1rem; border-top-color: var(--border-light); }
.modal-body .form-label { margin-bottom: .3rem; color: var(--text-secondary); font-size: .76rem; font-weight: 650; }
.alert { padding: .7rem .85rem; border-radius: var(--radius-sm); font-size: .84rem; }
.table .text-end { font-variant-numeric: tabular-nums; }
.badge { font-size: .68rem; font-weight: 650; letter-spacing: .015em; }

@media (min-width: 1200px) {
  .orders-filter-primary-row { flex-wrap: nowrap; }
  .payments-filter-form { flex-wrap: nowrap; }
}

@media (max-width: 991px) {
  .sidebar { width: 280px; }
  .main { margin-left: 0; width: 100%; }
  .collection-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .topbar { flex-wrap: wrap; }
  .page-actions { order: 2; }
  .preset-segments { display: flex !important; overflow-x: auto; max-width: 100%; }
  .payments-filter-form { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .payments-filter-form > :first-child, .payments-filter-form > :last-child { grid-column: 1 / -1; }
  .orders-filter-secondary-row { flex-wrap: wrap; }
  .orders-admin-filter { flex: 1 1 100%; min-width: 0; }
}
@media (max-width: 575px) {
  .main { padding: .7rem .65rem 4.5rem; }
  .topbar { padding: .6rem .7rem; }
  .page-context { display: none; }
  .collection-summary { grid-template-columns: 1fr; }
  .remaining-due-summary { align-items: flex-start; flex-direction: column; gap: .7rem; }
  .remaining-due-amount { font-size: 1.45rem; }
  .customer-search-toolbar { grid-template-columns: 1fr; }
  .filter-action-group > * { flex: 1; }
}