/* ══════════════════════════════════════
   Dak Desk v8.5 — Design System
══════════════════════════════════════ */
:root {
  /* Light Theme */
  --bg-app: #f4f7fb;
  --bg-sidebar: #0f172a;
  --bg-card: rgba(255, 255, 255, 0.9);
  --bg-input: #f8fafc;
  --text-main: #0f172a;
  --text-muted: #64748b;
  --border: #e2e8f0;

  /* Sidebar Specifics */
  --border-sidebar: #1e293b;
  --sidebar-text: #f8fafc;
  --sidebar-muted: #94a3b8;
  --sidebar-hover: rgba(255, 255, 255, 0.06);
  --sidebar-brand: #ffffff;

  /* Accents */
  --brand-red: #8b1e3f;
  --brand-red-hover: #6f1731;
  --brand-yellow: #c97a1f;
  --success: #0f766e;
  --danger: #b91c1c;
  --blue: #4c1d95;
  --primary: #7c2d12;
  --accent-soft: #f7e7eb;

  /* Shadows & Radii */
  --shadow-sm: 0 6px 18px rgba(15, 23, 42, 0.06);
  --shadow-md: 0 16px 40px rgba(15, 23, 42, 0.12);
  --shadow-modal: 0 30px 60px rgba(15, 23, 42, 0.22);
  --radius-md: 12px;
  --radius-lg: 18px;
}

body.dark {
  --bg-app: #05070d;
  --bg-sidebar: #090c12;
  --bg-card: #11151d;
  --bg-input: #171c27;
  --text-main: #f8f5f2;
  --text-muted: #9da4b2;
  --border: #2a3441;
  --border-sidebar: #1c2330;
  --sidebar-text: #f8f5f2;
  --sidebar-muted: #9da4b2;
  --sidebar-hover: rgba(255, 255, 255, 0.06);
  --sidebar-brand: #f3c7d2;
  --brand-red: #b13a57;
  --brand-red-hover: #8b1e3f;
  --primary: #9b2c2c;
  --success: #2f9e7f;
  --danger: #ef5350;
  --blue: #7c3aed;
  --accent-soft: #241018;
}

* { box-sizing: border-box; margin: 0; padding: 0; }
body {
  font-family: 'Inter', 'Plus Jakarta Sans', sans-serif;
  background:
    radial-gradient(circle at top left, rgba(139, 30, 63, 0.14), transparent 28%),
    radial-gradient(circle at bottom right, rgba(124, 45, 18, 0.12), transparent 30%),
    linear-gradient(135deg, #fdf8f9 0%, #f7ecef 45%, #f2e7ea 100%);
  color: var(--text-main);
  height: 100vh;
  overflow: hidden;
  display: flex;
}
body.dark {
  background:
    radial-gradient(circle at top left, rgba(177, 58, 87, 0.2), transparent 30%),
    radial-gradient(circle at bottom right, rgba(155, 44, 44, 0.16), transparent 32%),
    linear-gradient(135deg, #05070d 0%, #0b1018 45%, #11151d 100%);
}
button, input, select, textarea { font-family: inherit; }

/* ══════════════════════════════════════
   APP LAYOUT (SIDEBAR & MAIN)
══════════════════════════════════════ */
.sidebar { width: 260px; background: linear-gradient(180deg, #0f172a 0%, #111827 100%); border-right: 1px solid var(--border-sidebar); display: flex; flex-direction: column; z-index: 50; transition: all 0.2s ease; color: var(--sidebar-text); box-shadow: 12px 0 40px rgba(15, 23, 42, 0.16); }
.sidebar.collapsed { width: 76px; }
.sidebar.collapsed .nav-text { display: none; }
.sidebar.collapsed .brand-header { padding: 24px 0; display: flex; flex-direction: column; align-items: center; }
.sidebar.collapsed .brand-header h1 i { margin: 0; width: 28px; height: 28px; }
.sidebar.collapsed .tab-btn { justify-content: center; padding: 14px 0; }
.sidebar.collapsed .tab-btn svg { margin: 0; }

.brand-header { padding: 24px; border-bottom: 1px solid rgba(255,255,255,0.08); }
.brand-header h1 { font-size: 1.25rem; font-weight: 800; color: var(--sidebar-brand); display: flex; align-items: center; gap: 8px; letter-spacing: -0.02em; }
.brand-header h1 i { color: #f9a8d4; }
.brand-header p { font-size: 0.75rem; color: var(--sidebar-muted); margin-top: 4px; font-weight: 500; }

.nav-menu { flex: 1; padding: 16px; display: flex; flex-direction: column; gap: 4px; overflow-y: auto; }
.tab-btn {
  display: flex; align-items: center; gap: 12px;
  width: 100%; padding: 12px 14px;
  background: transparent; border: none; border-radius: var(--radius-md);
  color: var(--sidebar-muted); font-size: 0.875rem; font-weight: 600;
  text-align: left; cursor: pointer; transition: all 0.2s ease;
}
.tab-btn:hover { background-color: var(--sidebar-hover); color: var(--sidebar-text); }
.tab-btn.active { background: linear-gradient(135deg, var(--brand-red), var(--primary)); color: #ffffff; box-shadow: 0 10px 24px rgba(99, 102, 241, 0.25); }
.tab-btn svg { width: 18px; height: 18px; }

.main-content { flex: 1; display: flex; flex-direction: column; overflow: hidden; }

.topbar {
  height: 64px; background: rgba(255, 255, 255, 0.84); backdrop-filter: blur(16px);
  border-bottom: 1px solid rgba(226, 232, 240, 0.9);
  display: flex; align-items: center; justify-content: space-between; padding: 0 32px; flex-shrink: 0; box-shadow: 0 8px 24px rgba(15, 23, 42, 0.04);
}
body.dark .topbar {
  background: rgba(2, 6, 23, 0.78);
  border-bottom: 1px solid rgba(36, 50, 68, 0.95);
  box-shadow: 0 8px 24px rgba(2, 6, 23, 0.25);
}
.topbar-title { font-size: 1.125rem; font-weight: 600; color: var(--text-main); }
.top-controls { display: flex; gap: 12px; align-items: center; }

.workspace { flex: 1; overflow-y: auto; padding: 32px; scroll-behavior: smooth; }
.tab-panel { display: none; max-width: 1200px; margin: 0 auto; animation: fadeIn 0.3s ease; }
.tab-panel.active { display: block; }
@keyframes fadeIn { from { opacity: 0; transform: translateY(5px); } to { opacity: 1; transform: translateY(0); } }

/* ══════════════════════════════════════
   COMPONENTS (Symmetrical & Aligned)
══════════════════════════════════════ */
.card { background: linear-gradient(180deg, rgba(255,255,255,0.96), rgba(248,250,252,0.96)); border: 1px solid rgba(226, 232, 240, 0.9); border-radius: var(--radius-lg); padding: 24px; margin-bottom: 24px; box-shadow: var(--shadow-sm); backdrop-filter: blur(8px); }
body.dark .card {
  background: linear-gradient(180deg, rgba(15, 23, 42, 0.96), rgba(10, 16, 30, 0.97));
  border: 1px solid rgba(36, 50, 68, 0.95);
  box-shadow: 0 10px 30px rgba(2, 6, 23, 0.35);
}
.card-header { margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 12px;}
.card-title { font-size: 1.125rem; font-weight: 700; color: var(--text-main); display: flex; align-items: center; gap: 8px;}

/* Inputs */
.input-group { display: flex; flex-direction: column; gap: 6px; flex: 1; min-width: 180px; justify-content: flex-end; }
.input-group label { font-size: 0.75rem; font-weight: 600; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 2px;}
input, select, .input-field {
  padding: 10px 14px; background-color: var(--bg-input); border: 1px solid var(--border); border-radius: var(--radius-md);
  color: var(--text-main); font-size: 0.875rem; transition: all 0.2s; outline: none; width: 100%; height: 42px;
}
body.dark input, body.dark select, body.dark .input-field {
  background: rgba(17, 28, 50, 0.95);
  border-color: #2d3f56;
  box-shadow: inset 0 1px 0 rgba(255,255,255,0.03);
}
textarea { width: 100%; resize: vertical; min-height: 130px; padding: 12px 14px; border: 1px solid var(--border); border-radius: var(--radius-md); outline: none; background: var(--bg-input); color: var(--text-main); font-size: 0.875rem; line-height: 1.55; }
body.dark textarea { background: rgba(17, 28, 50, 0.95); border-color: #2d3f56; }
textarea:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12); }
input:focus, select:focus, .input-field:focus { border-color: var(--primary); box-shadow: 0 0 0 3px rgba(99, 102, 241, 0.12); }
.form-row { display: flex; flex-wrap: wrap; gap: 16px; margin-bottom: 16px; align-items: flex-end; }

/* Composite Input */
.composite-input { display: flex; border: 1px solid var(--border); border-radius: var(--radius-md); overflow: hidden; background: var(--bg-input); transition: all 0.2s ease; height: 42px;}
.composite-input:focus-within { border-color: var(--brand-red); box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.1); background: var(--bg-card); }
.composite-input select { border: none; border-radius: 0; border-right: 1px solid var(--border); background: transparent; font-weight: 600; box-shadow: none; padding-right: 30px; height: 100%;}
.composite-input input { border: none; border-radius: 0; flex: 1; outline: none; box-shadow: none; background: transparent; padding: 10px 14px; color: var(--text-main); font-size: 0.875rem; height: 100%;}

/* Custom Sliders */
input[type=range] { -webkit-appearance: none; width: 100%; background: transparent; padding: 0; border: none; box-shadow: none; height: 24px; }
input[type=range]:focus { outline: none; box-shadow: none; border: none;}
input[type=range]::-webkit-slider-runnable-track { width: 100%; height: 8px; cursor: pointer; background: var(--border); border-radius: 4px; }
input[type=range]::-webkit-slider-thumb { height: 20px; width: 20px; border-radius: 50%; background: var(--brand-red); cursor: pointer; -webkit-appearance: none; margin-top: -6px; box-shadow: var(--shadow-sm); transition: transform 0.1s; }
input[type=range]::-webkit-slider-thumb:hover { transform: scale(1.2); }

/* Buttons */
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 16px; border-radius: var(--radius-md); font-size: 0.875rem; font-weight: 600; cursor: pointer; border: 1px solid transparent; transition: all 0.2s; height: 42px;}
.btn-primary { background: linear-gradient(135deg, var(--primary), var(--brand-red)); color: white; box-shadow: 0 10px 24px rgba(139, 30, 63, 0.18); }
.ledger-incentive-btn {
  display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); border-radius: 999px; background: var(--bg-input); color: var(--text-muted); padding: 6px 10px; font-size: 0.75rem; font-weight: 700; cursor: pointer; transition: all 0.2s ease; white-space: nowrap;
}
.ledger-incentive-btn:hover { transform: translateY(-1px); border-color: var(--brand-red); color: var(--brand-red); }
.ledger-incentive-btn.taken { background: rgba(15, 118, 110, 0.12); border-color: rgba(15, 118, 110, 0.25); color: var(--success); }
.ledger-incentive-btn.taken:hover { background: rgba(15, 118, 110, 0.18); color: var(--success); }
body.dark .btn-primary { box-shadow: 0 10px 24px rgba(177, 58, 87, 0.2); }
.btn-primary:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(139, 30, 63, 0.24); }
.btn-primary:disabled { opacity: 0.5; cursor: not-allowed; }
.btn-outline { background-color: transparent; border-color: var(--border); color: var(--text-main); }
.btn-outline:hover { background-color: var(--bg-input); border-color: var(--text-muted); }
.btn-success { background-color: var(--success); color: white; }
.btn-success:hover { background-color: #059669; }
.btn-danger { background-color: #fee2e2; color: var(--danger); border-color: #fca5a5; }
.btn-danger:hover { background-color: #fecaca; }
.btn-icon { padding: 8px; border-radius: 8px; border: none; background: transparent; color: var(--text-muted); cursor: pointer; height: auto;}
.btn-icon:hover { background: var(--bg-input); color: var(--text-main); }
.text-blue-600 { color: var(--blue); } .text-blue-600:hover { color: #1d4ed8; background: #eff6ff;}
.text-indigo-600 { color: #4f46e5; } .text-indigo-600:hover { color: #4338ca; background: #e0e7ff;}

/* Badges */
.badge { display: inline-flex; align-items: center; padding: 4px 10px; border-radius: 9999px; font-size: 0.75rem; font-weight: 700; letter-spacing: 0.03em; text-transform: uppercase; background: var(--bg-input); color: var(--text-muted); border: 1px solid var(--border); }
.badge-pill { font-size: 0.75rem; font-weight: 600; padding: 4px 8px; border-radius: 6px; border: 1px solid transparent; display: inline-block; margin-top: 4px; }

/* Passbook Kanban */
.ledger-view-toggle { display: inline-flex; align-items: center; gap: 4px; padding: 4px; border: 1px solid var(--border); background: var(--bg-input); border-radius: 999px; }
.ledger-view-btn { display: inline-flex; align-items: center; gap: 6px; height: 34px; padding: 0 12px; border: none; border-radius: 999px; background: transparent; color: var(--text-muted); font-size: 0.8rem; font-weight: 700; cursor: pointer; transition: all 0.2s ease; }
.ledger-view-btn svg { width: 15px; height: 15px; }
.ledger-view-btn.active { background: var(--bg-card); color: var(--brand-red); box-shadow: var(--shadow-sm); }
.passbook-board { display: grid; grid-template-columns: repeat(3, minmax(220px, 1fr)); gap: 16px; align-items: start; }
.passbook-column { min-height: 420px; border: 1px solid var(--border); border-radius: var(--radius-md); background: rgba(248, 250, 252, 0.76); overflow: hidden; transition: border-color 0.2s ease, box-shadow 0.2s ease, background 0.2s ease; }
body.dark .passbook-column { background: rgba(17, 28, 50, 0.72); }
.passbook-column.drag-over { border-color: var(--brand-red); box-shadow: inset 0 0 0 2px rgba(139, 30, 63, 0.16); background: rgba(247, 231, 235, 0.68); }
.passbook-column-header { display: flex; justify-content: space-between; align-items: center; gap: 10px; padding: 14px 14px 12px; border-bottom: 1px solid var(--border); background: rgba(255,255,255,0.7); }
body.dark .passbook-column-header { background: rgba(15, 23, 42, 0.74); }
.passbook-column-title { display: flex; align-items: center; gap: 8px; min-width: 0; }
.passbook-column-title i { width: 17px; height: 17px; flex-shrink: 0; }
.passbook-column-title strong { font-size: 0.88rem; line-height: 1.2; }
.passbook-count { display: inline-flex; align-items: center; justify-content: center; min-width: 28px; height: 26px; padding: 0 8px; border-radius: 999px; background: var(--bg-input); border: 1px solid var(--border); color: var(--text-main); font-size: 0.8rem; font-weight: 800; }
.passbook-card-list { display: flex; flex-direction: column; gap: 10px; padding: 12px; min-height: 360px; }
.passbook-card { border: 1px solid var(--border); border-left: 4px solid var(--text-muted); border-radius: 8px; background: var(--bg-card); padding: 12px; cursor: grab; box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06); transition: transform 0.16s ease, box-shadow 0.16s ease, opacity 0.16s ease; }
.passbook-card:hover { transform: translateY(-1px); box-shadow: 0 12px 24px rgba(15, 23, 42, 0.1); }
.passbook-card.dragging { opacity: 0.55; cursor: grabbing; }
.passbook-card[data-status="Pending AO"] { border-left-color: #e11d48; }
.passbook-card[data-status="At BO"] { border-left-color: #d97706; }
.passbook-card[data-status="Delivered"] { border-left-color: #059669; }
.passbook-card-name { font-size: 0.9rem; font-weight: 800; line-height: 1.25; color: var(--text-main); margin-bottom: 8px; word-break: break-word; }
.passbook-card-meta { display: grid; gap: 4px; font-size: 0.76rem; color: var(--text-muted); line-height: 1.35; }
.passbook-card-meta span { display: flex; justify-content: space-between; gap: 10px; }
.passbook-card-meta b { color: var(--text-main); font-weight: 700; text-align: right; word-break: break-word; }
.passbook-card-actions { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-top: 10px; padding-top: 10px; border-top: 1px solid var(--border); }
.passbook-mini-btn { display: inline-flex; align-items: center; justify-content: center; width: 30px; height: 30px; border: 1px solid var(--border); border-radius: 8px; background: var(--bg-input); color: var(--text-muted); cursor: pointer; transition: all 0.2s ease; }
.passbook-mini-btn:hover { color: var(--brand-red); border-color: rgba(139, 30, 63, 0.35); background: var(--accent-soft); }
.passbook-mini-btn svg { width: 14px; height: 14px; }
.passbook-empty { padding: 24px 12px; text-align: center; color: var(--text-muted); font-size: 0.82rem; border: 1px dashed var(--border); border-radius: 8px; background: rgba(255,255,255,0.45); }
body.dark .passbook-empty { background: rgba(15, 23, 42, 0.36); }
.scheme-board { grid-template-columns: repeat(auto-fit, minmax(250px, 1fr)); }
.scheme-column { min-height: 300px; }
.scheme-column-total { padding: 9px 14px; border-bottom: 1px solid var(--border); color: var(--text-muted); font-size: 0.76rem; font-weight: 800; background: var(--bg-input); }
.scheme-card { cursor: default; }
.scheme-card .passbook-card-meta span:nth-child(2) b { color: var(--success); }

@media (max-width: 980px) {
  .passbook-board { grid-template-columns: 1fr; }
  .passbook-column { min-height: auto; }
  .passbook-card-list { min-height: 140px; }
}

/* Stats Grid */
.omni-dashboard { display: grid; gap: 20px; }
.omni-footfall-card { position: relative; overflow: hidden; display: flex; justify-content: space-between; gap: 24px; padding: 28px; min-height: 180px; color: #fff; border-radius: var(--radius-lg); background: linear-gradient(125deg, var(--primary), #a4163a 55%, #d97706); box-shadow: var(--shadow-md); }
.omni-footfall-card h2 { margin: 7px 0; font-size: clamp(1.35rem, 2.5vw, 2rem); letter-spacing: -0.03em; }.omni-footfall-card p { margin: 0; color: rgba(255,255,255,.83); font-size: .9rem; }.omni-eyebrow { display: flex; align-items: center; gap: 7px; font-weight: 800; text-transform: uppercase; letter-spacing: .08em; font-size: .72rem; color: #fde68a; }.omni-eyebrow svg { width: 16px; }
.omni-footfall-status { z-index: 1; min-width: 180px; padding: 15px 18px; align-self: flex-start; border: 1px solid rgba(255,255,255,.25); background: rgba(15,23,42,.18); border-radius: 14px; backdrop-filter: blur(8px); }.omni-footfall-status div { display: flex; align-items: center; gap: 8px; }.omni-footfall-status small { display:block; margin-top:5px; opacity:.72; }.omni-dot { width: 9px; height: 9px; border-radius: 50%; background:#facc15; box-shadow:0 0 8px rgba(250,204,21,.7); }
.omni-wave { position:absolute; right:0; bottom:-20px; left:0; height:96px; display:flex; align-items:end; gap:10px; opacity:.22; transform:skewX(-16deg); }.omni-wave span { flex:1; min-width:30px; border-radius:999px 999px 0 0; background:linear-gradient(#fde68a, rgba(255,255,255,.1)); }.omni-wave span:nth-child(1){height:24%}.omni-wave span:nth-child(2){height:42%}.omni-wave span:nth-child(3){height:73%}.omni-wave span:nth-child(4){height:100%}.omni-wave span:nth-child(5){height:58%}.omni-wave span:nth-child(6){height:30%}.omni-footfall-card .dashboard-closure-message { position:absolute; bottom:16px; left:28px; z-index:2; margin:0; }
.omni-bento-grid { display:grid; grid-template-columns: repeat(12, minmax(0, 1fr)); gap:20px; }.omni-card { min-width:0; padding:20px; border:1px solid var(--border); border-radius:var(--radius-lg); background:var(--bg-card); box-shadow:var(--shadow-sm); }.omni-command-card{grid-column:span 4}.omni-growth-card{grid-column:span 5}.omni-nudges-card{grid-column:span 3}.omni-cash-card{grid-column:span 3}.omni-chart-card{grid-column:span 4}.omni-chart-card:last-child{grid-column:span 5}
.omni-card-heading { display:flex; justify-content:space-between; align-items:center; gap:12px; }.omni-card-heading>div { display:flex; align-items:center; gap:8px; }.omni-card-heading svg { width:19px; color:var(--brand-red); }.omni-card-heading h3 { margin:0; font-size:1rem; }.omni-live { padding:4px 8px; border-radius:6px; background:var(--accent-soft); color:var(--brand-red); font-weight:800; font-size:.68rem; text-transform:uppercase; }.omni-link,.omni-nudge-cta { border:0; background:none; color:var(--brand-red); font:inherit; font-size:.78rem; font-weight:800; cursor:pointer; display:inline-flex; align-items:center; gap:4px; }.omni-link svg,.omni-nudge-cta svg { width:14px; }.omni-muted { margin:8px 0 0; font-size:.78rem; color:var(--text-muted); line-height:1.45; }
.omni-ring-wrap { position:relative; width:150px; margin:15px auto 8px; }.omni-ring-wrap svg { display:block; width:150px; height:150px; }.omni-ring-wrap>div { position:absolute; inset:0; display:grid; place-content:center; text-align:center; }.omni-ring-wrap strong { font-size:1.8rem; }.omni-ring-wrap span { color:var(--text-muted); text-transform:uppercase; font-size:.62rem; font-weight:800; letter-spacing:.08em; }.omni-ring-track,.omni-ring-value { fill:none; stroke-width:12; }.omni-ring-track { stroke:var(--bg-input); }.omni-ring-value { stroke:var(--brand-red); stroke-linecap:round; transform:rotate(-90deg); transform-origin:50% 50%; stroke-dasharray:314.16; stroke-dashoffset:314.16; transition:stroke-dashoffset .6s ease; }
.omni-action-list { display:grid; gap:8px; margin-top:13px; }.omni-action-list button { display:flex; align-items:center; gap:10px; padding:10px; border:1px solid var(--border); border-radius:10px; background:var(--bg-input); color:var(--text-main); cursor:pointer; text-align:left; }.omni-action-list button:hover { border-color:var(--brand-red); }.omni-action-list button>span:nth-child(2){flex:1}.omni-action-list strong,.omni-action-list small { display:block; }.omni-action-list strong { font-size:.78rem; }.omni-action-list small { margin-top:2px; color:var(--text-muted); font-size:.7rem; }.omni-action-list>button>svg { width:16px; color:var(--text-muted); }.omni-action-icon { display:grid; place-items:center; width:31px; height:31px; border-radius:8px; }.omni-action-icon svg{width:16px}.omni-action-icon.amber{background:#fef3c7;color:#b45309}.omni-action-icon.red{background:var(--accent-soft);color:var(--brand-red)}
.omni-scheme-summary { display:grid; gap:11px; margin-top:18px; }.omni-scheme-bar-row>div:first-child { display:flex; justify-content:space-between; align-items:center; margin-bottom:5px; }.omni-scheme-bar-row>div:first-child span { font-size:.74rem; color:var(--text-muted); font-weight:800; }.omni-scheme-bar-row>div:first-child strong { font-size:.78rem; color:var(--text-main); }.omni-scheme-bar-track { height:9px; overflow:hidden; border-radius:999px; background:var(--bg-input); border:1px solid var(--border); }.omni-scheme-bar-track span { display:block; height:100%; border-radius:999px; transition:width .45s ease; }.omni-scheme-bar-track .blue { background:var(--blue); }.omni-scheme-bar-track .green { background:var(--success); }.omni-scheme-bar-track .red { background:var(--brand-red); }.omni-scheme-bar-track .pink { background:#db2777; }.omni-scheme-bar-track .gold { background:#d97706; }.omni-scheme-empty { padding:17px; color:var(--text-muted); font-size:.78rem; text-align:center; border:1px dashed var(--border); border-radius:10px; }.omni-milestones { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:15px; }.omni-milestones>div { display:flex; gap:7px; align-items:center; padding:9px; border:1px solid var(--border); border-radius:10px; }.omni-milestones span { font-size:1rem; }.omni-milestones p { margin:0; min-width:0; }.omni-milestones small,.omni-milestones strong { display:block; }.omni-milestones small{font-size:.63rem;color:var(--text-muted);font-weight:700}.omni-milestones strong{font-size:.7rem;white-space:nowrap}
.omni-nudge { margin-top:12px; padding:13px; border-radius:10px; border:1px solid var(--border); background:var(--bg-input); }.omni-nudge span,.omni-nudge strong,.omni-nudge small{display:block}.omni-nudge span,.omni-nudge small { color:var(--text-muted); font-size:.72rem; }.omni-nudge strong { margin:3px 0; font-size:1.35rem; color:var(--brand-red); }.omni-nudge-cta { margin-top:16px; }.omni-cash-card { display:flex; flex-direction:column; justify-content:center; background:linear-gradient(135deg, var(--primary), var(--brand-red)); color:#fff; }.omni-cash-card>svg { width:28px; margin-bottom:10px; }.omni-cash-card>span { font-size:.78rem; opacity:.82; }.omni-cash-card>strong { margin:5px 0 13px; font-size:1.45rem; }.omni-cash-card small { font-size:.68rem; opacity:.75; }.omni-cash-meter { height:6px; overflow:hidden; margin-bottom:8px; border-radius:999px; background:rgba(0,0,0,.22); }.omni-cash-meter span { display:block; width:70%; height:100%; background:#fde68a; border-radius:999px; }.omni-chart-wrap { height:210px; margin-top:8px; }
.omni-flow-card,.omni-kpi-card,.omni-backup-card{grid-column:span 4}
.omni-flow-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin-top:14px}
.omni-flow-grid>div{padding:12px;border:1px solid var(--border);border-radius:10px;background:var(--bg-input)}
.omni-flow-grid span,.omni-flow-net span{display:block;font-size:.72rem;color:var(--text-muted);font-weight:700;text-transform:uppercase;letter-spacing:.05em}
.omni-flow-grid strong{display:block;margin-top:4px;font-size:1rem}
.omni-flow-net{margin-top:10px;padding:12px;border-radius:10px;background:rgba(16,185,129,.08);border:1px solid rgba(16,185,129,.25)}
.omni-flow-net strong{display:block;margin-top:4px;font-size:1.25rem;color:var(--success)}
.omni-kpi-row{display:flex;justify-content:space-between;align-items:center;padding:12px 0;border-bottom:1px dashed var(--border)}
.omni-kpi-row:last-child{border-bottom:0}
.omni-kpi-row span{font-size:.78rem;color:var(--text-muted);font-weight:700}
.omni-kpi-row strong{font-size:1rem;color:var(--text-main)}
.omni-backup-badge{margin-top:16px;display:inline-flex;align-items:center;padding:8px 12px;border-radius:999px;font-size:.75rem;font-weight:800;letter-spacing:.04em;text-transform:uppercase;border:1px solid transparent}
.omni-backup-badge.good{background:rgba(16,185,129,.12);color:var(--success);border-color:rgba(16,185,129,.25)}
.omni-backup-badge.warn{background:rgba(245,158,11,.15);color:#b45309;border-color:rgba(245,158,11,.3)}
.omni-backup-badge.danger{background:rgba(239,68,68,.12);color:var(--danger);border-color:rgba(239,68,68,.28)}
@media (max-width: 1100px) { .omni-command-card,.omni-growth-card{grid-column:span 6}.omni-nudges-card{grid-column:span 12}.omni-nudges-card{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.omni-nudges-card .omni-card-heading,.omni-nudges-card>.omni-muted{grid-column:span 3}.omni-nudge{margin:0}.omni-nudge-cta{margin:0;align-self:center}.omni-cash-card,.omni-chart-card,.omni-chart-card:last-child{grid-column:span 4} }
@media (max-width: 1100px) { .omni-flow-card,.omni-kpi-card,.omni-backup-card{grid-column:span 4} }
@media (max-width: 720px) { .omni-footfall-card{flex-direction:column;padding:22px;min-height:220px}.omni-footfall-status{min-width:0;width:fit-content}.omni-footfall-card .dashboard-closure-message{left:22px;right:22px}.omni-bento-grid{grid-template-columns:1fr}.omni-command-card,.omni-growth-card,.omni-nudges-card,.omni-cash-card,.omni-chart-card,.omni-chart-card:last-child,.omni-flow-card,.omni-kpi-card,.omni-backup-card{grid-column:span 1}.omni-nudges-card{display:block}.omni-nudges-card .omni-card-heading,.omni-nudges-card>.omni-muted{display:flex}.omni-nudge{margin-top:12px}.omni-nudge-cta{margin-top:16px}.omni-milestones{grid-template-columns:1fr}.omni-flow-grid{grid-template-columns:1fr}.omni-chart-wrap{height:230px} }
.stats-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 20px; margin-bottom: 24px; }
.stat-card { background: linear-gradient(135deg, rgba(255,255,255,0.98), rgba(248,250,252,0.95)); border: 1px solid rgba(226, 232, 240, 0.9); border-radius: var(--radius-lg); padding: 20px; box-shadow: var(--shadow-sm); position: relative; overflow: hidden; display: flex; align-items: flex-start; gap: 16px; transition: transform 0.2s ease;}
body.dark .stat-card {
  background: linear-gradient(135deg, rgba(15, 23, 42, 0.98), rgba(10, 16, 30, 0.98));
  border-color: rgba(36, 50, 68, 0.95);
}
.stat-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); }
.stat-content { flex: 1; }
.stat-card-title { font-size: 0.875rem; color: var(--text-muted); font-weight: 600; margin-bottom: 8px; text-transform: uppercase; letter-spacing: 0.05em; }
.stat-card-value { font-size: 1.8rem; font-weight: 800; color: var(--text-main); line-height: 1.2; letter-spacing: -0.02em; }
.stat-card-sub { font-size: 0.75rem; color: var(--text-muted); margin-top: 8px; font-weight: 500; }
.stat-bg-icon { position: absolute; right: -10px; bottom: -10px; width: 80px; height: 80px; opacity: 0.04; color: var(--text-main); pointer-events: none; }
.stat-icon-wrap { width: 48px; height: 48px; border-radius: 12px; display: flex; align-items: center; justify-content: center; background: var(--bg-input); color: var(--primary); flex-shrink: 0; }

/* Dashboard Aesthetic Upgrades CSS */
.dashboard-hero { background: linear-gradient(135deg, #7c2d12 0%, #8b1e3f 55%, #4a0f23 100%); border-radius: var(--radius-lg); padding: 28px 32px; color: white; margin-bottom: 20px; display: flex; justify-content: space-between; align-items: center; gap: 20px; box-shadow: 0 20px 45px rgba(139, 30, 63, 0.24); position: relative; overflow: hidden; }
.dashboard-hero::after { content: ''; position: absolute; top: -30%; right: -8%; width: 320px; height: 320px; background: radial-gradient(circle, rgba(255,255,255,0.18) 0%, rgba(255,255,255,0) 70%); border-radius: 50%; pointer-events: none; }
.dashboard-hero-content { position: relative; z-index: 1; max-width: 700px; }
.dashboard-hero h2 { font-size: 1.45rem; font-weight: 800; margin-bottom: 8px; }
.dashboard-hero p { opacity: 0.95; font-size: 0.92rem; margin-bottom: 12px; }
.hero-pill { display: inline-flex; align-items: center; padding: 6px 10px; border-radius: 999px; background: rgba(255,255,255,0.16); font-size: 0.72rem; font-weight: 700; letter-spacing: 0.08em; text-transform: uppercase; margin-bottom: 10px; }
.hero-meta { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 10px; }
.hero-badge { display: inline-flex; align-items: center; padding: 6px 10px; border-radius: 999px; background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.18); font-size: 0.76rem; font-weight: 600; }
.dashboard-hero-side { position: relative; z-index: 1; }
.dashboard-status-card { background: rgba(255,255,255,0.16); border: 1px solid rgba(255,255,255,0.22); border-radius: var(--radius-md); padding: 14px 16px; min-width: 180px; backdrop-filter: blur(10px); }
.status-label { display: block; font-size: 0.68rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.08em; opacity: 0.85; margin-bottom: 6px; }
.status-row { display: flex; align-items: center; gap: 8px; font-weight: 700; font-size: 0.95rem; }
.dashboard-closure-message { display: none; max-width: 620px; margin-top: 10px; padding: 10px 14px; border: 1px solid rgba(255,255,255,0.38); border-radius: 10px; background: rgba(15,23,42,0.28); font-size: 0.875rem; font-weight: 700; line-height: 1.45; }
.dashboard-closure-message.show { display: block; }
.quick-actions-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-bottom: 24px; }
.quick-action-btn { background: var(--bg-card); justify-content: center; padding: 18px 14px; flex-direction: column; gap: 10px; border: 1px solid var(--border); border-radius: var(--radius-lg); box-shadow: var(--shadow-sm); transition: all 0.2s ease; display: flex; align-items: center; cursor: pointer; color: var(--text-main); text-decoration: none; min-height: 126px; }
.quick-action-btn span { font-weight: 700; font-size: 0.88rem; text-align: center; }
.quick-action-btn:hover { transform: translateY(-3px); box-shadow: var(--shadow-md); border-color: rgba(139, 30, 63, 0.35); background: linear-gradient(135deg, var(--bg-card), var(--accent-soft)); }
.quick-action-btn:disabled { cursor: not-allowed; opacity: 0.5; transform: none; box-shadow: none; }
.quick-action-icon { padding: 14px; border-radius: 50%; display: flex; align-items: center; justify-content: center; margin-bottom: 4px; }
@media (max-width: 1024px) { .quick-actions-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 700px) { .dashboard-hero { flex-direction: column; align-items: flex-start; } .quick-actions-grid { grid-template-columns: 1fr; } }

/* Cash Tally Laptop Grid */
.cash-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(130px, 1fr)); gap: 16px; margin-bottom: 24px; }
.cash-input-card { background: var(--bg-input); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 12px; transition: all 0.2s; }
.cash-input-card:focus-within { border-color: var(--brand-red); box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.1); }
.cash-input-card .denom-row { display: flex; justify-content: space-between; align-items: center; font-weight: 700; margin-bottom: 8px; }
.cash-input-card input { width: 100%; text-align: center; font-weight: 800; font-size: 1.25rem; padding: 8px; border: 1px solid var(--border); border-radius: 6px; background: transparent; height: auto;}
.cash-input-card input:focus { outline: none; border-color: transparent; box-shadow: none; background: var(--bg-card); }

/* Tables */
.table-container { overflow-x: auto; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--bg-card); }
table { width: 100%; border-collapse: collapse; text-align: left; }
th, td { padding: 12px 16px; border-bottom: 1px solid var(--border); font-size: 0.875rem; }
th { background: linear-gradient(180deg, rgba(248,250,252,0.95), rgba(241,245,249,0.95)); color: var(--text-muted); font-weight: 700; font-size: 0.72rem; text-transform: uppercase; letter-spacing: 0.05em; white-space: nowrap; }
tr:last-child td { border-bottom: none; }
tr:hover td { background-color: rgba(0,0,0,0.01); }
.text-right { text-align: right; } .text-center { text-align: center; } .text-success { color: var(--success); font-weight: 600; } .text-danger { color: var(--danger); font-weight: 600; }

/* Reports Section */
/* ── Insights Studio ─────────────────────────────────────────────────────── */
.is-shell { display: flex; flex-direction: column; gap: 20px; }

/* Filter bar */
.is-filter-bar { display: flex; justify-content: space-between; align-items: flex-end; flex-wrap: wrap; gap: 12px; padding: 16px 20px; }
.is-filter-bar-left { display: flex; flex-wrap: wrap; gap: 12px; align-items: flex-end; }
.is-filter-bar-right { display: flex; gap: 8px; align-items: flex-end; flex-shrink: 0; }
.is-filter-group { display: flex; flex-direction: column; gap: 5px; }
.is-filter-group label { font-size: 0.72rem; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.is-select { height: 38px; min-width: 140px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-input); color: var(--text-main); padding: 0 10px; font-size: 0.82rem; }

/* KPI strip */
.is-kpi-strip { display: flex; align-items: stretch; gap: 0; padding: 0; overflow: hidden; }
.is-kpi-card { flex: 1; padding: 20px 22px; display: flex; flex-direction: column; gap: 4px; }
.is-kpi-divider { width: 1px; background: var(--border); flex-shrink: 0; align-self: stretch; }
.is-kpi-label { font-size: 0.72rem; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.06em; }
.is-kpi-value { font-size: 1.7rem; font-weight: 800; color: var(--text-main); letter-spacing: -0.01em; line-height: 1.1; }
.is-kpi-delta { font-size: 0.78rem; font-weight: 700; margin-top: 2px; }
.is-delta-up { color: #059669; }
.is-delta-down { color: #dc2626; }
.is-delta-neutral { color: var(--text-muted); }

/* Section layout */
.is-section { padding: 20px; }
.is-section-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 16px; flex-wrap: wrap; }
.is-section-title { font-size: 0.95rem; font-weight: 700; color: var(--text-main); display: flex; align-items: center; gap: 8px; margin: 0; }
.is-section-title svg { width: 16px; height: 16px; color: var(--brand-red); }
.is-two-col { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }

/* Trend tabs */
.is-tab-group { display: flex; border: 1px solid var(--border); border-radius: 10px; overflow: hidden; }
.is-tab { padding: 6px 12px; font-size: 0.78rem; font-weight: 700; background: var(--bg-input); color: var(--text-muted); border: none; cursor: pointer; transition: all 0.18s; }
.is-tab.active { background: var(--brand-red); color: #fff; }

/* Scheme table trend arrows */
.is-trend-up { color: #059669; font-weight: 800; }
.is-trend-down { color: #dc2626; font-weight: 800; }
.is-trend-neutral { color: var(--text-muted); font-weight: 600; }

/* Portfolio donut legend */
.is-donut-legend { display: flex; flex-wrap: wrap; gap: 8px 16px; margin-top: 12px; justify-content: center; }
.is-donut-legend-item { display: flex; align-items: center; gap: 6px; font-size: 0.75rem; font-weight: 600; color: var(--text-muted); }
.is-legend-dot { width: 10px; height: 10px; border-radius: 50%; display: inline-block; }
.is-drill-btn { font-size: 0.78rem; height: 34px; padding: 0 12px; }

/* Incentive stats grid */
.is-stat-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.is-stat-cell { background: var(--bg-input); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; }
.is-stat-cell-label { font-size: 0.7rem; font-weight: 700; color: var(--text-muted); text-transform: uppercase; }
.is-stat-cell-value { font-size: 1.1rem; font-weight: 800; color: var(--text-main); margin-top: 3px; }
.is-stat-cell-note { font-size: 0.7rem; color: var(--text-muted); margin-top: 2px; }

/* Pipeline */
.is-pipeline-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.is-pipeline-cell { border-radius: 12px; padding: 14px; text-align: center; }
.is-pipeline-cell-label { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; margin-bottom: 6px; }
.is-pipeline-cell-value { font-size: 1.8rem; font-weight: 800; }
.is-pipeline-pending { background: #fef2f2; border: 1px solid #fecaca; color: #991b1b; }
.is-pipeline-atbo { background: #fffbeb; border: 1px solid #fde68a; color: #92400e; }
.is-pipeline-delivered { background: #ecfdf5; border: 1px solid #a7f3d0; color: #065f46; }
.is-pipeline-meta { margin-top: 12px; padding: 10px 12px; background: var(--bg-input); border: 1px solid var(--border); border-radius: 10px; font-size: 0.78rem; color: var(--text-muted); display: flex; gap: 16px; flex-wrap: wrap; }
.is-pipeline-meta b { color: var(--text-main); }

/* Operational insights */
.is-insights-list { display: flex; flex-direction: column; gap: 10px; }
.is-insight-item { display: flex; gap: 12px; padding: 12px 14px; border-radius: 12px; border: 1px solid; align-items: flex-start; }
.is-insight-icon { font-size: 1rem; flex-shrink: 0; margin-top: 1px; }
.is-insight-body { flex: 1; }
.is-insight-title { font-size: 0.85rem; font-weight: 700; margin-bottom: 2px; }
.is-insight-desc { font-size: 0.8rem; line-height: 1.45; }
.is-insight-green { background: #ecfdf5; border-color: #a7f3d0; color: #065f46; }
.is-insight-yellow { background: #fffbeb; border-color: #fde68a; color: #92400e; }
.is-insight-blue { background: #eff6ff; border-color: #bfdbfe; color: #1e40af; }
.is-insight-red { background: #fef2f2; border-color: #fecaca; color: #991b1b; }
body.dark .is-insight-green { background: rgba(6,95,70,0.22); border-color: rgba(16,185,129,0.3); color: #6ee7b7; }
body.dark .is-insight-yellow { background: rgba(120,53,15,0.22); border-color: rgba(245,158,11,0.3); color: #fde68a; }
body.dark .is-insight-blue { background: rgba(29,78,216,0.18); border-color: rgba(96,165,250,0.3); color: #bfdbfe; }
body.dark .is-insight-red { background: rgba(153,27,27,0.2); border-color: rgba(252,165,165,0.3); color: #fca5a5; }

/* Custom Report Builder */
.is-report-builder { display: flex; flex-direction: column; gap: 16px; }
.is-report-builder-fields { display: flex; flex-wrap: wrap; gap: 12px; }
.is-report-sections label { display: block; margin-bottom: 8px; font-size: 0.82rem; font-weight: 700; color: var(--text-muted); text-transform: uppercase; letter-spacing: 0.05em; }
.is-checkboxes { display: flex; flex-wrap: wrap; gap: 10px 20px; }
.is-checkboxes label { font-size: 0.82rem; font-weight: 600; color: var(--text-main); display: inline-flex; align-items: center; gap: 7px; cursor: pointer; }
.is-report-actions { display: flex; gap: 10px; flex-wrap: wrap; }

@media (max-width: 960px) { .is-two-col { grid-template-columns: 1fr; } .is-kpi-strip { flex-wrap: wrap; } .is-kpi-divider { display: none; } .is-kpi-card { flex: 0 0 48%; border-bottom: 1px solid var(--border); } }
@media (max-width: 580px) { .is-kpi-card { flex: 0 0 100%; } .is-stat-grid { grid-template-columns: 1fr 1fr; } .is-pipeline-grid { grid-template-columns: 1fr; } }

.report-shell { display: flex; flex-direction: column; gap: 20px; }
.report-hero {
  background: linear-gradient(135deg, rgba(225, 29, 72, 0.08), rgba(37, 99, 235, 0.08));
  border: 1px solid var(--border);
  border-radius: var(--radius-lg);
  padding: 20px 22px;
  display: flex; justify-content: space-between; align-items: center; gap: 16px; flex-wrap: wrap;
  box-shadow: var(--shadow-sm);
}
body.dark .report-hero { background: linear-gradient(135deg, rgba(244, 63, 94, 0.15), rgba(37, 99, 235, 0.12)); }
.report-hero h2 { font-size: 1.15rem; font-weight: 800; margin-bottom: 4px; color: var(--text-main); }
.report-hero p { color: var(--text-muted); font-size: 0.875rem; margin: 0; }
.report-chip { display: inline-flex; align-items: center; gap: 6px; padding: 6px 10px; border-radius: 999px; background: var(--bg-card); border: 1px solid var(--border); color: var(--text-muted); font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.04em; }
.report-panel { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-lg); padding: 20px; box-shadow: var(--shadow-sm); }
.report-toolbar { background: var(--bg-input); padding: 16px; border-radius: var(--radius-md); border: 1px solid var(--border); display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin-bottom: 20px; }
.treasury-hero { display:flex; justify-content:space-between; gap:20px; align-items:stretch; padding:20px; margin-bottom:20px; border-radius:var(--radius-lg); border:1px solid rgba(225,29,72,.14); background:linear-gradient(135deg, rgba(225,29,72,.08), rgba(37,99,235,.06)); box-shadow:var(--shadow-sm); }
.treasury-hero-copy { max-width: 620px; }
.treasury-chip { display:inline-flex; align-items:center; gap:8px; padding:6px 10px; border-radius:999px; background:var(--bg-card); border:1px solid var(--border); color:var(--brand-red); font-size:.75rem; font-weight:800; text-transform:uppercase; letter-spacing:.06em; }
.treasury-chip svg { width:14px; }
.treasury-hero h2 { margin:10px 0 8px; font-size:clamp(1.35rem, 2.4vw, 2rem); letter-spacing:-0.03em; }
.treasury-hero p { margin:0; color:var(--text-muted); font-size:.9rem; line-height:1.55; }
.treasury-hero-grid { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; min-width: 360px; }
.treasury-metric { padding:14px; border-radius:14px; background:var(--bg-card); border:1px solid var(--border); box-shadow:var(--shadow-sm); }
.treasury-metric span { display:block; font-size:.68rem; font-weight:800; color:var(--text-muted); text-transform:uppercase; letter-spacing:.06em; }
.treasury-metric strong { display:block; margin-top:6px; font-size:1.2rem; color:var(--text-main); }
.treasury-metric small { display:block; margin-top:4px; color:var(--text-muted); font-size:.72rem; }
.treasury-action-row { display:flex; flex-wrap:wrap; gap:8px; align-items:center; margin-bottom:16px; }
.treasury-search { min-width: 240px; margin-bottom: 0; flex: 1 1 240px; }
.treasury-search input { width:100%; }
.treasury-stats .stat-card { min-height: 88px; }
.treasury-stats .stat-card-title { font-size:.72rem; }
.treasury-stats .stat-card-value { font-size:1.45rem; }
.treasury-day-banner {
  margin: 0 0 20px;
  padding: 14px 16px;
  border-radius: var(--radius-lg);
  border: 1px solid transparent;
  font-size: 0.88rem;
  font-weight: 700;
  box-shadow: var(--shadow-sm);
}
.treasury-day-banner-info { background: rgba(37, 99, 235, 0.08); border-color: rgba(37, 99, 235, 0.18); color: #1e3a8a; }
.treasury-day-banner-warning { background: rgba(245, 158, 11, 0.1); border-color: rgba(245, 158, 11, 0.22); color: #92400e; }
.treasury-day-banner-danger { background: rgba(220, 38, 38, 0.08); border-color: rgba(220, 38, 38, 0.18); color: #991b1b; }
.treasury-tally-toolbar { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:12px; }
.treasury-denomination-note { margin: 0 0 18px; padding: 12px 14px; border-radius: var(--radius-md); background: var(--bg-input); border: 1px dashed var(--border); color: var(--text-muted); font-size: 0.82rem; line-height: 1.45; }
.treasury-focus { box-shadow: 0 0 0 3px rgba(139, 30, 63, 0.12), var(--shadow-md); }
@media (max-width: 980px) { .treasury-hero { flex-direction:column; } .treasury-hero-grid { min-width:0; width:100%; grid-template-columns:repeat(2, minmax(0, 1fr)); } }
@media (max-width: 720px) { .treasury-hero-grid { grid-template-columns:1fr; } .treasury-action-row { flex-direction:column; align-items:stretch; } .treasury-search { min-width:0; width:100%; } }
.insight-grid { display:grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.insight-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 14px; box-shadow: var(--shadow-sm); }
.insight-card h3 { margin: 0 0 10px; font-size: 0.9rem; font-weight: 700; display:flex; align-items:center; gap:8px; }
.insight-card h3 svg { width: 16px; color: var(--brand-red); }
.insight-text { margin: 0; font-size: 0.88rem; line-height: 1.5; color: var(--text-main); }
.insight-meter { margin-top: 8px; height: 10px; border: 1px solid var(--border); border-radius: 999px; overflow: hidden; background: var(--bg-input); }
.insight-meter span { display:block; height:100%; background: linear-gradient(90deg, #10b981, #f59e0b, #ef4444); transition: width .35s ease; }
.insight-sub { display:block; margin-top:8px; font-size: 0.78rem; color: var(--text-muted); }
.insight-list { display:grid; gap:8px; }
.insight-pill { padding: 9px 10px; border-radius: 8px; background: var(--bg-input); border: 1px solid var(--border); font-size: 0.8rem; }
.insight-score { font-size: 1.8rem; font-weight: 800; color: var(--brand-red); }
.target-row { margin-bottom: 10px; }
.target-row-head { display:flex; justify-content:space-between; font-size:0.78rem; font-weight:600; margin-bottom:6px; color:var(--text-muted); }
.target-row .insight-meter { margin-top:0; }
.heatmap-grid { display:grid; grid-template-columns: repeat(14, minmax(0, 1fr)); gap: 6px; }
.heat-cell { border-radius: 4px; height: 16px; border: 1px solid var(--border); background: #e2e8f0; }
.heat-cell.l1 { background: #bfdbfe; }
.heat-cell.l2 { background: #60a5fa; }
.heat-cell.l3 { background: #2563eb; }
.heat-cell.l4 { background: #1e3a8a; }
@media (max-width: 900px) { .insight-grid { grid-template-columns: 1fr; } .heatmap-grid { grid-template-columns: repeat(10, minmax(0, 1fr)); } }
.report-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 16px; }
.report-stat-card { background: var(--bg-input); border: 1px solid var(--border); border-radius: var(--radius-md); padding: 14px 16px; }
.report-stat-card .label { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.05em; color: var(--text-muted); margin-bottom: 6px; }
.report-stat-card .value { font-size: 1.15rem; font-weight: 800; color: var(--text-main); }
.summary-table { min-width: 1600px; width: 100%; border-collapse: collapse; font-size: 13px; background: var(--bg-card); }
.summary-table thead th { background: linear-gradient(180deg, rgba(248,250,252,0.95), rgba(241,245,249,0.95)); color: var(--text-main); border-color: var(--border); position: sticky; top: 0; z-index: 2; }
body.dark .summary-table thead th { background: linear-gradient(180deg, rgba(30,41,59,0.95), rgba(15,23,42,0.95)); color: var(--sidebar-text); }
.summary-table tbody tr:nth-child(even) { background: rgba(248,250,252,0.65); }
body.dark .summary-table tbody tr:nth-child(even) { background: rgba(30,41,59,0.6); }
.summary-table tbody tr:hover { background: rgba(225,29,72,0.06); }
.summary-table td { white-space: nowrap; }
.summary-table .total-cell { font-weight: 800; color: var(--brand-red); background: rgba(225,29,72,0.05); }
.summary-table .positive-cell { color: var(--success); font-weight: 700; }
.summary-table .negative-cell { color: var(--danger); font-weight: 700; }
.ledger-bulk-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 16px; padding: 12px 16px; border: 1px solid var(--border); border-radius: var(--radius-md); background: var(--bg-input); }
.ledger-selection-summary { display: flex; flex-direction: column; gap: 2px; font-size: 0.875rem; }
.ledger-selection-summary span { color: var(--text-muted); font-size: 0.75rem; }
.ledger-bulk-actions { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 8px; }
.ledger-select-cell { width: 46px; text-align: center; }
.ledger-select-cell input, .ledger-row-select { width: 18px; height: 18px; accent-color: var(--brand-red); cursor: pointer; }
.ledger-row-selected td { background: rgba(225, 29, 72, 0.05); }
@media (max-width: 900px) { .ledger-bulk-toolbar { align-items: stretch; flex-direction: column; } .ledger-bulk-actions { justify-content: flex-start; } }
.holiday-manager { margin-top: 4px; }
.holiday-manager > label { display: block; margin-bottom: 8px; color: var(--text-muted); font-size: 0.75rem; font-weight: 600; letter-spacing: 0.05em; text-transform: uppercase; }
.holiday-manager small { display: block; margin-top: 8px; color: var(--text-muted); font-size: 0.72rem; line-height: 1.4; }
.holiday-add-row { display: grid; grid-template-columns: minmax(145px, 0.8fr) minmax(180px, 1.2fr) auto; gap: 8px; align-items: center; }
.holiday-list { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; }
.holiday-item { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-input); }
.holiday-item-date { font-size: 0.75rem; color: var(--text-muted); }
.holiday-empty { padding: 14px; border: 1px dashed var(--border); border-radius: 10px; color: var(--text-muted); font-size: 0.8rem; text-align: center; }
@media (max-width: 700px) { .holiday-add-row { grid-template-columns: 1fr; } }
.crm-modal-heading { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 18px; }
.crm-modal-heading p { color: var(--text-muted); font-size: 0.82rem; }
.crm-audience-card { display: flex; justify-content: space-between; align-items: center; gap: 16px; margin-bottom: 18px; padding: 14px 16px; border: 1px solid #bfdbfe; border-radius: var(--radius-md); background: #eff6ff; color: #1e3a8a; }
body.dark .crm-audience-card { border-color: #1e3a8a; background: rgba(37,99,235,0.12); color: #bfdbfe; }
.crm-audience-card strong, .crm-audience-card span { display: block; }
.crm-audience-card span { margin-top: 3px; font-size: 0.75rem; opacity: 0.8; }
.crm-audience-preview { max-width: 55%; color: inherit; font-size: 0.78rem; text-align: right; line-height: 1.45; }
.crm-helper { color: var(--text-muted); font-size: 0.72rem; line-height: 1.4; }
@media (max-width: 700px) { .crm-audience-card { align-items: flex-start; flex-direction: column; } .crm-audience-preview { max-width: 100%; text-align: left; } }

/* Modals & Overlays */
.modal-overlay { position: fixed; inset: 0; background: rgba(0,0,0,0.5); backdrop-filter: blur(4px); display: none; justify-content: center; align-items: center; z-index: 1000; }
.modal-content { background: linear-gradient(180deg, rgba(255,255,255,0.98), rgba(248,250,252,0.98)); border-radius: var(--radius-lg); padding: 32px; width: 100%; max-width: 480px; box-shadow: var(--shadow-modal); border: 1px solid rgba(226, 232, 240, 0.9); max-height: 90vh; overflow-y: auto; }
body.dark .modal-content {
  background: linear-gradient(180deg, rgba(10, 16, 30, 0.99), rgba(8, 12, 24, 0.99));
  border-color: rgba(36, 50, 68, 0.95);
}
.modal-title { font-size: 1.25rem; font-weight: 700; margin-bottom: 16px; color: var(--text-main); }
.modal-actions { display: flex; justify-content: flex-end; gap: 12px; margin-top: 24px; }

/* Custom Chart Tooltips (POSB) */
.chart-bar-group { position: relative; display: flex; flex-direction: column; justify-content: flex-end; width: 100%; height: 100%; transition: opacity 0.2s; }
.chart-bar-group:hover { opacity: 0.8; }
.chart-tooltip { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 8px; background: var(--text-main); color: var(--bg-card); padding: 8px 12px; border-radius: 6px; font-size: 0.75rem; font-weight: 600; opacity: 0; pointer-events: none; transition: opacity 0.2s; z-index: 10; white-space: nowrap; box-shadow: var(--shadow-md); }
.chart-bar-group:hover .chart-tooltip { opacity: 1; }

/* POSB Planner */
.posb-shell {
  background:
    radial-gradient(circle at 0% 0%, rgba(15, 118, 110, 0.08), transparent 30%),
    radial-gradient(circle at 100% 100%, rgba(76, 29, 149, 0.08), transparent 35%),
    linear-gradient(160deg, rgba(255,255,255,0.97), rgba(248,250,252,0.95));
}
body.dark .posb-shell {
  background:
    radial-gradient(circle at 0% 0%, rgba(47, 158, 127, 0.16), transparent 30%),
    radial-gradient(circle at 100% 100%, rgba(124, 58, 237, 0.16), transparent 35%),
    linear-gradient(160deg, rgba(15, 23, 42, 0.96), rgba(10, 16, 30, 0.96));
}
.posb-hero { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; margin-bottom: 20px; padding-bottom: 18px; border-bottom: 1px solid var(--border); }
.posb-eyebrow { font-size: 0.72rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.09em; color: var(--success); margin-bottom: 6px; }
.posb-subtitle { margin-top: 6px; font-size: 0.9rem; color: var(--text-muted); max-width: 720px; }
.posb-grid { display: grid; grid-template-columns: 360px 1fr; gap: 20px; align-items: start; }
.posb-controls { background: var(--bg-card); border: 1px solid var(--border); border-radius: 16px; box-shadow: var(--shadow-sm); padding: 18px; display: flex; flex-direction: column; gap: 16px; }
.posb-banner { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border-radius: 12px; border: 1px solid #bfdafc; background: #eff6ff; color: #1e3a8a; }
body.dark .posb-banner { border-color: #2a4a7f; background: rgba(30, 64, 175, 0.2); color: #bfdbfe; }
.posb-banner svg { width: 16px; height: 16px; flex-shrink: 0; margin-top: 1px; }
.posb-banner-title { font-size: 0.88rem; font-weight: 700; }
.posb-banner-warn { margin-top: 3px; font-size: 0.75rem; font-style: italic; opacity: 0.9; }
.posb-control-group { transition: opacity 0.25s ease; }
.posb-control-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; margin-bottom: 8px; }
.posb-control-head label { font-size: 0.83rem; font-weight: 700; color: var(--text-muted); }
.posb-value-box { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--border); background: var(--bg-input); border-radius: 10px; padding: 5px 8px; min-width: 108px; justify-content: flex-end; }
.posb-value-box svg { width: 14px; height: 14px; color: var(--text-muted); }
.posb-value-box span { font-size: 0.82rem; color: var(--text-muted); font-weight: 600; }
.posb-value-box input { width: 68px; min-width: 0; border: none; background: transparent; box-shadow: none; padding: 0; height: auto; font-weight: 800; text-align: right; }
.posb-value-box input:focus { box-shadow: none; }
.posb-preset-grid { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 11px; }
.posb-preset-btn { border: 1px solid var(--border); background: var(--bg-card); color: var(--text-muted); border-radius: 999px; padding: 5px 12px; font-size: 0.75rem; font-weight: 700; cursor: pointer; transition: all 0.18s ease; }
.posb-preset-btn:hover { transform: translateY(-1px); border-color: var(--brand-red); color: var(--brand-red); }
.posb-preset-btn.active { background: linear-gradient(135deg, var(--brand-red), var(--primary)); color: #fff; border-color: transparent; box-shadow: 0 8px 16px rgba(124, 45, 18, 0.28); }
.posb-results { display: flex; flex-direction: column; gap: 16px; }
.posb-kpi-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.posb-kpi-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 14px; box-shadow: var(--shadow-sm); padding: 14px 16px; }
.posb-kpi-highlight { background: linear-gradient(180deg, #eff6ff, #dbeafe); border-color: #bfdbfe; }
.posb-kpi-success { background: linear-gradient(180deg, #ecfdf5, #d1fae5); border-color: #a7f3d0; }
body.dark .posb-kpi-highlight { background: linear-gradient(180deg, rgba(30, 64, 175, 0.28), rgba(30, 58, 138, 0.24)); border-color: #2c4c8d; }
body.dark .posb-kpi-success { background: linear-gradient(180deg, rgba(6, 95, 70, 0.3), rgba(6, 78, 59, 0.26)); border-color: #2b7a62; }
.posb-kpi-label { font-size: 0.75rem; font-weight: 700; display: flex; align-items: center; gap: 6px; color: var(--text-muted); margin-bottom: 7px; }
.posb-kpi-label svg { width: 15px; height: 15px; }
.posb-kpi-value { font-size: 1.55rem; font-weight: 800; color: var(--text-main); letter-spacing: -0.01em; }
.posb-chart-card { background: var(--bg-card); border: 1px solid var(--border); border-radius: 16px; box-shadow: var(--shadow-sm); padding: 18px; min-height: 334px; display: flex; flex-direction: column; }
.posb-chart-head { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; margin-bottom: 18px; }
.posb-chart-head h3 { margin: 0; font-size: 1rem; font-weight: 700; color: var(--text-main); }
.posb-chart-head span { font-size: 0.78rem; color: var(--text-muted); }
.posb-chart { position: relative; height: 220px; display: flex; align-items: flex-end; justify-content: space-between; gap: 4px; margin-top: auto; }
.posb-chart-legend { display: flex; justify-content: center; gap: 18px; margin-top: 22px; font-size: 0.75rem; font-weight: 700; color: var(--text-muted); flex-wrap: wrap; }
.posb-chart-legend div { display: inline-flex; align-items: center; gap: 8px; }
.posb-dot { width: 11px; height: 11px; border-radius: 3px; display: inline-block; }
.posb-dot-invested { background: var(--blue); }
.posb-dot-interest { background: var(--success); }

/* Integrated POSB Calculator */
.posb-integrated-shell { padding: 0; overflow: hidden; }
.posb-integrated-wrap { display: grid; grid-template-columns: 1fr 1fr; min-height: 620px; }
.posb-integrated-left { padding: 28px; border-right: 1px solid var(--border); }
.posb-integrated-right { padding: 28px; background: var(--bg-input); display: flex; align-items: center; }
.posb-integrated-heading { margin-bottom: 20px; }
.posb-integrated-heading p { font-size: 0.85rem; color: var(--text-muted); margin-top: 6px; }
.posb-integrated-form { display: flex; flex-direction: column; gap: 16px; }
.posb-field label { display: block; font-size: 0.8rem; font-weight: 700; margin-bottom: 7px; color: var(--text-muted); }
.posb-field p { font-size: 0.74rem; color: var(--text-muted); margin-top: 6px; }
.posb-field input, .posb-select { width: 100%; height: 42px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card); color: var(--text-main); padding: 10px 12px; outline: none; }
.posb-field input:focus, .posb-select:focus { border-color: var(--brand-red); box-shadow: 0 0 0 3px rgba(139, 30, 63, 0.14); }
.posb-input-with-prefix { display: flex; align-items: center; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card); padding: 0 10px; gap: 8px; }
.posb-input-with-prefix span { color: var(--text-muted); font-weight: 700; }
.posb-input-with-prefix input { border: none; height: 40px; padding: 0; background: transparent; }
.posb-input-with-prefix input:focus { box-shadow: none; }
.posb-action-row { display: flex; gap: 12px; margin-top: 4px; }
.posb-action-row .btn { flex: 1; }
.posb-action-row .btn:last-child { flex: 0.36; }
.posb-empty-state { width: 100%; text-align: center; color: var(--text-muted); }
.posb-empty-state svg { width: 52px; height: 52px; margin: 0 auto 10px auto; opacity: 0.55; }
.posb-results-container { width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between; }
.posb-results-container.hidden { display: none; }
.posb-results-container h3 { font-size: 1rem; font-weight: 700; margin-bottom: 14px; color: var(--text-main); }
.posb-result-cards { display: flex; flex-direction: column; gap: 10px; }
.posb-result-card { border: 1px solid var(--border); background: var(--bg-card); border-radius: 12px; padding: 12px 14px; }
.posb-result-card p { font-size: 0.76rem; color: var(--text-muted); margin-bottom: 3px; }
.posb-result-card strong { font-size: 1.2rem; color: var(--text-main); }
.posb-result-card-main { margin-top: 4px; background: #1e293b; border-color: #1e293b; color: #fff; }
.posb-result-card-main p, .posb-result-card-main strong, .posb-result-card-main small { color: #fff; }
.posb-result-card-main small { display: block; margin-top: 8px; font-size: 0.72rem; opacity: 0.86; border-top: 1px solid rgba(255,255,255,0.2); padding-top: 8px; }
.posb-progress-wrap { margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--border); }
.posb-progress-wrap p { display: flex; justify-content: space-between; font-size: 0.76rem; color: var(--text-muted); margin-bottom: 8px; }
.posb-progress-wrap b { color: var(--brand-red); }
.posb-progress-bar { width: 100%; height: 11px; border-radius: 999px; overflow: hidden; background: #cbd5e1; display: flex; }
.posb-progress-invested { height: 100%; background: #3b82f6; transition: width 0.8s ease; }
.posb-progress-interest { height: 100%; background: #10b981; transition: width 0.8s ease; }
.posb-wa-panel { margin-top: 14px; border-top: 1px solid var(--border); padding-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.posb-wa-panel label { font-size: 0.78rem; font-weight: 700; color: var(--text-muted); }
.posb-wa-panel input { width: 100%; height: 42px; border: 1px solid var(--border); border-radius: 10px; background: var(--bg-card); color: var(--text-main); padding: 10px 12px; outline: none; }
.posb-wa-panel input:focus { border-color: var(--brand-red); box-shadow: 0 0 0 3px rgba(139, 30, 63, 0.14); }
.posb-wa-panel p { font-size: 0.73rem; color: var(--text-muted); }
.posb-compare-panel { margin-top: 14px; border-top: 1px solid var(--border); padding-top: 14px; display: flex; flex-direction: column; gap: 8px; }
.posb-compare-head { display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.posb-compare-head label { font-size: 0.78rem; font-weight: 700; color: var(--text-muted); }
.posb-compare-head .btn { height: 36px; padding: 6px 10px; }
.posb-compare-actions { display: grid; grid-template-columns: 1fr auto; gap: 8px; }
.posb-compare-actions .btn { height: 42px; }
.posb-compare-output { background: var(--bg-card); border: 1px solid var(--border); border-radius: 10px; padding: 10px 12px; font-size: 0.77rem; color: var(--text-main); line-height: 1.45; }

@media (max-width: 620px) {
  .posb-compare-actions { grid-template-columns: 1fr; }
}

@media (max-width: 980px) {
  .posb-integrated-wrap { grid-template-columns: 1fr; }
  .posb-integrated-left { border-right: none; border-bottom: 1px solid var(--border); }
}

@media (max-width: 1120px) {
  .posb-grid { grid-template-columns: 1fr; }
}
@media (max-width: 760px) {
  .posb-hero { flex-direction: column; align-items: stretch; }
  .posb-hero .btn { width: 100%; }
  .posb-kpi-grid { grid-template-columns: 1fr; }
}

/* Split Layouts */
.split-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; align-items: start; }
@media (max-width: 900px) { .split-layout { grid-template-columns: 1fr; } .sidebar { position: absolute; transform: translateX(-100%); } }
.split-30-70 { display: grid; grid-template-columns: 350px 1fr; gap: 24px; align-items: start; }
@media (max-width: 1024px) { .split-30-70 { grid-template-columns: 1fr; } }

/* Toast */
#toastMsg { position: fixed; bottom: 24px; right: 24px; background: var(--text-main); color: var(--bg-card); padding: 12px 24px; border-radius: var(--radius-md); font-weight: 600; font-size: 0.875rem; box-shadow: var(--shadow-md); transform: translateY(100px); opacity: 0; transition: all 0.3s cubic-bezier(0.16, 1, 0.3, 1); z-index: 2000; display: flex; align-items: center; gap: 8px;}
#toastMsg.show { transform: translateY(0); opacity: 1; }

/* Utility Classes used by user */
.grid { display: grid; } .grid-cols-1 { grid-template-columns: repeat(1, minmax(0, 1fr)); } .gap-4 { gap: 1rem; } .mb-6 { margin-bottom: 1.5rem; } .mb-4 { margin-bottom: 1rem; } .flex { display: flex; } .gap-3 { gap: 0.75rem; } .flex-1 { flex: 1 1 0%; } .w-full { width: 100%; } .items-end { align-items: flex-end; } .mt-4 { margin-top: 1rem; } .overflow-x-auto { overflow-x: auto; } .hidden { display: none !important; } .p-4 { padding: 1rem; }
@media (min-width: 768px) { .md\:grid-cols-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } }

/* Export Overrides & Printing */
body.exporting-pdf input, body.exporting-pdf select { border: none !important; background: transparent !important; appearance: none; -moz-appearance: none; -webkit-appearance: none; box-shadow: none !important; color: #000 !important; padding: 0 !important; }
body.exporting-pdf .no-print, body.exporting-pdf button { display: none !important; }
.print-only { display: none; }

@media print {
  body { background: white; }
  .sidebar, .topbar, .btn, .no-print, .modal-overlay, #toastMsg { display: none !important; }
  
  /* Reset workspace for smooth multi-page flow */
  .main-content { padding: 0 !important; margin: 0 !important; overflow: visible !important; width: 100% !important; }
  .workspace { padding: 0 !important; margin: 0 !important; overflow: visible !important; width: 100% !important; }
  .card { border: none !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; }
  .table-container { border: none !important; box-shadow: none !important; overflow: visible !important; }

  /* BODA & Slip (These exist outside .main-content) */
  body.printing-boda .main-content { display: none !important; }
  body.printing-boda #boda-print-area { display: block !important; position: absolute; inset: 0; width: 100%; color: black; }
  
  body.printing-slip .main-content { display: none !important; }
  body.printing-slip #slip-print-area { display: block !important; position: relative; width: 100%; max-width: 80mm; color: black; font-family: monospace; font-size: 12px; padding: 10px; margin: 0 auto; }

  /* Rates, Bill, Ledger (These exist inside .main-content) */
  body.printing-rates .tab-panel { display: none !important; }
  body.printing-rates #tab-panel-rates { display: block !important; position: relative; width: 100%; color: black; }
  
  body.printing-bill .tab-panel { display: none !important; }
  body.printing-bill #tab-panel-bill { display: block !important; position: relative; width: 100% !important; max-width: none !important; margin: 0 !important; color: black; }
  body.printing-bill #tab-panel-bill > .stats-grid,
  body.printing-bill #tab-panel-bill > .card:not(#printable-area-wrap) { display: none !important; }
  body.printing-bill #printable-area-wrap { display: block !important; width: 100% !important; max-width: none !important; margin: 0 !important; padding: 0 !important; box-shadow: none !important; background: #fff !important; color: #000 !important; }
  body.printing-bill #printable-area { width: auto !important; min-height: auto !important; margin: 0 !important; padding: 0 !important; box-shadow: none !important; border-radius: 0 !important; overflow: visible !important; font-size: 11px !important; }
  body.printing-bill #tdBillTable { table-layout: fixed !important; page-break-inside: auto; }
  body.printing-bill #tdBillTable th,
  body.printing-bill #tdBillTable td { padding: 4px 3px !important; font-size: 10px !important; line-height: 1.2 !important; word-break: break-word; }
  body.printing-bill #tdBillTable tr { page-break-inside: avoid; page-break-after: auto; }
  body.printing-bill .print-header { margin-bottom: 12px !important; }
  body.printing-bill .header-info { margin-bottom: 12px !important; line-height: 1.45 !important; }
  body.printing-bill .certifications { font-size: 11px !important; line-height: 1.25 !important; }
  body.printing-bill .bill-footer { display: none !important; }
  
  body.printing-ledger .tab-panel { display: none !important; }
  body.printing-ledger #tab-panel-register { display: block !important; position: relative; width: 100%; color: black; }
  body.printing-ledger #tab-panel-register .print-only { display: block; text-align: center; margin-bottom: 20px; }
  
  table th { background-color: transparent !important; -webkit-print-color-adjust: exact; border-bottom: 2px solid #000; color: #000; }
  .badge { border: none; padding: 0; background: transparent; color: black; }
}

/* Specific Layouts */
#boda-print-area { font-family: 'Inter', sans-serif; font-size: 13px; line-height: 1.4; padding: 20px; color: #000; background: #fff; }
.boda-header { text-align: center; border-bottom: 2px solid #000; margin-bottom: 15px; padding-bottom: 10px; }
.boda-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: start; }
.boda-header h2 { margin: 0; font-size: 20px; }
.boda-meta { display: flex; justify-content: space-between; gap: 16px; margin-top: 10px; font-size: 14px; font-weight: 600; }
.boda-section-title { margin-bottom: 5px; border-bottom: 1px solid #000; font-size: 14px; text-transform: uppercase; }
.boda-table { width: 100%; border-collapse: collapse; }
.boda-table th, .boda-table td { border: 1px solid #000; padding: 4px; color: #000; }
.boda-table th:first-child, .boda-table td:first-child { text-align: left; }
.boda-table th:last-child, .boda-table td:last-child { text-align: right; }
.boda-table tfoot td { font-weight: 700; }
.boda-grand-row { font-size: 15px; }
.boda-balance-words { margin-top: 15px; font-size: 14px; }
#boda-cl-bal-words { text-transform: capitalize; }
.boda-cash-details { margin-top: 25px; border-top: 1px dashed #000; padding-top: 15px; }
.boda-cash-details h3, .boda-remarks h3 { margin-bottom: 10px; font-size: 14px; }
#boda-notes-breakdown { font-family: monospace; font-size: 13px; font-weight: 600; white-space: pre-wrap; }
.boda-remarks { display: none; margin-top: 15px; }
#boda-remark-text { border: 1px solid #000; padding: 10px; font-size: 13px; font-weight: 600; }
.boda-signatures { display: flex; justify-content: space-between; align-items: flex-end; margin-top: 50px; }
.boda-signatures div { width: 200px; border-top: 1px solid #000; padding-top: 5px; text-align: center; }

@media print {
  @page { size: A4 portrait; margin: 12mm; }
  body.printing-boda #boda-print-area { padding: 0; }
}

@media (max-width: 700px) {
  .boda-meta { flex-direction: column; gap: 4px; text-align: left; }
  .boda-grid { grid-template-columns: 1fr; }
}

#printable-area{background:#fff;margin:0 auto 24px;padding:14mm 14mm 12mm;width:210mm;min-height:297mm;box-shadow:0 8px 24px rgba(0,0,0,.13);color:#000;font-size:13px;border-radius:4px;overflow:hidden;}
.print-header{text-align:center;margin-bottom:16px;padding-bottom:6px;border-bottom:1.2px solid #000;}
.print-header h2{font-family:"Times New Roman",Georgia,serif;margin:0 0 4px;font-size:20px;font-weight:700;text-transform:uppercase;letter-spacing:0.3px;}
.print-header h3{font-family:Arial,sans-serif;margin:0;font-size:15px;font-weight:700;text-decoration:underline;}
.header-info{position:relative;text-align:center;margin-bottom:14px;font-weight:500;line-height:1.45;}
.header-info .date-right{position:absolute;right:0;top:0;font-weight:600;}
#printable-area table{width:100%;border-collapse:collapse;margin-bottom:10px;}
#printable-area th,#printable-area td{border:1px solid #000;padding:6px 4px;text-align:center;font-size:11.5px;line-height:1.2;vertical-align:middle;}
#printable-area th{background-color:#f8f9fa;font-weight:700;text-transform:uppercase;font-size:10.5px;}
#printable-area .total-row td{font-weight:700;background-color:#f8f9fa;font-size:12px;}
.certifications{margin-top:8px;line-height:1.3;font-size:12.5px;}
.certifications p{margin:4px 0;}
.dynamic-text{border-bottom:1px dashed #000;display:inline-block;min-width:60px;font-weight:600;text-align:center;}
.signatures{margin-top:14px;display:flex;justify-content:space-between;font-weight:600;}
.signature-block{text-align:center;width:200px;font-size:12px;}
.signature-block span{display:block;margin-top:28px;border-top:1px solid #000;padding-top:2px;}
.bill-footer{margin-top:12px;padding-top:8px;border-top:1px solid #ddd;display:flex;justify-content:space-between;font-size:10.5px;color:#444;}

/* ══════════════════════════════════════
   GEN Z OPS DESK — Design System v2
══════════════════════════════════════ */
@media screen {
  :root {
    --bg-app: #f2f2f7;
    --bg-sidebar: #0c0c1e;
    --bg-card: #ffffff;
    --bg-input: #f8f7ff;
    --text-main: #18181b;
    --text-muted: #71717a;
    --border: #e4e4e7;
    --border-sidebar: rgba(255, 255, 255, 0.07);
    --sidebar-text: #fafafa;
    --sidebar-muted: #a1a1aa;
    --sidebar-hover: rgba(255, 255, 255, 0.06);
    --sidebar-brand: #ffffff;
    --brand-red: #e11d48;
    --brand-red-hover: #be123c;
    --primary: #e11d48;
    --blue: #2563eb;
    --success: #16a34a;
    --danger: #dc2626;
    --accent-soft: #fff1f2;
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.04), 0 1px 2px rgba(0, 0, 0, 0.02);
    --shadow-md: 0 8px 28px rgba(0, 0, 0, 0.09), 0 2px 8px rgba(0, 0, 0, 0.04);
    --shadow-modal: 0 24px 64px rgba(0, 0, 0, 0.14);
    --radius-md: 10px;
    --radius-lg: 16px;
  }

  body {
    background: var(--bg-app);
    letter-spacing: 0;
  }

  /* ── Sidebar (dark, vivid accent) ─────────── */
  .sidebar {
    width: 252px;
    background: linear-gradient(180deg, #0c0c1e 0%, #0e0e24 100%);
    border-right: 1px solid rgba(255, 255, 255, 0.06);
    box-shadow: 4px 0 32px rgba(0, 0, 0, 0.22);
    color: var(--sidebar-text);
  }
  .brand-header {
    padding: 22px 20px 18px;
    border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  }
  .brand-header h1 { color: #ffffff; font-size: 1.1rem; letter-spacing: -0.025em; }
  .brand-header h1 i { color: #fb7185; }
  .brand-header p { color: var(--sidebar-muted); font-size: 0.72rem; }
  .nav-menu { padding: 14px 10px; gap: 3px; }
  .tab-btn {
    color: var(--sidebar-muted);
    border-radius: 10px;
    padding: 10px 12px;
    font-weight: 600;
    font-size: 0.82rem;
    transition: all 0.15s ease;
  }
  .tab-btn:hover {
    background: rgba(255, 255, 255, 0.07);
    color: #f4f4f5;
  }
  .tab-btn.active {
    background: linear-gradient(135deg, rgba(225, 29, 72, 0.9), rgba(190, 18, 60, 0.95));
    color: #ffffff;
    box-shadow: 0 6px 20px rgba(225, 29, 72, 0.32), inset 0 1px 0 rgba(255, 255, 255, 0.12);
  }
  .tab-btn.active svg { color: #ffffff; }

  /* ── Topbar (frosted glass) ────────────────── */
  .topbar {
    height: 60px;
    padding: 0 28px;
    background: rgba(242, 242, 247, 0.85);
    border-bottom: 1px solid rgba(228, 228, 231, 0.9);
    backdrop-filter: blur(24px);
    -webkit-backdrop-filter: blur(24px);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.04);
  }
  .topbar-title { font-size: 0.95rem; font-weight: 700; letter-spacing: -0.02em; }

  /* ── Workspace & Cards ─────────────────────── */
  .workspace { padding: 24px 28px; }
  .tab-panel { max-width: 1280px; }

  .card, .omni-card {
    background: var(--bg-card);
    border: 1px solid var(--border);
    border-radius: var(--radius-lg);
    box-shadow: var(--shadow-sm);
  }
  .card { padding: 22px; margin-bottom: 20px; }
  .card-header { margin-bottom: 16px; padding-bottom: 14px; border-bottom: 1px solid var(--border); }
  .card-title { font-size: 0.95rem; font-weight: 700; letter-spacing: -0.01em; }

  /* ── Inputs ────────────────────────────────── */
  .input-group { gap: 5px; }
  .input-group label, .posb-field label {
    color: var(--text-muted);
    font-size: 0.7rem;
    letter-spacing: 0.055em;
    font-weight: 700;
  }
  input, select, .input-field, textarea {
    background: var(--bg-input);
    border-color: var(--border);
    border-radius: 10px;
    transition: border-color 0.15s ease, box-shadow 0.15s ease, background 0.15s ease;
  }
  input, select, .input-field { height: 40px; padding: 9px 12px; }
  input:focus, select:focus, .input-field:focus, textarea:focus {
    border-color: var(--brand-red);
    box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.1);
    background: #fff;
  }
  .form-row { gap: 14px; margin-bottom: 14px; }
  .composite-input { height: 40px; border-radius: 10px; }
  .composite-input:focus-within {
    border-color: var(--brand-red);
    box-shadow: 0 0 0 3px rgba(225, 29, 72, 0.1);
  }

  /* ── Buttons ───────────────────────────────── */
  .btn { height: 40px; padding: 9px 16px; border-radius: 10px; font-weight: 650; transition: all 0.15s ease; }
  .btn-primary {
    background: linear-gradient(135deg, #e11d48, #be123c);
    color: #fff;
    box-shadow: 0 4px 12px rgba(225, 29, 72, 0.28);
    border: none;
  }
  .btn-primary:hover {
    background: linear-gradient(135deg, #f43f5e, #e11d48);
    transform: translateY(-1px);
    box-shadow: 0 6px 18px rgba(225, 29, 72, 0.36);
  }
  .btn-primary:disabled { opacity: 0.45; transform: none; box-shadow: none; }
  .btn-outline { background: #ffffff; color: var(--text-main); border-color: var(--border); }
  .btn-outline:hover { background: var(--bg-input); border-color: #c4c4cc; }
  .btn-success {
    background: linear-gradient(135deg, #16a34a, #15803d);
    color: #fff;
    box-shadow: 0 4px 12px rgba(22, 163, 74, 0.22);
    border: none;
  }
  .btn-success:hover { transform: translateY(-1px); box-shadow: 0 6px 16px rgba(22, 163, 74, 0.3); }
  .btn-icon { border: 1px solid transparent; border-radius: 8px; color: var(--text-muted); }
  .btn-icon:hover { background: var(--bg-input); border-color: var(--border); color: var(--text-main); }

  /* ── Stats & Tables ────────────────────────── */
  .stats-grid { gap: 14px; }
  .stat-card {
    border: 1px solid var(--border);
    border-radius: 14px;
    box-shadow: var(--shadow-sm);
    transition: box-shadow 0.2s ease, transform 0.2s ease;
  }
  .stat-card:hover { box-shadow: var(--shadow-md); transform: translateY(-2px); }
  .stat-icon-wrap { border-radius: 10px; background: var(--accent-soft); color: var(--brand-red); }
  .posb-kpi-card { border: 1px solid var(--border); border-radius: 12px; box-shadow: none; }
  .table-container { border: 1px solid var(--border); border-radius: 12px; box-shadow: none; overflow: hidden; }
  table th { background: #fafafa; color: var(--text-muted); font-size: 0.7rem; letter-spacing: 0.055em; border-bottom: 1px solid var(--border); }
  table td { border-bottom-color: var(--border); }
  table tbody tr:hover td { background: #fdf9ff; }

  /* ── Dashboard ─────────────────────────────── */
  .omni-dashboard { gap: 16px; }
  .omni-footfall-card {
    min-height: 160px;
    padding: 28px;
    border: none;
    border-radius: var(--radius-lg);
    background: linear-gradient(135deg, #0d0c1e 0%, #1c0832 50%, #200818 100%);
    box-shadow: 0 8px 36px rgba(0, 0, 0, 0.18);
  }
  .omni-footfall-status {
    background: rgba(255, 255, 255, 0.08);
    border: 1px solid rgba(255, 255, 255, 0.13);
    border-radius: 12px;
    backdrop-filter: blur(8px);
    box-shadow: none;
  }
  .omni-wave { display: none; }
  .omni-bento-grid { gap: 16px; }
  .omni-card { padding: 20px; box-shadow: none; }
  .omni-card-heading h3 { font-size: 0.9rem; font-weight: 700; letter-spacing: -0.01em; }
  .omni-cash-card {
    background: linear-gradient(135deg, #e11d48 0%, #9f0c2f 100%);
    box-shadow: 0 8px 28px rgba(225, 29, 72, 0.28);
  }
  .omni-action-list button {
    border-radius: 10px;
    background: var(--bg-input);
    border-color: var(--border);
    transition: all 0.15s ease;
  }
  .omni-action-list button:hover {
    border-color: var(--brand-red);
    background: var(--accent-soft);
    transform: translateX(2px);
  }
  .omni-nudge { background: var(--bg-input); border-radius: 10px; border-color: var(--border); }
  .omni-flow-grid > div { border-radius: 10px; background: var(--bg-input); }
  .omni-link, .omni-nudge-cta { color: var(--brand-red); font-weight: 700; }
  .omni-live { background: #fff0f2; color: var(--brand-red); border-radius: 6px; font-weight: 800; }

  /* ── Passbook / Kanban ─────────────────────── */
  .passbook-column, .passbook-card, .posb-controls, .posb-chart-card, .posb-result-card {
    border-color: var(--border);
    box-shadow: none;
  }
  .passbook-column { border-radius: 12px; background: #fafafa; }
  .passbook-column-header { background: #ffffff; }
  .passbook-card {
    background: #ffffff;
    border-radius: 10px;
    box-shadow: 0 1px 4px rgba(0, 0, 0, 0.04);
    transition: transform 0.15s ease, box-shadow 0.15s ease;
  }
  .passbook-card:hover { transform: translateY(-1px); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08); }
  .ledger-view-toggle { border-radius: 10px; background: #f4f4f7; }
  .ledger-view-btn { border-radius: 8px; }
  .ledger-view-btn.active { color: var(--brand-red); box-shadow: none; background: #ffffff; }

  /* ── POSB / Scheme Tools ───────────────────── */
  .posb-integrated-shell { border-radius: var(--radius-lg); }
  .posb-integrated-right { background: var(--bg-input); }
  .posb-controls { border-radius: 14px; }
  .posb-chart-card { border-radius: 14px; }

  /* ── Treasury ──────────────────────────────── */
  .treasury-hero {
    background: linear-gradient(135deg, rgba(225, 29, 72, 0.06) 0%, rgba(37, 99, 235, 0.04) 100%);
    border: 1px solid rgba(225, 29, 72, 0.12);
    border-radius: var(--radius-lg);
  }
  .treasury-chip { background: var(--bg-card); border-color: var(--border); color: var(--brand-red); }
  .treasury-metric { border-radius: 12px; }

  /* ── Modals ────────────────────────────────── */
  .modal-overlay { background: rgba(0, 0, 0, 0.5); backdrop-filter: blur(8px); }
  .modal-content {
    background: #ffffff;
    border: 1px solid var(--border);
    border-radius: 18px;
    box-shadow: 0 24px 64px rgba(0, 0, 0, 0.12);
  }

  /* ── Reports/Analytics ─────────────────────── */
  .is-kpi-card { padding: 18px 20px; }
  .is-kpi-value { font-size: 1.6rem; letter-spacing: -0.02em; }
  .report-panel { border-radius: var(--radius-lg); box-shadow: none; }
  .report-toolbar { border-radius: var(--radius-md); }

  /* ── Toast ─────────────────────────────────── */
  #toastMsg {
    background: #18181b;
    color: #fafafa;
    border-radius: 12px;
    box-shadow: 0 8px 28px rgba(0, 0, 0, 0.2);
    padding: 12px 20px;
    font-size: 0.82rem;
    font-weight: 600;
  }

  /* ── Dark Mode ─────────────────────────────── */
  body.dark {
    --bg-app: #0a0a14;
    --bg-sidebar: #07070f;
    --bg-card: #111120;
    --bg-input: #16162c;
    --text-main: #fafafa;
    --text-muted: #9ca3af;
    --border: #1e1e36;
    --border-sidebar: rgba(255, 255, 255, 0.05);
    --sidebar-text: #fafafa;
    --sidebar-muted: #9ca3af;
    --sidebar-hover: rgba(255, 255, 255, 0.05);
    --sidebar-brand: #ffffff;
    --accent-soft: #2d0f18;
  }
  body.dark .sidebar {
    background: linear-gradient(180deg, #07070e 0%, #090918 100%);
    border-right-color: rgba(255, 255, 255, 0.05);
    box-shadow: 4px 0 32px rgba(0, 0, 0, 0.4);
  }
  body.dark .topbar {
    background: rgba(10, 10, 20, 0.9);
    border-bottom-color: var(--border);
    backdrop-filter: blur(24px);
    box-shadow: none;
  }
  body.dark .card, body.dark .omni-card, body.dark .passbook-card {
    background: var(--bg-card);
    border-color: var(--border);
  }
  body.dark .passbook-column, body.dark .posb-integrated-right { background: #0d0d1e; }
  body.dark .passbook-column-header { background: var(--bg-card); }
  body.dark .btn-outline { background: var(--bg-card); color: var(--text-main); border-color: var(--border); }
  body.dark .omni-action-list button,
  body.dark .omni-nudge,
  body.dark .omni-flow-grid > div { background: var(--bg-input); border-color: var(--border); }
  body.dark .modal-content { background: var(--bg-card); border-color: var(--border); }
  body.dark input:focus, body.dark select:focus, body.dark .input-field:focus { background: var(--bg-input); }
  body.dark table th { background: rgba(255, 255, 255, 0.02); }
  body.dark .treasury-hero { border-color: rgba(225, 29, 72, 0.14); }
  body.dark .omni-footfall-card {
    background: linear-gradient(135deg, #07070e 0%, #130828 50%, #0f0518 100%);
  }

  /* ── Display Font (Plus Jakarta Sans for big numbers & headings) ── */
  .stat-card-value,
  .omni-ring-wrap strong,
  .is-kpi-value,
  .posb-kpi-value,
  .omni-nudge strong,
  .omni-cash-card > strong,
  .omni-flow-grid strong,
  .omni-kpi-row strong {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
    letter-spacing: -0.025em;
  }
  .brand-header h1,
  .card-title,
  .omni-card-heading h3,
  .dashboard-hero h2,
  .treasury-hero h2,
  h2, h3, h4 {
    font-family: 'Plus Jakarta Sans', 'Inter', sans-serif;
  }

  /* ── Smooth Fade In ─────────────────────────── */
  @keyframes fadeIn { from { opacity: 0; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
  .tab-panel.active { animation: fadeIn 0.25s ease; }

  /* ── Responsive ────────────────────────────── */
  @media (max-width: 900px) {
    .workspace { padding: 20px; }
    .topbar { padding: 0 20px; }
  }
  @media (max-width: 620px) {
    .workspace { padding: 14px; }
    .topbar { height: 56px; padding: 0 14px; }
    .card { padding: 16px; }
    .card-header { align-items: flex-start; }
  }
}