/* ═══════════════════════════════════════════════════════════
   TAXMAN256 — Professional UI (Ocean Teal Theme)
   Mobile-first · No sidebar overlap · Accessible
═══════════════════════════════════════════════════════════ */
:root, body[data-theme="ocean"]{
  --blue:#0e7490; --blue-dk:#0a5c73; --gold:#f59e0b; --gold-lt:#fef3c7;
  --green:#059669; --red:#dc2626; --orange:#d97706;
  --bg:#ecfeff; --card:#ffffff; --border:#a5f3fc; --text:#164e63; --muted:#4e8fa0;
  --surface:#ffffff; --surface-2:#e0f9fc; --surface-3:#cff6fb; --surface-hover:#f0fdff;
  --input-bg:#fff; --input-border:#67e8f9;
  --topbar-bg:#fff; --table-head-bg:#e0f9fc; --table-head-text:#0e7490;
  --note-bg:#fef3c7; --note-text:#78350f; --kanban-col-bg:#e0f9fc;
  --modal-bg:#fff; --autocomplete-bg:#fff; --autocomplete-hover:#e0f9fc;
  --reminder-bg:#fef3c7; --reminder-text:#78350f; --empty-icon:#a5f3fc;
  --alert-success-bg:#d1fae5; --alert-success-text:#065f46;
  --alert-danger-bg:#fee2e2;  --alert-danger-text:#991b1b;
  --alert-warning-bg:#fef3c7; --alert-warning-text:#92400e;
  --alert-info-bg:#e0f9fc;    --alert-info-text:#0e7490;
  --shadow:0 3px 14px rgba(14,116,144,.1);
  --topbar-shadow:0 1px 4px rgba(0,0,0,.05);
  --sidebar-bg:var(--blue);
  --sidebar-link-hover:rgba(255,255,255,.1); --sidebar-link-active-bg:rgba(245,158,11,.22);
  --sidebar-footer-bg:rgba(0,0,0,.15);
  --line-soft:#f0f2f5; --line-subtle:#f3f4f6;
  --modal-overlay:rgba(0,0,0,.48);
  --copy-btn-border:#d4d9e4;
  --divider:var(--border);
  --breadcrumb-sep:#d1d5db;
  --note-border:var(--gold);
  --alert-success-border:#059669;
  --alert-danger-border:#dc2626;
  --alert-warning-border:#d97706;
  --alert-info-border:#0e7490;
  --sidebar-w:248px; --sidebar-w-collapsed:64px; --topbar-h:54px; --r:9px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;height:100%}
body{font-family:'Segoe UI',system-ui,sans-serif;background:radial-gradient(circle at top left, rgba(14,116,144,.16), transparent 26%), radial-gradient(circle at bottom right, rgba(245,158,11,.14), transparent 28%), var(--bg);color:var(--text);margin:0;font-size:14px;line-height:1.55;min-height:100vh;overflow-x:hidden;transition:background .35s ease,color .35s ease;position:relative;}
body::selection{background:rgba(14,116,144,.18);color:var(--text)}
body.nav-open{overflow:hidden;touch-action:none}
body[data-theme="forest"]{
  --blue:#214d3a; --blue-dk:#163528; --gold:#b88746; --gold-lt:#f7f1e4;
  --green:#2f8f63; --red:#c85d4d; --orange:#d59041;
  --bg:#eef3ef; --card:#ffffff; --border:#d8e3db; --text:#24312a; --muted:#718077;
  --surface:#ffffff; --surface-2:#e8f0ea; --surface-3:#dde8df; --surface-hover:#f0f5f1;
  --input-bg:#fff; --input-border:#c0d4c4;
  --topbar-bg:#fff; --table-head-bg:#e8f0ea; --table-head-text:#3a5244;
  --note-bg:#f7f1e4; --note-text:#5a3e10; --kanban-col-bg:#e8f0ea;
  --modal-bg:#fff; --autocomplete-bg:#fff; --autocomplete-hover:#eaf2ec;
  --reminder-bg:#f7f1e4; --reminder-text:#5a3e10; --empty-icon:#c0d4c4;
  --alert-success-bg:#d4edda; --alert-success-text:#155724;
  --alert-danger-bg:#f8d7da;  --alert-danger-text:#721c24;
  --alert-warning-bg:#fff3cd; --alert-warning-text:#856404;
  --alert-info-bg:#d0e8ff;    --alert-info-text:#004085;
  --shadow:0 3px 14px rgba(24,53,40,.08);
}
body[data-theme="sunset"]{
  --blue:#7a3b2e; --blue-dk:#57291f; --gold:#d68a3d; --gold-lt:#fff1e4;
  --green:#3d8b68; --red:#c85c47; --orange:#e29a49;
  --bg:#f7f0eb; --card:#fffdfb; --border:#ead8cd; --text:#3c302b; --muted:#8a776b;
  --surface:#fffdfb; --surface-2:#f2e8df; --surface-3:#ede0d4; --surface-hover:#faf4ef;
  --input-bg:#fffdfb; --input-border:#d9c4b4;
  --topbar-bg:#fffdfb; --table-head-bg:#f2e8df; --table-head-text:#5c3d2e;
  --note-bg:#fff1e4; --note-text:#6b3a10; --kanban-col-bg:#f2e8df;
  --modal-bg:#fffdfb; --autocomplete-bg:#fffdfb; --autocomplete-hover:#f2e8df;
  --reminder-bg:#fff1e4; --reminder-text:#6b3a10; --empty-icon:#d9c4b4;
  --alert-success-bg:#d4edda; --alert-success-text:#155724;
  --alert-danger-bg:#f8d7da;  --alert-danger-text:#721c24;
  --alert-warning-bg:#fff3cd; --alert-warning-text:#856404;
  --alert-info-bg:#d0e8ff;    --alert-info-text:#004085;
  --shadow:0 3px 14px rgba(122,59,46,.09);
}
body[data-theme="midnight"]{
  --blue:#2f4f76; --blue-dk:#203854; --gold:#9cb7d7; --gold-lt:#eef4fb;
  --green:#5aa6a2; --red:#d26a6d; --orange:#d0a563;
  --bg:#edf1f6; --card:#fbfcfe; --border:#d6dfeb; --text:#243449; --muted:#6c7e95;
  --surface:#fbfcfe; --surface-2:#edf1f6; --surface-3:#e4eaf3; --surface-hover:#f4f7fb;
  --input-bg:#fbfcfe; --input-border:#c4d0e0;
  --topbar-bg:#fbfcfe; --table-head-bg:#edf1f6; --table-head-text:#3a4f6a;
  --note-bg:#eef4fb; --note-text:#1e3a5a; --kanban-col-bg:#edf1f6;
  --modal-bg:#fbfcfe; --autocomplete-bg:#fbfcfe; --autocomplete-hover:#edf1f6;
  --reminder-bg:#eef4fb; --reminder-text:#1e3a5a; --empty-icon:#c4d0e0;
  --alert-success-bg:#d4edda; --alert-success-text:#155724;
  --alert-danger-bg:#f8d7da;  --alert-danger-text:#721c24;
  --alert-warning-bg:#fff3cd; --alert-warning-text:#856404;
  --alert-info-bg:#d0e8ff;    --alert-info-text:#004085;
  --shadow:0 3px 16px rgba(32,56,84,.09);
}
body[data-theme="dark"]{
  --blue:#7ea9e6; --blue-dk:#5d89c7; --gold:#f0b85a; --gold-lt:#2d2415;
  --green:#47c78a; --red:#ff7c7c; --orange:#f0b463; --purple:#af8df0;
  --bg:#0f1722; --card:#151f2d; --border:#243246; --text:#e6eef7; --muted:#9fb0c5;
  --surface:#151f2d; --surface-2:#182434; --surface-3:#111b29; --surface-hover:#1f3046;
  --line-soft:#223248; --line-subtle:#223248;
  --input-bg:#101827; --input-border:#32455f;
  --topbar-bg:#111b29; --topbar-shadow:0 1px 4px rgba(0,0,0,.35);
  --table-head-bg:#182434; --table-head-text:#9fb0c5;
  --note-bg:#2b2414; --note-text:#f2d9a6; --note-border:#f0b85a;
  --kanban-col-bg:#111b29;
  --modal-overlay:rgba(2,10,18,.72); --modal-bg:#151f2d;
  --copy-btn-border:#32455f; --autocomplete-bg:#151f2d; --autocomplete-hover:#1f3046;
  --reminder-bg:#2b2114; --reminder-text:#f2d9a6; --empty-icon:#42536a;
  --divider:#243246; --breadcrumb-sep:#32455f;
  --alert-success-bg:#0d2e1a; --alert-success-text:#6ee7a0; --alert-success-border:#47c78a;
  --alert-danger-bg:#2e0d0d;  --alert-danger-text:#fca5a5; --alert-danger-border:#ff7c7c;
  --alert-warning-bg:#2e2000; --alert-warning-text:#fcd34d; --alert-warning-border:#f0b463;
  --alert-info-bg:#0d1e2e;    --alert-info-text:#93c5fd;   --alert-info-border:#7ea9e6;
  --sidebar-link-hover:rgba(255,255,255,.08); --sidebar-link-active-bg:rgba(240,184,90,.18);
  --sidebar-footer-bg:rgba(0,0,0,.28);
  --shadow:0 10px 28px rgba(0,0,0,.28);
}
body[data-theme="ocean"]{
  --blue:#0e7490; --blue-dk:#0a5c73; --gold:#f59e0b; --gold-lt:#fef3c7;
  --green:#059669; --red:#dc2626; --orange:#d97706;
  --bg:#ecfeff; --card:#ffffff; --border:#a5f3fc; --text:#164e63; --muted:#4e8fa0;
  --surface:#ffffff; --surface-2:#e0f9fc; --surface-3:#cff6fb; --surface-hover:#f0fdff;
  --input-bg:#fff; --input-border:#67e8f9;
  --topbar-bg:#fff; --table-head-bg:#e0f9fc; --table-head-text:#0e7490;
  --note-bg:#fef3c7; --note-text:#78350f; --kanban-col-bg:#e0f9fc;
  --modal-bg:#fff; --autocomplete-bg:#fff; --autocomplete-hover:#e0f9fc;
  --reminder-bg:#fef3c7; --reminder-text:#78350f; --empty-icon:#a5f3fc;
  --alert-success-bg:#d1fae5; --alert-success-text:#065f46;
  --alert-danger-bg:#fee2e2;  --alert-danger-text:#991b1b;
  --alert-warning-bg:#fef3c7; --alert-warning-text:#92400e;
  --alert-info-bg:#e0f9fc;    --alert-info-text:#0e7490;
  --shadow:0 3px 14px rgba(14,116,144,.1);
}
body[data-theme="rose"]{
  --blue:#be185d; --blue-dk:#9d174d; --gold:#d97706; --gold-lt:#fff7ed;
  --green:#16a34a; --red:#dc2626; --orange:#ea580c;
  --bg:#fff1f2; --card:#ffffff; --border:#fecdd3; --text:#4c0519; --muted:#9f6070;
  --surface:#ffffff; --surface-2:#ffe4e6; --surface-3:#fecdd3; --surface-hover:#fff5f6;
  --input-bg:#fff; --input-border:#fda4af;
  --topbar-bg:#fff; --table-head-bg:#ffe4e6; --table-head-text:#9f1239;
  --note-bg:#fff7ed; --note-text:#7c2d12; --kanban-col-bg:#ffe4e6;
  --modal-bg:#fff; --autocomplete-bg:#fff; --autocomplete-hover:#ffe4e6;
  --reminder-bg:#fff7ed; --reminder-text:#7c2d12; --empty-icon:#fda4af;
  --alert-success-bg:#dcfce7; --alert-success-text:#166534;
  --alert-danger-bg:#fee2e2;  --alert-danger-text:#991b1b;
  --alert-warning-bg:#fff7ed; --alert-warning-text:#9a3412;
  --alert-info-bg:#fce7f3;    --alert-info-text:#9d174d;
  --shadow:0 3px 14px rgba(190,24,93,.09);
}
body[data-theme="charcoal"]{
  --blue:#9ca3af; --blue-dk:#6b7280; --gold:#f59e0b; --gold-lt:#292524;
  --green:#10b981; --red:#ef4444; --orange:#f59e0b; --purple:#8b5cf6;
  --bg:#111827; --card:#1f2937; --border:#374151; --text:#f9fafb; --muted:#9ca3af;
  --surface:#1f2937; --surface-2:#273244; --surface-3:#111827; --surface-hover:#2d3748;
  --line-soft:#374151; --line-subtle:#374151;
  --input-bg:#111827; --input-border:#4b5563;
  --topbar-bg:#1f2937; --topbar-shadow:0 1px 4px rgba(0,0,0,.4);
  --table-head-bg:#273244; --table-head-text:#9ca3af;
  --note-bg:#292524; --note-text:#fde68a; --note-border:#f59e0b;
  --kanban-col-bg:#111827;
  --modal-overlay:rgba(0,0,0,.75); --modal-bg:#1f2937;
  --copy-btn-border:#4b5563; --autocomplete-bg:#1f2937; --autocomplete-hover:#2d3748;
  --reminder-bg:#292524; --reminder-text:#fde68a; --empty-icon:#4b5563;
  --divider:#374151; --breadcrumb-sep:#4b5563;
  --alert-success-bg:#064e3b; --alert-success-text:#6ee7b7; --alert-success-border:#10b981;
  --alert-danger-bg:#450a0a;  --alert-danger-text:#fca5a5; --alert-danger-border:#ef4444;
  --alert-warning-bg:#451a03; --alert-warning-text:#fcd34d; --alert-warning-border:#f59e0b;
  --alert-info-bg:#1e3a5f;    --alert-info-text:#93c5fd;   --alert-info-border:#9ca3af;
  --sidebar-link-hover:rgba(255,255,255,.08); --sidebar-link-active-bg:rgba(245,158,11,.18);
  --sidebar-footer-bg:rgba(0,0,0,.3);
  --shadow:0 10px 28px rgba(0,0,0,.35);
}
body[data-theme="violet"]{
  --blue:#6d28d9; --blue-dk:#5b21b6; --gold:#f59e0b; --gold-lt:#fef3c7;
  --green:#059669; --red:#dc2626; --orange:#d97706;
  --bg:#f5f3ff; --card:#ffffff; --border:#ddd6fe; --text:#2e1065; --muted:#7c6fa0;
  --surface:#ffffff; --surface-2:#ede9fe; --surface-3:#ddd6fe; --surface-hover:#f5f3ff;
  --input-bg:#fff; --input-border:#c4b5fd;
  --topbar-bg:#fff; --table-head-bg:#ede9fe; --table-head-text:#4c1d95;
  --note-bg:#fef3c7; --note-text:#78350f; --kanban-col-bg:#ede9fe;
  --modal-bg:#fff; --autocomplete-bg:#fff; --autocomplete-hover:#ede9fe;
  --reminder-bg:#fef3c7; --reminder-text:#78350f; --empty-icon:#c4b5fd;
  --alert-success-bg:#d1fae5; --alert-success-text:#065f46;
  --alert-danger-bg:#fee2e2;  --alert-danger-text:#991b1b;
  --alert-warning-bg:#fef3c7; --alert-warning-text:#92400e;
  --alert-info-bg:#ede9fe;    --alert-info-text:#4c1d95;
  --shadow:0 3px 14px rgba(109,40,217,.1);
}
body[data-theme="earth"]{
  --blue:#78350f; --blue-dk:#5c2a0b; --gold:#b45309; --gold-lt:#fef3c7;
  --green:#15803d; --red:#b91c1c; --orange:#c2410c;
  --bg:#fdf8f0; --card:#fffdf7; --border:#e7d5b8; --text:#3b1f0a; --muted:#8a6a4a;
  --surface:#fffdf7; --surface-2:#f5ead6; --surface-3:#ede0c4; --surface-hover:#fdf5e8;
  --input-bg:#fffdf7; --input-border:#d4b896;
  --topbar-bg:#fffdf7; --table-head-bg:#f5ead6; --table-head-text:#6b3a10;
  --note-bg:#fef3c7; --note-text:#6b3a10; --kanban-col-bg:#f5ead6;
  --modal-bg:#fffdf7; --autocomplete-bg:#fffdf7; --autocomplete-hover:#f5ead6;
  --reminder-bg:#fef3c7; --reminder-text:#6b3a10; --empty-icon:#d4b896;
  --alert-success-bg:#dcfce7; --alert-success-text:#166534;
  --alert-danger-bg:#fee2e2;  --alert-danger-text:#991b1b;
  --alert-warning-bg:#fef3c7; --alert-warning-text:#9a3412;
  --alert-info-bg:#f5ead6;    --alert-info-text:#78350f;
  --shadow:0 3px 14px rgba(120,53,15,.1);
}
a{color:var(--blue);text-decoration:none}a:hover{color:var(--blue-dk)}
img{max-width:100%}

/* ── LAYOUT ── */
.layout{display:flex;min-height:100vh}
.main{flex:1;min-width:0;max-width:calc(100vw - var(--sidebar-w));display:flex;flex-direction:column;margin-left:var(--sidebar-w);transition:margin-left .28s;min-height:100vh}

/* ── SIDEBAR ── */
.sidebar{
  width:var(--sidebar-w);height:100vh;
  background:linear-gradient(180deg, rgba(14,116,144,.98) 0%, rgba(14,116,144,.92) 35%, rgba(9,104,115,.96) 100%);
  position:fixed;top:0;left:0;z-index:400;
  display:flex;flex-direction:column;
  overflow:hidden;
  transition:width .25s ease,background .35s ease,box-shadow .35s ease;
  box-shadow:0 22px 60px rgba(13,57,98,.18);
}
.sb-brand{
  display:flex;align-items:center;gap:.7rem;
  padding:.95rem 1rem;
  background:rgba(255,255,255,.06);
  border-bottom:1px solid rgba(255,255,255,.12);
  flex-shrink:0;
}
.sb-icon{
  width:36px;height:36px;background:var(--gold);border-radius:12px;
  display:flex;align-items:center;justify-content:center;
  color:#fff;font-size:1rem;flex-shrink:0;
}
.sb-brand-name{color:#fff;font-weight:800;font-size:.95rem;white-space:nowrap}
.sb-brand-sub{color:rgba(255,255,255,.75);font-size:.68rem;white-space:nowrap;margin-top:2px}
.sb-toggle{
  flex-shrink:0;width:30px;height:30px;
  background:rgba(255,255,255,.14);border:none;border-radius:10px;
  color:rgba(255,255,255,.9);font-size:.75rem;
  display:flex;align-items:center;justify-content:center;
  cursor:pointer;transition:background .18s,transform .18s;
}
.sb-toggle:hover{background:rgba(255,255,255,.26);color:#fff}
.sb-toggle i{pointer-events:none;transition:transform .25s ease}
.sb-scroll{
  flex:1;min-height:0;
  overflow-y:auto;overflow-x:hidden;
  padding:.45rem 0 .55rem;
  overscroll-behavior:contain;
}
.sb-scroll::-webkit-scrollbar{width:4px}
.sb-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.18);border-radius:3px}
.sb-link{
  display:flex;align-items:center;gap:.75rem;
  padding:.6rem 1rem;margin:1px 10px;
  border-radius:12px;
  color:rgba(255,255,255,.78);
  font-size:.86rem;font-weight:600;
  text-decoration:none;
  white-space:nowrap;overflow:hidden;
  transition:background .16s,color .16s,transform .18s;
}
.sb-link:hover{background:rgba(255,255,255,.12);color:#fff;transform:translateX(1px)}
.sb-link.active{
  background:var(--sidebar-link-active-bg);color:#fff;
  border-left:3px solid var(--gold);
  padding-left:calc(1rem - 3px);
}
.sb-link>i:first-child{width:18px;text-align:center;font-size:.88rem;flex-shrink:0}
.sb-lbl{flex:1;overflow:hidden;text-overflow:ellipsis}
.sb-badge{
  margin-left:auto;background:rgba(255,255,255,.13);color:#fff;
  font-size:.64rem;padding:.18rem .55rem;border-radius:999px;
  font-weight:700;min-width:20px;text-align:center;flex-shrink:0;
}
.sb-group{margin:.75rem 0}
.sb-group-hd{
  display:flex;align-items:center;gap:.75rem;
  width:calc(100% - 18px);margin:0 9px;
  padding:.65rem 1rem;
  background:rgba(255,255,255,.06);border:none;
  color:rgba(255,255,255,.72);
  border-radius:12px;
  font-size:.86rem;font-weight:700;
  cursor:pointer;text-align:left;
  white-space:nowrap;overflow:hidden;
  transition:background .16s,color .16s;
}
.sb-group-hd:hover{background:rgba(255,255,255,.14);color:#fff}
.sb-group-hd .sb-lbl{flex:1}
.sb-sub{
  overflow:hidden;
  max-height:0;
  transition:max-height .26s ease;
}
.sb-sub .sb-link{
  padding:.55rem 1rem .55rem 2.5rem;
  margin:0 10px;border-radius:10px;
  font-size:.82rem;font-weight:500;
  color:rgba(255,255,255,.65);
}
.sb-sub .sb-link:hover{color:#fff;background:rgba(255,255,255,.1)}
.sb-sub .sb-link.active{
  color:#fff;background:rgba(245,158,11,.22);
  border-left:3px solid var(--gold);
  padding-left:calc(2.5rem - 3px);
}
.sb-footer{
  flex-shrink:0;
  padding:.9rem 1rem;
  border-top:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  overflow:hidden;
}
.sb-user-info{margin-bottom:.6rem}
.sb-uname{color:#fff;font-weight:700;letter-spacing:.2px}
.sb-urole{color:rgba(255,255,255,.72);font-size:.8rem;line-height:1.4}
.sb-logout-btn{
  display:flex;align-items:center;gap:.6rem;width:100%;padding:.65rem .9rem;
  border-radius:12px;border:none;background:rgba(255,255,255,.08);
  color:#fff;font-weight:700;cursor:pointer;transition:background .2s;
}
.sb-logout-btn:hover{background:rgba(255,255,255,.15)}
}
.sb-user-info{margin-bottom:.4rem}
.sb-uname{color:#fff;font-weight:700;font-size:.82rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-urole{color:var(--gold);font-size:.67rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sb-logout-btn{
  display:flex;align-items:center;gap:.4rem;
  width:100%;padding:.38rem .7rem;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.15);
  border-radius:6px;color:rgba(255,255,255,.75);
  font-size:.78rem;font-weight:600;cursor:pointer;
  transition:background .13s;
  white-space:nowrap;overflow:hidden;
}
.sb-logout-btn:hover{background:rgba(255,255,255,.18);color:#fff}
.sb-logout-btn i{font-size:.8rem;flex-shrink:0}
/* ── DESKTOP COLLAPSED ── */
@media(min-width:901px){
  .sidebar.collapsed{width:var(--sidebar-w-collapsed)}
  .sidebar.collapsed~.main{margin-left:var(--sidebar-w-collapsed);max-width:calc(100vw - var(--sidebar-w-collapsed))}
  .sidebar.collapsed .sb-brand{padding:.85rem .65rem;justify-content:center;gap:0}
  .sidebar.collapsed .sb-brand-text{display:none}
  .sidebar.collapsed .sb-toggle{margin-left:0}
  .sidebar.collapsed .sb-link{padding:.5rem;justify-content:center;margin:2px 6px}
  .sidebar.collapsed .sb-link .sb-lbl,
  .sidebar.collapsed .sb-link .sb-badge{display:none}
  .sidebar.collapsed .sb-link>i:first-child{width:auto;font-size:1rem}
  .sidebar.collapsed .sb-group-hd{padding:.5rem;justify-content:center;margin:2px 6px;width:calc(100% - 12px)}
  .sidebar.collapsed .sb-group-hd .sb-lbl,
  .sidebar.collapsed .sb-group-hd .sb-arrow,
  .sidebar.collapsed .sb-group-hd .sb-badge{display:none}
  .sidebar.collapsed .sb-group-hd>i:first-child{width:auto;font-size:1rem}
  .sidebar.collapsed .sb-sub{display:none!important}
  .sidebar.collapsed .sb-footer{padding:.6rem .5rem;text-align:center}
  .sidebar.collapsed .sb-user-info{display:none}
  .sidebar.collapsed .sb-logout-btn{justify-content:center;padding:.38rem}
  .sidebar.collapsed .sb-logout-btn .sb-lbl{display:none}
  .sidebar.collapsed .sb-link,
  .sidebar.collapsed .sb-group-hd{position:relative}
  .sidebar.collapsed .sb-link::after,
  .sidebar.collapsed .sb-group-hd::after{
    content:attr(title);
    position:absolute;left:calc(100% + 10px);top:50%;transform:translateY(-50%);
    background:#111827;color:#fff;
    padding:.3rem .65rem;border-radius:6px;
    font-size:.74rem;font-weight:500;white-space:nowrap;
    opacity:0;pointer-events:none;transition:opacity .15s;z-index:700;
    box-shadow:0 4px 14px rgba(0,0,0,.3);
  }
  .sidebar.collapsed .sb-link::before,
  .sidebar.collapsed .sb-group-hd::before{
    content:'';position:absolute;left:calc(100% + 4px);top:50%;transform:translateY(-50%);
    border:5px solid transparent;border-right-color:#111827;
    opacity:0;pointer-events:none;transition:opacity .15s;z-index:700;
  }
  .sidebar.collapsed .sb-link:hover::after,
  .sidebar.collapsed .sb-link:hover::before,
  .sidebar.collapsed .sb-group-hd:hover::after,
  .sidebar.collapsed .sb-group-hd:hover::before{opacity:1}
}

/* ── TOPBAR ── */
.topbar{
  background:rgba(255,255,255,.88);border-bottom:1px solid rgba(16,24,40,.08);
  height:var(--topbar-h);display:flex;align-items:center;
  justify-content:space-between;padding:0 1.2rem;
  position:sticky;top:0;z-index:300;
  box-shadow:var(--topbar-shadow);flex-shrink:0;
  backdrop-filter:blur(12px);
}
.topbar-l{display:flex;align-items:center;gap:.85rem}
..topbar-r{display:flex;align-items:center;gap:.55rem}
.hamburger{
  display:flex;background:rgba(14,116,144,.08);border:none;
  font-size:1.15rem;color:var(--blue);cursor:pointer;
  padding:.45rem;border-radius:10px;line-height:1;
}
.hamburger:hover{background:rgba(14,116,144,.12)}

/* ── BREADCRUMB ── */
.bc{display:flex;align-items:center;gap:.3rem;list-style:none;
  margin:0;padding:0;font-size:.76rem}
.bc li+li::before{content:"›";color:var(--breadcrumb-sep);margin-right:.3rem}
.bc a{color:var(--blue)}
.bc .active{color:var(--muted)}

/* ── PAGE ── */
.page-body{padding:1.4rem 1.5rem 1.65rem;flex:1;min-width:0;overflow-x:hidden;width:min(100%,1440px);margin:0 auto;transition:padding .3s ease}
.page-body>*{min-width:0;max-width:100%}
.page-hdr,.page-header{display:flex;align-items:center;justify-content:space-between;
  margin-bottom:1.4rem;flex-wrap:wrap;gap:.85rem;padding:1.05rem 1.2rem;background:rgba(255,255,255,.88);backdrop-filter:blur(12px);border:1px solid rgba(16,24,40,.08);border-radius:22px;box-shadow:0 20px 52px rgba(14,116,144,.08)}
.page-title{font-size:1.28rem;font-weight:800;color:var(--blue);margin:0;display:flex;align-items:center;gap:.5rem}
.page-title i{color:var(--gold);margin-right:0}

/* ── CARDS ── */
.card,.card-box{background:var(--card);border-radius:var(--r);box-shadow:var(--shadow);
  border:1px solid rgba(16,24,40,.08);margin-bottom:1rem;display:flex;flex-direction:column;min-width:0;max-width:100%;
  transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease,background .18s ease}
.card:hover{transform:translateY(-1px);box-shadow:0 16px 40px rgba(14,116,144,.12);border-color:rgba(16,24,40,.12)}
.card-hd,.card-head,.card-box-header{padding:.85rem 1rem;border-bottom:1px solid var(--line-soft);
  font-weight:700;color:var(--blue);font-size:.88rem;
  display:flex;align-items:center;justify-content:space-between;
  gap:.5rem;flex-wrap:wrap}
.card-hd i,.card-head i,.card-box-header i{color:var(--gold)}
.card-bd,.card-body,.card-box-body{padding:1.05rem 1rem;min-width:0}
.card-bd.p0,.card-body.p0,.card-box-body.p0,.p-0{padding:0!important}

/* ── KPI ── */
.kpi,.kpi-card{background:var(--card);border-radius:var(--r);padding:.85rem .95rem;
  border-left:4px solid var(--blue);box-shadow:var(--shadow);height:100%}
.kpi.gold,.kpi-card.gold{background:rgba(245,158,11,0.08);border-left-color:var(--gold)}
.kpi.green,.kpi-card.green{background:rgba(5,150,105,0.08);border-left-color:var(--green)}
.kpi.red,.kpi-card.red{background:rgba(220,38,38,0.08);border-left-color:var(--red)}
.kpi.purple,.kpi-card.purple{background:rgba(139,92,246,0.08);border-left-color:var(--purple)}
.kpi-card.positive{background:rgba(16,185,129,.08);border-left-color:var(--green)}
.kpi-card.neutral{background:rgba(148,163,184,.08);border-left-color:rgba(148,163,184,.6)}
.kpi-card.negative{background:rgba(239,68,68,.08);border-left-color:var(--red)}
a.kpi:hover,a.kpi-card:hover{transform:translateY(-2px);box-shadow:0 6px 20px rgba(14,116,144,.15)}
.kpi-lbl,.kpi-label{font-size:.67rem;color:var(--muted);text-transform:uppercase;
  letter-spacing:.8px;font-weight:700;margin-bottom:.25rem}
.kpi-val,.kpi-value{font-size:1.35rem;font-weight:800;color:var(--blue);line-height:1.1}
.kpi.gold .kpi-val,.kpi.gold .kpi-value,.kpi-card.gold .kpi-val,.kpi-card.gold .kpi-value{color:var(--gold)}
.kpi.green .kpi-val,.kpi.green .kpi-value,.kpi-card.green .kpi-val,.kpi-card.green .kpi-value{color:var(--green)}
.kpi.red .kpi-val,.kpi.red .kpi-value,.kpi-card.red .kpi-val,.kpi-card.red .kpi-value{color:var(--red)}
.kpi.purple .kpi-val,.kpi.purple .kpi-value,.kpi-card.purple .kpi-val,.kpi-card.purple .kpi-value{color:var(--purple)}
.kpi-sub{font-size:.7rem;color:var(--muted);margin-top:.15rem}

/* ── BADGES ── */
.badge{display:inline-flex;align-items:center;padding:.2rem .6rem;
  border-radius:20px;font-size:.68rem;font-weight:700;letter-spacing:.2px;white-space:nowrap}
.badge-active,.badge-completed,.badge-paid,.badge-handled_paid,.badge-approved,.badge-filed{background:#d4edda;color:#155724}
.badge-dormant,.badge-draft,.badge-cancelled,.badge-not_handled,.badge-archived{background:#e9ecef;color:#495057}
.badge-suspended,.badge-overdue,.badge-needs_reset,.badge-rejected,.badge-failed,.badge-penalty_issued{background:#f8d7da;color:#721c24}
.badge-open,.badge-sent,.badge-upcoming,.badge-active_cred{background:#d0e8ff;color:#004085}
.badge-in_progress,.badge-partially_paid,.badge-handled_not_paid,.badge-submitted,.badge-pending,.badge-queued{background:#fff3cd;color:#856404}
.badge-pending_payment,.badge-proforma{background:#e8d9f5;color:#4a235a}
.badge-quotation{background:#d0f0e8;color:#0d5e3f}
.badge-blacklisted{background:#2d2d2d;color:#fff}
.badge-normal{background:#e9ecef;color:#495057}
.badge-urgent{background:#f8d7da;color:#721c24}
.badge-status{display:inline-flex;align-items:center;padding:.2rem .6rem;
  border-radius:20px;font-size:.68rem;font-weight:700;letter-spacing:.2px;white-space:nowrap}

/* ── TABLE ── */
.tbl,.table,.table-taxman{width:100%;border-collapse:collapse;font-size:.82rem}
.tbl th,.table th,.table-taxman th{background:var(--table-head-bg);color:var(--table-head-text);font-weight:700;font-size:.7rem;
  text-transform:uppercase;letter-spacing:.5px;
  padding:.6rem .85rem;border-bottom:2px solid var(--border);
  white-space:nowrap;text-align:left}
.tbl td,.table td,.table-taxman td{padding:.55rem .85rem;border-bottom:1px solid var(--line-subtle);vertical-align:middle}
.tbl tbody tr:hover,.table tbody tr:hover,.table-taxman tbody tr:hover{background:var(--surface-hover)}
.tbl tbody tr:last-child td,.table tbody tr:last-child td,.table-taxman tbody tr:last-child td{border-bottom:none}
.tbl-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

/* ── FORM ELEMENTS ── */
.form-label{font-weight:700;font-size:.85rem;color:var(--text);margin-bottom:.35rem;display:block}
.form-label .req{color:var(--red)}
.form-hint{font-size:.73rem;color:var(--muted);margin-top:.25rem}
.form-ctrl,.form-control,.form-select{width:100%;border:1.5px solid rgba(16,24,40,.12);border-radius:12px;
  padding:.6rem .9rem;font-size:.92rem;color:var(--text);
  background:rgba(255,255,255,.98);transition:border-color .2s,box-shadow .2s,transform .2s;line-height:1.5}
.form-ctrl:hover,.form-control:hover,.form-select:hover{border-color:rgba(16,24,40,.18)}
.form-ctrl:focus,.form-control:focus,.form-select:focus{border-color:var(--blue);
  box-shadow:0 0 0 4px rgba(14,116,144,.12);outline:none}
.form-ctrl::placeholder,.form-control::placeholder,.form-select::placeholder{font-size:.8rem;color:var(--muted)}
.form-ctrl.err,.form-control.is-invalid,.form-select.is-invalid,.is-invalid{border-color:var(--red);box-shadow:0 0 0 4px rgba(220,38,38,.12)}
.err-msg{color:var(--red);font-size:.76rem;margin-top:.35rem;display:block}
textarea.form-ctrl,textarea.form-control,textarea.form-select{resize:vertical;min-height:120px}
select.form-ctrl,select.form-control,select.form-select{
  appearance:none;
  padding-right:2.5rem;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 8'%3E%3Cpath fill='none' stroke='%23607085' stroke-linecap='round' stroke-linejoin='round' stroke-width='1.5' d='M1 1.25 6 6.25l5-5'/%3E%3C/svg%3E");
  background-position:right 1rem center;
  background-repeat:no-repeat;
  background-size:.75rem;
}
/* Select2: fully collapse the original hidden select */
.select2-hidden-accessible{
  display:none!important;
}
.form-select-sm{font-size:.78rem;padding:.35rem .65rem}
input[type=file].form-control{padding:.38rem .65rem}

/* ── SELECT2 ── */
.select2-container{width:100%!important}
.select2-container--bootstrap-5 .select2-selection{
  border:1.5px solid var(--input-border)!important;border-radius:7px!important;
  background:var(--input-bg)!important;color:var(--text)!important;
  min-height:36px!important;font-size:.86rem!important}
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__rendered{
  line-height:34px!important;padding-left:.75rem!important;color:var(--text)!important}
.select2-container--bootstrap-5 .select2-selection--single .select2-selection__arrow{
  height:34px!important;right:.45rem!important}
.select2-container--bootstrap-5.select2-container--focus .select2-selection{
  border-color:var(--blue)!important;
  box-shadow:0 0 0 3px rgba(26,60,110,.1)!important}
.select2-dropdown{border:1.5px solid var(--input-border)!important;border-radius:8px!important;
  background:var(--surface)!important;color:var(--text)!important;
  box-shadow:0 6px 24px rgba(0,0,0,.13)!important;z-index:9999!important;
  max-width:min(32rem,calc(100vw - 1.5rem));overflow:hidden}
.select2-results__option--highlighted{background:var(--blue)!important}
.select2-results__options{
  max-height:min(18rem,50vh)!important;overflow-y:auto!important;overscroll-behavior:contain}
.select2-search__field{border:1.5px solid var(--input-border)!important;
  background:var(--input-bg)!important;color:var(--text)!important;
  border-radius:6px!important;padding:.32rem .6rem!important;
  font-size:.84rem!important;width:100%!important}
.select2-results__option{font-size:.83rem;padding:.38rem .7rem;white-space:normal;word-break:break-word;color:var(--text)}
.s2-add-opt{color:var(--blue);font-weight:700;
  border-top:1px solid var(--border);font-size:.82rem}

/* ── BUTTONS ── */
.btn{display:inline-flex;align-items:center;gap:.45rem;
  padding:.55rem 1rem;border-radius:999px;font-size:.88rem;
  font-weight:700;cursor:pointer;border:1.5px solid transparent;
  transition:transform .18s ease,box-shadow .18s ease,background .18s ease,color .18s ease;
  white-space:nowrap;line-height:1.3;text-decoration:none}
.btn i{font-size:.88rem}
.btn:hover{transform:translateY(-1px);box-shadow:0 12px 34px rgba(14,116,144,.12)}
.btn-primary{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-primary:hover{background:var(--blue-dk);color:#fff}
.btn-gold{background:var(--gold);color:#fff;border-color:var(--gold)}
.btn-gold:hover{background:#d78b11;color:#fff}
.btn-success{background:var(--green);color:#fff;border-color:var(--green)}
.btn-success:hover{background:#0f766e;color:#fff}
.btn-danger{background:var(--red);color:#fff;border-color:var(--red)}
.btn-danger:hover{background:#b91c1c;color:#fff}
.btn-outline{background:var(--surface);color:var(--text);border-color:rgba(16,24,40,.12)}
.btn-outline:hover{background:var(--surface-2);color:var(--text)}
.btn-outline-primary{background:var(--surface);color:var(--blue);border-color:var(--blue)}
.btn-outline-primary:hover{background:var(--blue);color:#fff}
.btn-brand{background:var(--blue);color:#fff;border-color:var(--blue)}
.btn-brand:hover{background:var(--blue-dk);color:#fff}
.btn-outline-secondary{background:var(--surface);color:var(--muted);border-color:rgba(16,24,40,.12)}
.btn-outline-secondary:hover{background:var(--surface-2);color:var(--text)}
.btn-sm{padding:.35rem .75rem;font-size:.78rem}
.btn-lg{padding:.75rem 1.35rem;font-size:.95rem}
.btn-icon{padding:.5rem;width:38px;height:38px;justify-content:center}
.w-100{width:100%}

/* ── ALERTS ── */
.alert{padding:.7rem 1rem;border-radius:8px;border-left:4px solid;
  margin-bottom:.8rem;font-size:.84rem;display:flex;align-items:flex-start;gap:.5rem}
.alert i{flex-shrink:0;margin-top:.1rem}
.alert-success{background:var(--alert-success-bg);border-color:var(--alert-success-border,var(--green));color:var(--alert-success-text)}
.alert-danger,.alert-error{background:var(--alert-danger-bg);border-color:var(--alert-danger-border,var(--red));color:var(--alert-danger-text)}
.alert-warning{background:var(--alert-warning-bg);border-color:var(--alert-warning-border,var(--orange));color:var(--alert-warning-text)}
.alert-info{background:var(--alert-info-bg);border-color:var(--alert-info-border,#3498db);color:var(--alert-info-text)}
.alert-note{background:var(--note-bg);border-left:4px solid var(--note-border,var(--gold));
  padding:.65rem 1rem;border-radius:0 7px 7px 0;font-size:.82rem;color:var(--note-text)}

/* ── KANBAN ── */
.kanban,.kanban-board{display:grid;grid-template-columns:repeat(5,minmax(220px,1fr));gap:.8rem;overflow-x:auto;padding-bottom:.5rem;align-items:start}
.kanban-col{background:var(--kanban-col-bg);border-radius:8px;padding:.75rem;min-width:220px}
.kanban-hd,.kanban-col-header{font-size:.68rem;font-weight:800;text-transform:uppercase;
  letter-spacing:.5px;margin-bottom:.65rem;padding:.32rem .65rem;
  border-radius:5px;display:flex;justify-content:space-between;align-items:center}
.kanban-card{background:var(--card);border-radius:7px;padding:.7rem;
  margin-bottom:.5rem;border-left:3px solid var(--blue);
  box-shadow:0 1px 5px rgba(0,0,0,.07);font-size:.79rem;
  cursor:pointer;transition:box-shadow .16s;display:block;color:inherit}
.kanban-card:hover{box-shadow:0 4px 14px rgba(0,0,0,.12);color:inherit}
.kanban-card.urgent{border-left-color:var(--red)}
.kc-num,.kc-title{font-weight:800;color:var(--blue);font-size:.8rem}
.kc-cli,.kc-client{color:var(--muted);font-size:.75rem;margin-top:.1rem}
.kc-per{color:var(--muted);font-size:.71rem}
.kc-foot{display:flex;justify-content:space-between;align-items:center;margin-top:.4rem}

/* ── STAT ROW ── */
.stat-row{display:flex;justify-content:space-between;align-items:center;
  padding:.42rem 0;border-bottom:1px solid var(--line-subtle);font-size:.84rem}
.stat-row:last-child{border-bottom:none}

/* ── UGX ── */
.ugx{font-family:'Courier New',monospace;font-weight:700}
.ugx-r,.ugx-red{color:var(--red)}.ugx-g,.ugx-green{color:var(--green)}

/* ── MODAL ── */
.modal-overlay{display:none;position:fixed;inset:0;background:rgba(8,24,46,.72);
  backdrop-filter:blur(12px);z-index:9000;align-items:center;justify-content:center;padding:1.2rem;
  transition:opacity .25s ease,visibility .25s ease;opacity:0;visibility:hidden}
.modal-overlay.open{display:flex;opacity:1;visibility:visible}
.modal-box{background:var(--modal-bg);border-radius:22px;padding:1.6rem;
  width:100%;max-width:620px;box-shadow:0 32px 86px rgba(0,0,0,.24);
  max-height:92vh;overflow-y:auto;transform:translateY(-20px);opacity:0;
  transition:transform .28s ease,opacity .28s ease,box-shadow .28s ease}
.modal-overlay.open .modal-box{transform:translateY(0);opacity:1}
.modal-hd{display:flex;justify-content:space-between;align-items:flex-start;
  gap:1rem;margin-bottom:1.1rem;padding-bottom:.85rem;border-bottom:1px solid rgba(14,116,144,.12)}
.modal-hd h5{margin:0;font-weight:800;color:var(--blue);font-size:1.1rem;line-height:1.25}
.modal-close{background:none;border:none;font-size:1.5rem;cursor:pointer;color:var(--muted);padding:.3rem;line-height:1;border-radius:8px;transition:background .2s,color .2s}
.modal-close:hover{background:var(--surface-2);color:var(--blue)}

/* ── MISC ── */
.fillable-gap{background:#fff9c4;border:1.5px dashed #f0ad4e;
  padding:2px 8px;border-radius:4px;font-style:italic;color:#856404;display:inline-block}
.copy-btn{background:none;border:1px solid var(--copy-btn-border);border-radius:5px;
  padding:2px 8px;font-size:.72rem;cursor:pointer;color:var(--blue);
  transition:all .14s;margin-left:.4rem}
.copy-btn:hover{background:var(--blue);color:#fff;border-color:var(--blue)}
.inline-form{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap}
.divider{border:none;border-top:1px solid var(--divider);margin:1rem 0}
.tag{display:inline-flex;align-items:center;gap:.25rem;
  padding:.15rem .5rem;border-radius:4px;font-size:.72rem;font-weight:600}
.empty-state{text-align:center;padding:2.5rem 1rem;color:var(--muted)}
.empty-state i{font-size:2.2rem;display:block;margin-bottom:.7rem;color:var(--empty-icon)}
.quick-bar{display:flex;gap:.5rem;flex-wrap:wrap}
.stack{display:grid;gap:.85rem}
.stats-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.85rem;align-items:stretch}
.cards-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem;align-items:start}
.cards-grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem;align-items:start}
.layout-main-sidebar{display:grid;grid-template-columns:minmax(0,1.7fr) minmax(280px,.95fr);gap:.85rem;align-items:start}
.layout-sidebar-main{display:grid;grid-template-columns:minmax(280px,.95fr) minmax(0,1.7fr);gap:.85rem;align-items:start}
.form-shell{width:min(100%,860px);margin:0 auto}
.form-shell-wide{width:min(100%,1120px);margin:0 auto}
.form-stack{display:grid;gap:.85rem}
.form-grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.85rem}
.field-span-2{grid-column:1 / -1}
.form-actions{display:flex;gap:.5rem;flex-wrap:wrap}
.form-panel{min-width:0}
.card-compact .card-head,.card-compact .card-box-header,.card-compact .card-hd{padding:.6rem .85rem}
.card-compact .card-body,.card-compact .card-box-body,.card-compact .card-bd{padding:.8rem .85rem}
.theme-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.theme-card{display:flex;align-items:flex-start;gap:.75rem;padding:.8rem;border:1.5px solid var(--border);
  border-radius:10px;background:var(--card);cursor:pointer;transition:border-color .16s,transform .16s,box-shadow .16s}
.theme-card:hover{border-color:var(--blue);transform:translateY(-1px);box-shadow:var(--shadow)}
.theme-card.selected{border-color:var(--blue);box-shadow:0 0 0 3px rgba(26,60,110,.08)}
.theme-card input{margin-top:.2rem}
.theme-copy{display:grid;gap:.18rem}
.theme-copy strong{font-size:.84rem;color:var(--text)}
.theme-copy small{font-size:.73rem;color:var(--muted);line-height:1.45}
.theme-swatch{width:64px;height:48px;border-radius:10px;display:grid;grid-template-columns:14px 1fr;gap:6px;padding:6px;
  border:1px solid rgba(0,0,0,.06);flex-shrink:0}
.theme-swatch span{display:block;border-radius:6px}
.theme-swatch span:nth-child(1){grid-row:1 / span 2}
.theme-swatch span:nth-child(2){height:14px}
.theme-swatch span:nth-child(3){height:18px}
.theme-swatch-classic{background:#f0f2f6}
.theme-swatch-classic span:nth-child(1){background:#1A3C6E}
.theme-swatch-classic span:nth-child(2){background:#C8952A}
.theme-swatch-classic span:nth-child(3){background:#ffffff}
.theme-swatch-forest{background:#eef3ef}
.theme-swatch-forest span:nth-child(1){background:#214d3a}
.theme-swatch-forest span:nth-child(2){background:#b88746}
.theme-swatch-forest span:nth-child(3){background:#ffffff}
.theme-swatch-sunset{background:#f7f0eb}
.theme-swatch-sunset span:nth-child(1){background:#7a3b2e}
.theme-swatch-sunset span:nth-child(2){background:#d68a3d}
.theme-swatch-sunset span:nth-child(3){background:#fffdfb}
.theme-swatch-midnight{background:#edf1f6}
.theme-swatch-midnight span:nth-child(1){background:#2f4f76}
.theme-swatch-midnight span:nth-child(2){background:#9cb7d7}
.theme-swatch-midnight span:nth-child(3){background:#fbfcfe}
.theme-swatch-dark{background:#0f1722}
.theme-swatch-dark span:nth-child(1){background:#7ea9e6}
.theme-swatch-dark span:nth-child(2){background:#f0b85a}
.theme-swatch-dark span:nth-child(3){background:#151f2d}
.theme-swatch-ocean{background:#ecfeff}
.theme-swatch-ocean span:nth-child(1){background:#0e7490}
.theme-swatch-ocean span:nth-child(2){background:#f59e0b}
.theme-swatch-ocean span:nth-child(3){background:#ffffff}
.theme-swatch-rose{background:#fff1f2}
.theme-swatch-rose span:nth-child(1){background:#be185d}
.theme-swatch-rose span:nth-child(2){background:#d97706}
.theme-swatch-rose span:nth-child(3){background:#ffffff}
.theme-swatch-charcoal{background:#111827}
.theme-swatch-charcoal span:nth-child(1){background:#374151}
.theme-swatch-charcoal span:nth-child(2){background:#f59e0b}
.theme-swatch-charcoal span:nth-child(3){background:#1f2937}
.theme-swatch-violet{background:#f5f3ff}
.theme-swatch-violet span:nth-child(1){background:#6d28d9}
.theme-swatch-violet span:nth-child(2){background:#f59e0b}
.theme-swatch-violet span:nth-child(3){background:#ffffff}
.theme-swatch-earth{background:#fdf8f0}
.theme-swatch-earth span:nth-child(1){background:#78350f}
.theme-swatch-earth span:nth-child(2){background:#b45309}
.theme-swatch-earth span:nth-child(3){background:#fffdf7}
.theme-swatch-system{background:linear-gradient(135deg,#f0f2f6 50%,#0f1722 50%)}
.theme-swatch-system span:nth-child(1){background:linear-gradient(135deg,#1A3C6E 50%,#7ea9e6 50%)}
.theme-swatch-system span:nth-child(2){background:#C8952A}
.theme-swatch-system span:nth-child(3){background:linear-gradient(135deg,#ffffff 50%,#151f2d 50%)}
/* Autocomplete suggestion */
.ac-box{position:absolute;top:100%;left:0;right:0;background:var(--autocomplete-bg);
  border:1.5px solid var(--border);border-radius:7px;
  box-shadow:var(--shadow);z-index:500;max-height:240px;overflow-y:auto;margin-top:2px}
.ac-item{padding:.45rem .8rem;font-size:.84rem;cursor:pointer;border-bottom:1px solid var(--line-subtle)}
.ac-item:hover{background:var(--autocomplete-hover)}
.ac-item:last-child{border-bottom:none}
/* Task reminder banner */
.reminder-bar{
  background:var(--reminder-bg);
  border-bottom:2px solid var(--gold);
  padding:.65rem 1.2rem;
  display:flex;
  align-items:center;
  gap:.7rem;
  font-size:.82rem;
  color:var(--reminder-text);
  flex-wrap:nowrap;
  min-height:48px;
  position:relative;
  z-index:100;
}
.reminder-bar i{color:var(--gold);font-size:1rem;flex-shrink:0}
.reminder-bar span{flex:1;min-width:0}
.reminder-bar a{color:var(--blue);font-weight:700;text-decoration:underline;white-space:nowrap}

/* ── GRID HELPERS ── */
.grid{display:grid;gap:1rem}
.g2{grid-template-columns:repeat(2,1fr)}
.g3{grid-template-columns:repeat(3,1fr)}
.g4{grid-template-columns:repeat(4,1fr)}
.row{--row-gap:.85rem;display:flex;flex-wrap:wrap;gap:var(--row-gap)}
.row>*{min-width:0}
.row>.col,.row>[class^="col-"],.row>[class*=" col-"]{flex:1 1 100%;max-width:100%}
.col{flex:1 1 0;min-width:0}
.col-3{flex:0 0 calc(25% - .75rem);max-width:calc(25% - .75rem)}
.col-4{flex:0 0 calc(33.333% - .667rem);max-width:calc(33.333% - .667rem)}
.col-5{flex:0 0 calc(41.666% - .584rem);max-width:calc(41.666% - .584rem)}
.col-6{flex:0 0 calc(50% - .5rem);max-width:calc(50% - .5rem)}
.col-7{flex:0 0 calc(58.333% - .417rem);max-width:calc(58.333% - .417rem)}
.col-8{flex:0 0 calc(66.666% - .334rem);max-width:calc(66.666% - .334rem)}
.flex,.d-flex{display:flex}.flex-wrap{flex-wrap:wrap}
.gap-1{gap:.25rem}.gap-2{gap:.5rem}.gap-3{gap:.75rem}
.g-2{gap:.5rem}.g-3{gap:.85rem}
.items-center,.align-items-center{align-items:center}
.justify-between,.justify-content-between{justify-content:space-between}
.justify-content-center{justify-content:center}
.ms-auto{margin-left:auto}
.mb-0{margin-bottom:0}.mb-1{margin-bottom:.25rem}.mb-2{margin-bottom:.5rem}
.mb-3{margin-bottom:.75rem}.mb-4{margin-bottom:1rem}
.mt-1{margin-top:.25rem}.mt-2{margin-top:.5rem}.mt-3{margin-top:.75rem}.mt-4{margin-top:1rem}
.p0{padding:0!important}.p1{padding:.4rem}.p2{padding:.8rem}.p3{padding:1.1rem}
.text-r{text-align:right}.text-c,.text-center{text-align:center}
.text-muted{color:var(--muted)!important}.text-danger{color:var(--red)!important}
.text-success{color:var(--green)!important}.text-blue{color:var(--blue)!important}
.text-gold{color:var(--gold)!important}
.fw-6,.fw-600{font-weight:600}.fw-7,.fw-bold{font-weight:700}.fw-8{font-weight:800}
.fs-sm{font-size:.78rem}.fs-xs{font-size:.7rem}
.me-1{margin-right:.25rem}.me-2{margin-right:.5rem}
.py-3{padding-top:1rem!important;padding-bottom:1rem!important}
.d-none{display:none!important}

/* ── RESPONSIVE ── */
@media(min-width:768px){
  .col-md-3{flex:0 0 calc(25% - .75rem);max-width:calc(25% - .75rem)}
  .col-md-4{flex:0 0 calc(33.333% - .667rem);max-width:calc(33.333% - .667rem)}
  .col-md-6{flex:0 0 calc(50% - .5rem);max-width:calc(50% - .5rem)}
  .col-md-8{flex:0 0 calc(66.666% - .334rem);max-width:calc(66.666% - .334rem)}
}
@media(min-width:992px){
  .col-lg-4{flex:0 0 calc(33.333% - .667rem);max-width:calc(33.333% - .667rem)}
  .col-lg-6{flex:0 0 calc(50% - .5rem);max-width:calc(50% - .5rem)}
  .col-lg-7{flex:0 0 calc(58.333% - .417rem);max-width:calc(58.333% - .417rem)}
  .col-lg-8{flex:0 0 calc(66.666% - .334rem);max-width:calc(66.666% - .334rem)}
}
@media(min-width:1200px){
  .col-xl-4{flex:0 0 calc(33.333% - .667rem);max-width:calc(33.333% - .667rem)}
  .col-xl-6{flex:0 0 calc(50% - .5rem);max-width:calc(50% - .5rem)}
  .col-xl-8{flex:0 0 calc(66.666% - .334rem);max-width:calc(66.666% - .334rem)}
}
@media(max-width:1200px){
  .stats-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .layout-main-sidebar,.layout-sidebar-main{grid-template-columns:1fr}
  .form-shell-wide{width:min(100%,920px)}
}
/* ── Collapsed sidebar (desktop) ── */
/* handled inside the SIDEBAR block above */

@media(max-width:900px){
  .sidebar{transform:translateX(-100%);transition:transform .26s cubic-bezier(.4,0,.2,1)}
  .sidebar.open{transform:translateX(0)}
  .overlay{display:none;position:fixed;inset:0;background:rgba(0,0,0,.45);z-index:399}
  .overlay.show{display:block}
  .hamburger{display:flex}
  .main{margin-left:0;max-width:100%}
  .kanban,.kanban-board{grid-template-columns:repeat(2,1fr)}
  .g4{grid-template-columns:repeat(2,1fr)}
  .g3{grid-template-columns:repeat(2,1fr)}
  .col-4,.col-5,.col-6,.col-7,.col-8,.col-3,
  .col-md-3,.col-md-4,.col-md-6,.col-md-8,
  .col-lg-4,.col-lg-6,.col-lg-7,.col-lg-8,
  .col-xl-4,.col-xl-6,.col-xl-8{flex:0 0 100%;max-width:100%}
}
@media(max-width:600px){
  .theme-grid{grid-template-columns:1fr}
  .stats-grid,.cards-grid-2,.cards-grid-3{grid-template-columns:1fr}
  .kanban,.kanban-board{grid-template-columns:1fr}
  .g2,.g3,.g4,.form-grid-2{grid-template-columns:1fr}
  .page-body{padding:.85rem}
  .topbar{padding:0 .85rem}
  .page-title{font-size:1rem}
  .kpi-val,.kpi-value{font-size:1.15rem}
  .d-xs-none{display:none!important}
  .reminder-bar{padding:.55rem .85rem;font-size:.78rem;gap:.5rem;flex-wrap:wrap}
  .reminder-bar span{font-size:.78rem;flex:1 1 100%}
  .page-header,.page-hdr{flex-direction:column;align-items:flex-start}
  .topbar-r{gap:.35rem}
  .btn-sm{padding:.22rem .5rem;font-size:.72rem}
}

/* ── PRINT ── */
@media print{
  .sidebar,.topbar,.no-print,.btn,.alert,.reminder-bar{display:none!important}
  .main{margin-left:0!important}
  .card,.card-box{box-shadow:none!important;border:1px solid #ddd!important}
  body{background:#fff}.page-body{padding:0}
}

/* ── DOC TYPE BUTTON SELECTOR ── */
.doc-type-btns{display:flex;gap:.6rem;flex-wrap:wrap}
.doc-type-btn{
  display:inline-flex;align-items:center;gap:.45rem;
  padding:.5rem 1.1rem;border-radius:8px;
  border:2px solid var(--border);background:var(--surface);
  color:var(--text);font-size:.84rem;font-weight:600;cursor:pointer;
  transition:border-color .15s,background .15s,color .15s;
}
.doc-type-btn i:last-child{font-size:.65rem;opacity:.55;margin-left:.1rem}
.doc-type-btn:hover{border-color:var(--blue);color:var(--blue);background:var(--surface-hover)}
.doc-type-btn.selected{border-color:var(--blue);background:var(--blue);color:#fff}
.doc-type-btn.selected i:last-child{opacity:.8}

/* ── KEYBOARD SHORTCUTS ── */
#kb-sheet{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.5);
  z-index:9000;align-items:center;justify-content:center;
}
#kb-sheet.open{display:flex;}
#kb-inner{
  background:var(--card);border-radius:12px;padding:1.4rem 1.6rem;
  width:100%;max-width:420px;box-shadow:0 24px 64px rgba(0,0,0,.3);
  max-height:90vh;overflow-y:auto;
}
.kb-grid{display:grid;gap:.35rem;}
.kb-row{display:flex;align-items:center;gap:.75rem;font-size:.82rem;padding:.25rem 0;border-bottom:1px solid var(--line-subtle);}
.kb-row:last-child{border-bottom:none;}
.kb-row span{color:var(--muted);}
kbd{
  display:inline-flex;align-items:center;justify-content:center;
  background:var(--surface-2);border:1.5px solid var(--border);
  border-bottom-width:3px;border-radius:5px;
  padding:.15rem .45rem;font-size:.72rem;font-family:'Courier New',monospace;
  font-weight:700;color:var(--text);white-space:nowrap;min-width:2rem;
  flex-shrink:0;
}
/* Shortcut hint in topbar */
.kb-hint{
  font-size:.68rem;color:var(--muted);
  display:flex;align-items:center;gap:.3rem;cursor:pointer;
  padding:.2rem .5rem;border-radius:5px;transition:background .13s;
}
.kb-hint:hover{background:var(--surface-2);}