/* Lighthouse Back Office — Modern, Segoe UI, navy/gold financial style */
:root {
  --navy: #16233b;
  --navy-2: #1e2f4f;
  --gold: #c9a227;
  --gold-soft: #f4ecd4;
  --bg: #f5f6f8;
  --card: #ffffff;
  --text: #1c2530;
  --muted: #6b7686;
  --line: #e3e7ee;
  --green: #1e7d46;
  --red: #b23a3a;
  --amber: #b07d10;
  --bg-soft: #f6f8fa;   /* subtle inset panels (guide boxes, sign-off blocks) */
  --panel: #f6f7f9;
  --mut: #6b7686;
}
/* dark theme */
html[data-theme="dark"] {
  --navy: #0f1830; --navy-2: #8fb2ff; --gold: #d8b53f; --gold-soft: #2a2410;
  --bg: #0c1220; --card: #151d2e; --text: #e6ebf3; --muted: #94a1b6; --line: #263145;
  --green: #57c98a; --red: #e2736e; --amber: #d8b53f;
}
html[data-theme="dark"] body { background: var(--bg); }
html[data-theme="dark"] th { background: #1a2334; }
html[data-theme="dark"] .card table tr:hover td,
html[data-theme="dark"] .kpi:hover { background: #1a2334; }
html[data-theme="dark"] input, html[data-theme="dark"] select, html[data-theme="dark"] textarea {
  background: #101827; color: var(--text); border-color: #2b374d; }
html[data-theme="dark"] tr.total td { background: #2a2410; }
/* dark mode: --navy is a SURFACE colour here, so text roles that borrow it must use light ink.
   (Fixes unreadable headings/values/ghost buttons in dark, Aurora and Beacon.) */
html[data-theme="dark"] h1, html[data-theme="dark"] h2 { color: var(--text); }
html[data-theme="dark"] .kpi .value { color: var(--text); }
html[data-theme="dark"] .btn.ghost { color: var(--text); border-color: var(--line); }
html[data-theme="dark"] .btn.ghost:hover { background: var(--card); color: var(--text); }
html[data-theme="dark"] .tab:hover { color: var(--text); }
html[data-theme="dark"] { --bg-soft:#1a2334; --panel:#151d2e; --mut:#94a1b6; }
html[data-theme="dark"] table tr:hover td { background: #1f2a3f; }
html[data-theme="dark"] table.reg tbody tr:hover td { background: #1f2a3f; }
html[data-theme="dark"] .tab { background: #1a2334; }
html[data-theme="dark"] .badge.conditional, html[data-theme="dark"] .badge.unmatched { background:#3a2f10; color:#e9c25c; }
html[data-theme="dark"] .badge.firm { background:#152a4a; color:#8fb2ff; }
html[data-theme="dark"] .badge.cancelled { background:#3a1720; color:#ff9d97; }
html[data-theme="dark"] .badge.excluded { background:#242c3a; color:#94a1b6; }
html[data-theme="dark"] .error-box { background:#3a1720; color:#ff9d97; }
html[data-theme="dark"] .ok-box { background:#123020; color:#57c98a; }
html[data-theme="dark"] .rpt-badge.red { background:#3a1720; color:#ff9d97; }
/* financial statements stay as white "paper" sheets in dark mode — print-first documents
   whose inks are deliberately hardcoded dark */
html[data-theme="dark"] .statement { background: #fff; }
html[data-theme="dark"] .statement tr:hover td { background: #f6f8fb; }
html[data-theme="dark"] .statement th, html[data-theme="dark"] .statement tr.colhead th { background: none; color: #5a6472; }
html[data-theme="dark"] .statement tr.total td, html[data-theme="dark"] .statement tr.grand td { background: #f4ecd4; color: #17233a; }
html[data-theme="dark"] .statement td { color: #23272e; }
html[data-theme="dark"] .statement table { background: transparent; }
* { box-sizing: border-box; }
body {
  margin: 0; font-family: "Segoe UI", -apple-system, "Helvetica Neue", Arial, sans-serif;
  background: var(--bg); color: var(--text); font-size: 14.5px;
}

/* ================= LAYOUTS (structure only) — html[data-layout] =================
   modern · compact · executive · topnav · rail · rightbar
   Colours come from PALETTES below, so layout + palette are independent. */

/* COMPACT — dense, data-packed. Narrow sidebar, tight tables/cards. */
html[data-layout="compact"] .sidebar { width: 190px; }
html[data-layout="compact"] .main { padding: 14px 20px; max-width: 1200px; }
html[data-layout="compact"] h1 { font-size: 18px; }
html[data-layout="compact"] h2 { font-size: 13px; margin: 12px 0 6px; }
html[data-layout="compact"] .card { padding: 9px 12px; margin-bottom: 11px; border-radius: 4px; }
html[data-layout="compact"] .kpi { padding: 7px 10px; }
html[data-layout="compact"] .kpi .value { font-size: 16px; }
html[data-layout="compact"] .kpis { gap: 8px; grid-template-columns: repeat(auto-fit, minmax(135px, 1fr)); }
html[data-layout="compact"] th { padding: 4px 8px; font-size: 10px; }
html[data-layout="compact"] td { padding: 3px 8px; font-size: 12px; }
html[data-layout="compact"] .nav a { padding: 7px 20px; font-size: 13px; }
html[data-layout="compact"] .topbar { padding: 5px 10px; }

/* EXECUTIVE — airy, oversized headings & KPIs, rounded cards, serif titles. */
html[data-layout="executive"] .main { max-width: 1160px; padding: 30px 40px; }
html[data-layout="executive"] h1 { font-size: 26px; font-family: Georgia, "Aptos Display", serif; }
html[data-layout="executive"] h2 { font-size: 16px; font-family: Georgia, "Aptos Display", serif; }
html[data-layout="executive"] .card { border-radius: 16px; padding: 22px 24px; }
html[data-layout="executive"] .kpis { gap: 18px; }
html[data-layout="executive"] .kpi { border-radius: 16px; padding: 20px 18px; }
html[data-layout="executive"] .kpi .value { font-size: 27px; }
html[data-layout="executive"] .kpi .label { font-size: 12px; letter-spacing: 1px; }

/* TOPNAV — navigation on a horizontal top bar; no left sidebar; full-width. */
html[data-layout="topnav"] .shell { flex-direction: column; }
html[data-layout="topnav"] .sidebar { width: 100%; height: auto; position: static; flex-direction: row; align-items: center; flex-wrap: wrap; padding: 0 8px; }
html[data-layout="topnav"] .brand { padding: 8px 14px 8px 6px; border: 0; }
html[data-layout="topnav"] .brand .sub { display: none; }
html[data-layout="topnav"] .nav { display: flex; flex-direction: row; flex-wrap: wrap; align-items: center; padding: 0; flex: 1; overflow: visible; }
html[data-layout="topnav"] .nav .sep, html[data-layout="topnav"] .nav .hint { display: none; }
html[data-layout="topnav"] .nav a { border-left: 0; border-radius: 8px 8px 0 0; padding: 12px; white-space: nowrap; }
html[data-layout="topnav"] .nav a.active { background: var(--gold); color: #fff; font-weight: 600; }
html[data-layout="topnav"] .nav a .ic { margin-right: 4px; }
html[data-layout="topnav"] .userbox { border: 0; padding: 8px 14px; white-space: nowrap; }
html[data-layout="topnav"] .main { border-top: 3px solid var(--gold); max-width: none; }

/* RAIL — slim icon-only left rail. */
html[data-layout="rail"] .sidebar { width: 62px; }
html[data-layout="rail"] .sidebar .lbl, html[data-layout="rail"] .nav .sep, html[data-layout="rail"] .nav .hint,
html[data-layout="rail"] .brand .sub, html[data-layout="rail"] .brand .logo-full, html[data-layout="rail"] .userbox .lbl { display: none; }
html[data-layout="rail"] .brand .logo-mini { display: inline; color: var(--gold); }
html[data-layout="rail"] .brand { padding: 16px 10px; text-align: center; }
html[data-layout="rail"] .nav a { text-align: center; padding: 12px 0; }
html[data-layout="rail"] .nav a .ic { margin: 0; width: auto; font-size: 17px; }
html[data-layout="rail"] .userbox { text-align: center; padding: 12px 4px; }

/* OPEN BOOK — the books open like a real ledger: spine tabs, paper pages, and on list screens
   a two-page master-detail split (row click loads the record into the right page — see foot.ejs). */
/* the desk: warm parchment behind the floating book (light theme only) */
html[data-layout="openbook"], html[data-layout="openbook"] body { background: var(--bg-soft); }
html[data-theme="dark"][data-layout="openbook"], html[data-theme="dark"][data-layout="openbook"] body { background: var(--bg); }
/* the desk sits a shade under the page so the book reads as paper on a surface */
html[data-layout="openbook"] .main { box-shadow: 0 14px 38px rgba(20, 30, 44, .14), 0 0 0 1px var(--line); }
/* slim icon spine; hover it and the full menu flies out over the page. The ☰ button pins the
   full classic menu instead (html.ob-nav-full) — every spine rule is scoped :not(.ob-nav-full). */
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar { width: 58px; transition: width .16s ease, margin-right .16s ease; }
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover, html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:focus-within {
  width: 232px; margin-right: -174px; z-index: 120; box-shadow: 14px 0 44px rgba(10, 18, 30, .38);
}
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .lbl, html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:focus-within .lbl,
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .userbox .lbl { display: inline; }
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .nav .sep, html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .nav .hint,
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .brand .sub { display: block; }
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .brand .logo-full { display: inline; }
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .brand .logo-mini { display: none; }
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .brand { text-align: left; padding: 12px 16px 10px; }
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .nav a { text-align: left; padding: 10px 14px; }
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .nav a .ic { margin-right: 8px; width: 20px; }
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar:hover .userbox { text-align: left; padding: 12px 16px; }
html[data-layout="openbook"]:not(.ob-nav-full) .sidebar .lbl, html[data-layout="openbook"]:not(.ob-nav-full) .nav .sep,
html[data-layout="openbook"]:not(.ob-nav-full) .nav .hint, html[data-layout="openbook"]:not(.ob-nav-full) .brand .sub,
html[data-layout="openbook"]:not(.ob-nav-full) .brand .logo-full, html[data-layout="openbook"]:not(.ob-nav-full) .userbox .lbl { display: none; }
html[data-layout="openbook"]:not(.ob-nav-full) .brand .logo-mini { display: inline; color: var(--gold); }
html[data-layout="openbook"]:not(.ob-nav-full) .brand { padding: 14px 8px; text-align: center; }
html[data-layout="openbook"]:not(.ob-nav-full) .nav a { text-align: center; padding: 11px 0; margin: 2px 0 2px 6px; border-left: 0; border-radius: 0 10px 10px 0; }
html[data-layout="openbook"]:not(.ob-nav-full) .nav a .ic { margin: 0; width: auto; font-size: 16px; }
html[data-layout="openbook"]:not(.ob-nav-full) .nav a.active { background: var(--gold); padding-right: 8px; }
html[data-layout="openbook"]:not(.ob-nav-full) .userbox { text-align: center; padding: 12px 4px; }
/* the book itself, centered on the desk */
html[data-layout="openbook"] .main {
  background: var(--card); max-width: 1640px; margin: 16px auto 26px; padding: 24px 30px;
  border: 1px solid var(--line); border-radius: 8px 18px 18px 8px;
  box-shadow: 0 18px 44px rgba(20, 30, 44, .18);
}
html[data-layout="openbook"] .topbar { max-width: 1640px; margin: 10px auto 0; border-radius: 12px; row-gap: 4px; }
html[data-layout="openbook"] .tb-search { flex: 0 1 300px; }
/* the left page keeps its own horizontal scroll instead of clipping columns */
html[data-layout="openbook"] .bk-left { overflow-x: auto; }
html[data-layout="openbook"] .bk-left table { font-size: 12.5px; }
html[data-layout="openbook"] .bk-left th, html[data-layout="openbook"] .bk-left td { padding: 6px 7px; }
html[data-layout="openbook"] .bk-left th { font-size: 10.5px; letter-spacing: .3px; }
html[data-layout="openbook"] .bk-left .page-head h1 { font-size: 21px; }
html[data-layout="openbook"] .bk-left .filters, html[data-layout="openbook"] .bk-left .tabs { gap: 5px; }
html[data-layout="openbook"] .bk-left .btn { font-size: 12.5px; padding: 6px 10px; }
/* the right page fills the visible book height */
html[data-layout="openbook"] .bk-right iframe { height: calc(100vh - 220px); min-height: 620px; }
/* an embedded record fits its page instead of scrolling sideways: tighter type, tighter
   spacing, and every wide control allowed to shrink. */
html.embed { font-size: 13.5px; }
html.embed .main { padding: 8px 12px !important; }
html.embed h1 { font-size: 19px; }
html.embed h2 { font-size: 14px; }
html.embed .card { padding: 10px 12px; margin-bottom: 9px; }
html.embed table { font-size: 12.5px; width: 100%; table-layout: auto; }
html.embed th, html.embed td { padding: 5px 6px; }
html.embed input, html.embed select, html.embed textarea { max-width: 100%; min-width: 0; font-size: 12.5px; padding: 5px 7px; }
html.embed .filters > div, html.embed .grid > div { min-width: 0 !important; }
html.embed .grid, html.embed .kpis { grid-template-columns: 1fr 1fr !important; gap: 8px !important; }
html.embed .btn { padding: 5px 10px; font-size: 12.5px; }
html.embed .tabbar { gap: 4px; }
html.embed .tab { padding: 4px 9px; font-size: 11.5px; }
html.embed .page-head { flex-wrap: wrap; gap: 6px; }
html.embed * { max-width: 100%; }

/* an embedded record renders on white paper, never on the desk colour */
html.embed, html.embed body { background: var(--card) !important; }
/* the two-page split (built by foot.ejs on list screens) */
html[data-layout="openbook"] .bk-split { display: grid; grid-template-columns: minmax(0, 1fr); position: relative; }
html[data-layout="openbook"] .bk-split::before {
  content: ""; position: absolute; left: 0; right: 0; top: auto; bottom: auto; height: 0; width: auto; transform: none;
  background: linear-gradient(90deg, transparent, rgba(30,40,55,.10) 46%, rgba(30,40,55,.20) 50%, rgba(30,40,55,.10) 54%, transparent);
  pointer-events: none;
}
html[data-layout="openbook"] .bk-left { padding-right: 0; min-width: 0; }
html[data-layout="openbook"] .bk-right { padding: 14px 0 0; margin-top: 12px; border-top: 2px solid var(--line); min-width: 0; display: flex; flex-direction: column; }
html[data-layout="openbook"] .bk-head { display: flex; justify-content: space-between; align-items: center; font-size: 11.5px; color: var(--muted); margin-bottom: 6px; }
html[data-layout="openbook"] .bk-right iframe { width: 100%; flex: 1; min-height: 520px; border: 0; background: transparent; }
html[data-layout="openbook"] tr.bk-sel td { background: var(--gold-soft) !important; }
html[data-layout="openbook"] tr.bk-sel td:first-child { box-shadow: inset 3px 0 0 var(--gold); }
@media (max-width: 1000px){ html[data-layout="openbook"] .bk-split { grid-template-columns: 1fr; } html[data-layout="openbook"] .bk-split::before { display:none; } html[data-layout="openbook"] .bk-right { padding-left: 0; border-top: 1px solid var(--line); margin-top: 14px; padding-top: 14px; } }
/* embed mode — a page rendered inside the right page of the book (chrome hidden) */
html.embed .sidebar, html.embed .topbar, html.embed .userbox { display: none !important; }
html.embed .main { padding: 6px 10px !important; margin: 0 !important; max-width: none !important; border: 0 !important; box-shadow: none !important; background: transparent !important; border-radius: 0 !important; }

/* RIGHTBAR — sidebar on the RIGHT side. */
html[data-layout="rightbar"] .shell { flex-direction: row-reverse; }
html[data-layout="rightbar"] .sidebar { border-left: 1px solid rgba(255,255,255,.06); }
html[data-layout="rightbar"] .nav a { border-left: 0; border-right: 3px solid transparent; }
html[data-layout="rightbar"] .nav a.active { border-left-color: transparent; border-right-color: var(--gold); }

/* ================= PALETTES (colour only) — html[data-palette], light mode only ================= */
html:not([data-theme="dark"])[data-palette="teal"] { --navy:#123b39; --gold:#0d9488; --gold-soft:#d5f0ec; --bg:#eef6f4; }
html:not([data-theme="dark"])[data-palette="amber"] { --navy:#2b3a4a; --gold:#e07a1f; --gold-soft:#fbe7d1; --bg:#eef1f4; }
html:not([data-theme="dark"])[data-palette="forest"] { --navy:#1e3a2f; --gold:#3f7d4f; --gold-soft:#dcecdd; --bg:#eef4ef; }
html:not([data-theme="dark"])[data-palette="burgundy"] { --navy:#3a1e28; --gold:#a8324a; --gold-soft:#f2dde2; --bg:#f5eef0; }
html:not([data-theme="dark"])[data-palette="indigo"] { --navy:#1b1f3b; --gold:#6d5cff; --gold-soft:#e7e3ff; --bg:#eef0fb; }
/* --- Theme Gallery palettes (1 = navy default) --- */
html:not([data-theme="dark"])[data-palette="fresh"]  { --navy:#123329; --navy-2:#1c4a3a; --gold:#0e9f7e; --gold-soft:#dcf1ea; --bg:#f4f8f6; }
html:not([data-theme="dark"])[data-palette="slate"]  { --navy:#273244; --navy-2:#33415a; --gold:#2f6feb; --gold-soft:#e5edfb; --bg:#eef1f6; }
html:not([data-theme="dark"])[data-palette="meadow"] { --navy:#264430; --navy-2:#315540; --gold:#2f6b3e; --gold-soft:#dfeada; --bg:#f6f4ea; }
/* Aurora — a dark, glassy identity; rides on dark mode with a cyan accent */
html[data-theme="dark"][data-palette="aurora"] { --navy:#0a0e24; --navy-2:#141a3a; --gold:#39e0cf; --gold-soft:#123040; --bg:#0d1230; --card:#141a2e; --line:#252c4a; }
/* 'navy' is the built-in default — no override needed */

/* 6 · PEIAGENTS Portal — matches peiagents.com/agent-portal: warm paper, brass gold, night blue,
   Fraunces serif headings + Hanken Grotesk body + DM Mono figures. Opt-in; classic stays default. */
html:not([data-theme="dark"])[data-palette="portal"] {
  --navy:#1C3A4B; --navy-2:#26495B; --gold:#C69214; --gold-soft:#F3E7C6; --bg:#EFEDE6;
  --card:#FBFAF6; --line:#E0DDD5; --text:#2B2D30; --muted:#7C7F84;
}
html:not([data-theme="dark"])[data-palette="portal"] body {
  font-family: "Hanken Grotesk", "Segoe UI", -apple-system, "Helvetica Neue", Arial, sans-serif;
}
html:not([data-theme="dark"])[data-palette="portal"] h1,
html:not([data-theme="dark"])[data-palette="portal"] h2,
html:not([data-theme="dark"])[data-palette="portal"] .rpt-name,
html:not([data-theme="dark"])[data-palette="portal"] .login-card h1 {
  font-family: "Fraunces", Georgia, serif; font-weight: 600; letter-spacing: .1px;
}
html:not([data-theme="dark"])[data-palette="portal"] .card,
html:not([data-theme="dark"])[data-palette="portal"] .kpi,
html:not([data-theme="dark"])[data-palette="portal"] .rpt-card { border-radius: 12px; }
html:not([data-theme="dark"])[data-palette="portal"] .btn,
html:not([data-theme="dark"])[data-palette="portal"] .tb-btn,
html:not([data-theme="dark"])[data-palette="portal"] .tb-search input { border-radius: 9px; }
html:not([data-theme="dark"])[data-palette="portal"] .kpi .value,
html:not([data-theme="dark"])[data-palette="portal"] .num {
  font-family: "DM Mono", ui-monospace, SFMono-Regular, Menlo, monospace;
  font-variant-numeric: tabular-nums;
}
html:not([data-theme="dark"])[data-palette="portal"] .kpi .label {
  text-transform: uppercase; letter-spacing: .08em; font-size: 10.5px;
}
html:not([data-theme="dark"])[data-palette="portal"] .btn.gold {
  background: linear-gradient(135deg, #C69214, #F0B01E); border-color: #C69214;
  color: #241d07; font-weight: 700;
}
html:not([data-theme="dark"])[data-palette="portal"] .topbar { background: var(--card); }

/* 7 · Beacon — matches dashboard.ftventures.ca: near-black, mint accent, gold CTAs,
   Nunito/Inter type, mono figures. Dark identity (auto-switches to dark mode). */
html[data-theme="dark"][data-palette="beacon"] {
  --navy:#06080f; --navy-2:#101828; --gold:#2dd4bf; --gold-soft:#0d2a26; --bg:#0a0e15;
  --card:#11161f; --line:#1f2735; --text:#eef3fc; --muted:#92a1bf;
  --green:#5ee6a8; --amber:#e9c25c;
}
html[data-theme="dark"][data-palette="beacon"] body {
  font-family: "Nunito", "Inter", "Segoe UI", -apple-system, Arial, sans-serif;
}
html[data-theme="dark"][data-palette="beacon"] h1,
html[data-theme="dark"][data-palette="beacon"] h2,
html[data-theme="dark"][data-palette="beacon"] .rpt-name {
  font-family: "Nunito", "Inter", sans-serif; font-weight: 800; color: var(--text);
}
html[data-theme="dark"][data-palette="beacon"] .card,
html[data-theme="dark"][data-palette="beacon"] .kpi,
html[data-theme="dark"][data-palette="beacon"] .rpt-card { border-radius: 14px; }
html[data-theme="dark"][data-palette="beacon"] .btn,
html[data-theme="dark"][data-palette="beacon"] .tb-btn,
html[data-theme="dark"][data-palette="beacon"] .tb-search input { border-radius: 10px; }
html[data-theme="dark"][data-palette="beacon"] .kpi .value,
html[data-theme="dark"][data-palette="beacon"] .num {
  font-family: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  font-variant-numeric: tabular-nums;
}
html[data-theme="dark"][data-palette="beacon"] .kpi .label {
  text-transform: uppercase; letter-spacing: .1em; font-size: 10.5px; color: var(--muted);
}
html[data-theme="dark"][data-palette="beacon"] .btn.gold {
  background: linear-gradient(135deg, #e9c25c, #c9a227); border-color: #c9a227;
  color: #1c1607; font-weight: 800;
}
html[data-theme="dark"][data-palette="beacon"] .sep {
  text-transform: uppercase; letter-spacing: .12em;
}

/* top bar */
.topbar { position: sticky; top: 0; z-index: 30; display: flex; flex-wrap: wrap; align-items: center;
  gap: 10px; row-gap: 6px; background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  padding: 8px 12px; margin: -6px 0 18px; }
.tb-btn { background: transparent; border: 1px solid var(--line); border-radius: 8px; cursor: pointer;
  font-size: 15px; line-height: 1; padding: 7px 10px; color: var(--text); text-decoration: none; }
.tb-btn:hover { border-color: var(--gold); color: var(--gold); }
.tb-search { flex: 0 1 460px; min-width: 170px; margin: 0; }
.tb-search input { width: 100%; padding: 8px 12px; border: 1px solid var(--line); border-radius: 8px;
  background: var(--bg); color: var(--text); font-size: 13.5px; }
.tb-spacer { flex: 1; }
.tb-user { text-align: right; line-height: 1.15; }
/* company workspace switcher (PEIAGENTS vs FT Ventures) */
.tb-co-switch { display: flex; gap: 2px; background: var(--bg); border: 1px solid var(--line); border-radius: 8px; padding: 2px; }
.tb-co-btn { font-size: 12px; padding: 5px 10px; border-radius: 6px; color: var(--muted); text-decoration: none; white-space: nowrap; }
.tb-co-btn:hover { color: var(--text); }
.tb-co-btn.sel { background: var(--navy); color: #fff; }
.tb-co-btn.sel:hover { color: #fff; }
/* narrow windows: let the topbar wrap instead of forcing the page to scroll sideways */
@media (max-width: 980px) {
  .topbar { flex-wrap: wrap; row-gap: 6px; }
  .tb-search { flex: 1 1 160px; min-width: 120px; }
  .tb-co-btn { padding: 5px 7px; }
}
/* training / help side drawer */
.help-drawer { position: fixed; top: 0; right: 0; width: 360px; max-width: 92vw; height: 100vh; z-index: 200;
  background: var(--card); border-left: 1px solid var(--line); box-shadow: -12px 0 40px rgba(0,0,0,.18);
  transform: translateX(105%); transition: transform .22s ease; display: flex; flex-direction: column; }
.help-drawer.open { transform: translateX(0); }
.help-head { display: flex; justify-content: space-between; align-items: center; padding: 12px 14px; border-bottom: 1px solid var(--line); background: var(--navy); color: #fff; }
.help-head a { color: var(--gold); }
.help-x { background: none; border: 0; color: #fff; font-size: 15px; cursor: pointer; }
.help-body { padding: 12px 14px; overflow-y: auto; }
.help-body #helpSearch { width: 100%; padding: 9px 11px; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 10px; font-size: 13.5px; }
.help-item { padding: 9px 10px; border: 1px solid var(--line); border-radius: 8px; margin-bottom: 6px; cursor: pointer; }
.help-item:hover { border-color: var(--gold); background: var(--gold-soft); }
.help-step { font-size: 14px; line-height: 1.5; padding: 8px 0; }
.help-tip { background: var(--gold-soft); border-radius: 6px; padding: 8px 10px; font-size: 12px; color: #7a5c00; }
.tb-bell { position: relative; }
.bell-badge { position: absolute; top: -6px; right: -6px; background: var(--red); color: #fff; border-radius: 10px;
  font-size: 10px; font-weight: 700; padding: 0 5px; min-width: 16px; text-align: center; line-height: 16px; }
.bell-panel { display: none; position: absolute; right: 0; top: 40px; width: 340px; max-height: 440px; overflow-y: auto;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 12px 40px rgba(0,0,0,.18); z-index: 50; }
.bell-panel.open { display: block; }
.bell-head { padding: 10px 12px; border-bottom: 1px solid var(--line); font-weight: 600; font-size: 13px; }
.bell-item { padding: 8px 12px; border-bottom: 1px solid var(--line); font-size: 12.5px; }
.bell-item a { color: var(--text); } .bell-item a:hover { color: var(--gold); }
.bell-item.red { border-left: 3px solid var(--red); } .bell-item.yellow { border-left: 3px solid var(--amber); }
/* topbar Reports menu — Sage-style, always one click away */
.tb-reports { position: relative; }
.tb-rep-btn { width: auto !important; padding: 0 12px !important; font-size: 13px; font-weight: 600; white-space: nowrap; }
.rep-panel { display: none; position: absolute; left: 0; top: 40px; width: 260px;
  background: var(--card); border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 12px 40px rgba(0,0,0,.18); z-index: 50; padding-bottom: 4px; }
.rep-panel.open { display: block; }
.rep-head { padding: 10px 12px 8px; border-bottom: 1px solid var(--line); font-weight: 700; font-size: 12px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted); }
.rep-panel > a { display: block; padding: 8px 12px; font-size: 13.5px; color: var(--text); text-decoration: none; }
.rep-panel > a:hover { background: var(--gold-soft); color: var(--text); }
.rep-foot { border-top: 1px solid var(--line); margin-top: 4px; }
.rep-foot a { display: block; padding: 8px 12px; font-size: 12.5px; font-weight: 600; color: var(--gold); text-decoration: none; }
@media (max-width: 760px) { .tb-rep-btn .rep-lbl { display: none; } }
.tb-name { display: block; font-weight: 600; font-size: 13.5px; color: var(--text); }
.tb-role { display: block; font-size: 10.5px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted); }
.nav a .ic { display: inline-block; width: 20px; text-align: center; margin-right: 8px; }
.brand .logo-mini { display: none; }
/* sidebar "something new" count badge */
.nav-badge { display: inline-block; min-width: 17px; height: 17px; line-height: 17px; padding: 0 5px; margin-left: 6px;
  font-size: 10.5px; font-weight: 700; text-align: center; color: #fff; background: var(--gold); border-radius: 999px; vertical-align: middle; }
.nav a.active .nav-badge { background: #fff; color: var(--navy); }
.nav-collapsed .nav-badge { position: absolute; margin: 0; transform: translate(6px,-10px); min-width: 15px; height: 15px; line-height: 15px; font-size: 9.5px; }
.nav-collapsed .nav a { position: relative; }
.brand-logo { display: block; width: 190px; max-width: 100%; height: auto; margin: 0 auto 4px; }
.nav-collapsed .brand-logo, html[data-layout="rail"] .brand-logo { width: 46px; margin: 0 auto 8px; }

/* collapsed sidebar → icons only */
.nav-collapsed .sidebar { width: 60px; }
.nav-collapsed .sidebar .lbl, .nav-collapsed .nav .sep, .nav-collapsed .nav .hint,
.nav-collapsed .brand .sub, .nav-collapsed .brand .logo-full { display: none; }
.nav-collapsed .brand .logo-mini { display: inline; color: var(--gold); }
.nav-collapsed .nav a { text-align: center; padding: 11px 0; }
.nav-collapsed .nav a .ic { margin: 0; width: auto; font-size: 16px; }
.nav-collapsed .brand { padding: 18px 10px; text-align: center; }
.nav-collapsed .userbox { text-align: center; padding: 12px 6px; }
a { color: var(--navy-2); text-decoration: none; }
a:hover { color: var(--gold); }

/* Layout */
.shell { display: flex; min-height: 100vh; }
.sidebar {
  width: 232px; background: var(--navy); color: #dde4ef; flex-shrink: 0;
  display: flex; flex-direction: column; position: sticky; top: 0; height: 100vh;
}
.brand { padding: 12px 16px 10px; border-bottom: 1px solid rgba(255,255,255,.08); }
.brand .logo { font-size: 17px; font-weight: 600; color: #fff; letter-spacing: .3px; }
.brand .logo span { color: var(--gold); }
.brand .sub { font-size: 11px; color: #93a0b8; margin-top: 3px; letter-spacing: .5px; text-transform: uppercase; }
.nav { padding: 12px 0; flex: 1; overflow-y: auto; }
.nav a {
  display: block; padding: 10px 20px; color: #c3ccdd; font-size: 13.5px; border-left: 3px solid transparent;
}
.nav a:hover { background: rgba(255,255,255,.05); color: #fff; }
.nav a.active { background: rgba(201,162,39,.12); border-left-color: var(--gold); color: #fff; }
.nav .sep { margin: 10px 20px 6px; font-size: 10.5px; text-transform: uppercase; letter-spacing: 1px; color: #7d8aa3; }
.nav .hint { float: right; font-size: 10px; color: #7d8aa3; background: rgba(255,255,255,.06); border-radius: 4px; padding: 1px 6px; }
/* FT Ventures Inc. — visually a different company, not just another PEIAGENTS section */
.ftv-nav-group { margin-top: 6px; padding-top: 8px; border-top: 1px dashed rgba(255,255,255,.14); background: rgba(13,148,136,.06); }
.ftv-nav-group .sep-ftv { color: #5fd0c4; }
.ftv-nav-group a { border-left-color: transparent; }
.ftv-nav-group a:hover { background: rgba(13,148,136,.12); }
.ftv-nav-group a.active { background: rgba(13,148,136,.18); border-left-color: #0d9488; color: #fff; }
.userbox { padding: 14px 20px; border-top: 1px solid rgba(255,255,255,.08); font-size: 12.5px; color: #93a0b8; }
.userbox a { color: var(--gold); }

.main { flex: 1; padding: 26px 32px; max-width: 1200px; }
.page-head { display: flex; align-items: center; justify-content: space-between; margin-bottom: 14px; }
h1 { font-size: 21px; font-weight: 600; margin: 0; color: var(--navy); }
h2 { font-size: 15px; font-weight: 600; color: var(--navy); margin: 16px 0 8px; }

/* Cards & KPIs — tighter, tidier defaults (less whitespace) */
.card { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 13px 15px; margin-bottom: 12px; }
.kpis { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 10px; margin-bottom: 14px; }
.kpi { background: var(--card); border: 1px solid var(--line); border-radius: 10px; padding: 10px 13px; }
.kpi .label { font-size: 11px; text-transform: uppercase; letter-spacing: .6px; color: var(--muted); }
.kpi .value { font-size: 19px; font-weight: 600; color: var(--navy); margin-top: 3px; }
/* clickable KPI/summary tiles */
a.kpi { text-decoration: none; display: block; transition: box-shadow .15s, transform .12s, border-color .12s; }
a.kpi:hover { box-shadow: 0 4px 14px rgba(0,0,0,.10); transform: translateY(-1px); border-color: var(--gold); }

/* One-line filter bar (all controls inline, not stacked) */
.filterbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.filterbar input, .filterbar select, .filterbar button { width: auto; margin: 0; }
.filterbar select { min-width: 110px; }
.filterbar .grow { flex: 1; min-width: 170px; }
.kpi .value.pos { color: var(--green); } .kpi .value.neg { color: var(--red); }

/* Tables */
table { width: 100%; border-collapse: collapse; background: var(--card); border-radius: 10px; overflow: hidden; }
.card table { border: 0; }
th { text-align: left; font-size: 11px; text-transform: uppercase; letter-spacing: .5px; color: var(--muted);
     padding: 6px 10px; border-bottom: 2px solid var(--line); background: #fafbfc; font-weight: 600; }
td { padding: 6px 10px; border-bottom: 1px solid var(--line); vertical-align: top; font-size: 13px; }
tr:last-child td { border-bottom: 0; }
/* extra-compact tables (audit, long ledgers) */
table.dense th { padding: 4px 8px; font-size: 10.5px; }
table.dense td { padding: 3px 8px; font-size: 11.5px; }
/* consistent interactive hover on every table (matches the Register) */
table tr:hover td { background: #f5f8ff; }
.tabs { display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
td.num, th.num { text-align: right; font-variant-numeric: tabular-nums; }
tr.total td { font-weight: 600; border-top: 2px solid var(--navy); background: var(--gold-soft); }
tr.total:hover td { background: var(--gold-soft); }

/* Register-style table — shared class so every screen can adopt the same dense, readable look */
table.reg td, table.reg th { padding: 5px 8px; font-size: 13px; border-bottom: 1px solid var(--line); }
table.reg th { font-size: 11px; }
table.reg tbody tr:hover td { background: #f5f8ff; }
/* Keep column headers visible on long report tables instead of scrolling them away — sits just under the sticky topbar */
table.reg thead th { position: sticky; top: 54px; z-index: 5; background: var(--card); box-shadow: inset 0 -1px 0 var(--line); }
@media print { table.reg thead th { position: static; } }

/* Collapsible report section (native <details>/<summary> — keyboard- and screen-reader-accessible with no extra JS) */
.rpt-collapse { border: 1px solid var(--line); border-radius: 10px; margin-bottom: 10px; overflow: hidden; }
.rpt-collapse > summary { cursor: pointer; padding: 10px 14px; font-weight: 600; background: var(--bg);
  list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.rpt-collapse > summary::-webkit-details-marker { display: none; }
.rpt-collapse > summary .chev { transition: transform .15s; color: var(--muted); font-size: 11px; }
.rpt-collapse[open] > summary .chev { transform: rotate(90deg); }
.rpt-collapse > summary:hover { background: var(--gold-soft); }
.rpt-collapse > summary:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; }
.rpt-collapse .rpt-collapse-body { padding: 10px 14px 14px; }
.rpt-collapse-sub { font-weight: 400; color: var(--muted); font-size: 12px; }
@media print {
  /* printing should show every section in full, regardless of what's collapsed on screen */
  .rpt-collapse, .rpt-collapse .rpt-collapse-body { display: block !important; }
}
/* quiet inline-edit fields inside register-style tables */
table.reg td.cell input, table.reg td.cell select,
.cell-edit { border: 1px solid transparent; background: transparent; border-radius: 4px; padding: 3px 6px; font-size: 12.5px; transition: border-color .12s, background .12s; }
table.reg td.cell input:hover, table.reg td.cell select:hover, .cell-edit:hover { border-color: #cbd5e1; }
table.reg td.cell input:focus, table.reg td.cell select:focus, .cell-edit:focus { border-color: var(--gold); background: var(--card); outline: none; }

/* Status badges */
.badge { display: inline-block; padding: 2px 10px; border-radius: 20px; font-size: 11.5px; font-weight: 600; }
.badge.conditional { background: #fdf3d7; color: var(--amber); }
.badge.firm { background: #e2ecfb; color: #2456a6; }
.badge.closed { background: #ddf1e4; color: var(--green); }
.badge.cancelled { background: #f6dede; color: var(--red); }
.badge.unmatched { background: #fdf3d7; color: var(--amber); }
.badge.matched, .badge.posted { background: #ddf1e4; color: var(--green); }
.badge.excluded { background: #eceef1; color: var(--muted); }

/* Tabs */
/* Tabs read as the same small pills used for list filters — compact, not a heavy tab bar. */
.tabbar { display: flex; gap: 6px; margin-bottom: 14px; flex-wrap: wrap; align-items: center; }
.tab {
  padding: 5px 12px; font-size: 12.5px; font-weight: 600; letter-spacing: 0;
  color: var(--navy); background: transparent; border: 1px solid #ccd3dd; border-radius: 7px;
}
.tab:hover { background: var(--gold-soft); color: var(--navy); border-color: var(--gold); }
.tab.active { background: var(--navy); color: #fff; border-color: var(--navy); }
.tab.active:hover { background: var(--navy-2); color: #fff; }
html[data-theme="dark"] .tab { color: var(--text); border-color: var(--line); }
html[data-theme="dark"] .tab.active { background: var(--gold); color: var(--navy); border-color: var(--gold); }

/* Forms */
form.grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 14px; }
label { display: block; font-size: 12px; font-weight: 600; color: var(--muted); margin-bottom: 4px; }
input, select, textarea {
  width: 100%; padding: 8px 10px; border: 1px solid #ccd3dd; border-radius: 7px;
  font-family: inherit; font-size: 13.5px; background: #fff; color: var(--text);
}
input:focus, select:focus, textarea:focus { outline: 2px solid rgba(201,162,39,.35); border-color: var(--gold); }
.form-actions { grid-column: 1 / -1; margin-top: 6px; }

.btn {
  display: inline-block; padding: 9px 18px; border-radius: 7px; border: 0; cursor: pointer;
  background: var(--navy); color: #fff; font-size: 13.5px; font-weight: 600; font-family: inherit;
}
.btn:hover { background: var(--navy-2); color: #fff; }
.btn.gold { background: var(--gold); color: var(--navy); }
.btn.gold:hover { background: #b8931f; }
.btn.ghost { background: transparent; color: var(--navy); border: 1px solid #ccd3dd; }
.btn.sm { padding: 5px 12px; font-size: 12.5px; }
.btn.danger { background: var(--red); }

/* sidebar quick-find + collapsible sections (wired in foot.ejs) */
.nav-find { padding: 8px 12px 2px; }
.nav-find input { width: 100%; padding: 6px 10px; font-size: 12.5px; border-radius: 7px;
  border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.07); color: #dbe3f0; }
.nav-find input::placeholder { color: #8e9bb2; }
.nav-find input:focus { outline: none; border-color: var(--gold); background: rgba(255,255,255,.12); }
.sep-toggle { cursor: pointer; user-select: none; position: relative; padding-right: 26px; }
.sep-toggle::after { content: "▾"; position: absolute; right: 14px; font-size: 9px; opacity: .65; transition: transform .15s; }
.sep-toggle.closed::after { transform: rotate(-90deg); }
.sep-toggle:hover { color: var(--gold); }
.nav-group.collapsed { display: none; }
.nav-collapsed .nav-find, html[data-layout="rail"] .nav-find { display: none; }
html[data-layout="openbook"]:not(.ob-nav-full) .nav-find { display: none; }

/* click-to-sort headers (wired globally in foot.ejs) */
th.sortable { cursor: pointer; user-select: none; position: relative; padding-right: 16px !important; }
th.sortable:hover { color: var(--gold); }
th.sortable::after { content: "⇅"; position: absolute; right: 5px; opacity: .28; font-size: 9px; }
th.sortable[data-sort="asc"]::after { content: "▲"; opacity: .95; color: var(--gold); }
th.sortable[data-sort="desc"]::after { content: "▼"; opacity: .95; color: var(--gold); }
th.sortable:focus-visible { outline: 2px solid var(--gold); outline-offset: -2px; }

.filters { display: flex; gap: 10px; align-items: end; margin-bottom: 16px; flex-wrap: wrap; }
.filters > div { min-width: 140px; }

/* Quicken-style quick date/period presets — sits above the From/To (or Month/Year) inputs */
.date-presets { display: flex; gap: 6px; flex-wrap: wrap; width: 100%; margin-bottom: 2px; }
.date-presets button { border: 1px solid var(--line); background: var(--card); color: var(--text); border-radius: 999px;
  padding: 4px 11px; font-size: 11.5px; cursor: pointer; transition: border-color .12s, background .12s; }
.date-presets button:hover { border-color: var(--gold); }
.date-presets button:active, .date-presets button.sel { background: var(--gold); color: #1a1a1a; border-color: var(--gold); }
.muted { color: var(--muted); font-size: 12.5px; }
.error-box { background: #f6dede; color: var(--red); padding: 10px 14px; border-radius: 8px; margin-bottom: 14px; font-size: 13.5px; }
.ok-box { background: #ddf1e4; color: var(--green); padding: 10px 14px; border-radius: 8px; margin-bottom: 14px; }

/* Login */
.login-wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--navy); }
.login-card { background: #fff; border-radius: 12px; padding: 36px 34px; width: 360px; box-shadow: 0 20px 60px rgba(0,0,0,.35); }
.login-card h1 { font-size: 19px; margin-bottom: 2px; }
.login-card .sub { color: var(--muted); font-size: 12px; margin-bottom: 20px; text-transform: uppercase; letter-spacing: .8px; }
.login-card input { margin-bottom: 12px; }
.login-card .btn { width: 100%; margin-top: 6px; }

/* ================= FINANCIAL STATEMENTS (accounting-software look) =================
   Applied to formal reports (P&L, Balance Sheet, Trial Balance, HST, A/R Aging…).
   White "paper", centered masthead, indented account groups, subtotal rules,
   double-underline grand totals, tabular figures. Aptos per house style. */
.statement {
  background: #fff; color: #1a1a1a; max-width: 940px; margin: 0 auto;
  padding: 26px 34px 34px; border: 1px solid var(--line); border-radius: 8px;
  font-family: "Aptos", "Aptos Display", "Segoe UI", -apple-system, Arial, sans-serif;
  box-shadow: 0 1px 2px rgba(16,24,40,.04);
}
html[data-theme="dark"] .statement { background: #f8f9fb; }
.stmt-head { text-align: center; padding-bottom: 14px; margin-bottom: 6px; }
.stmt-head .co { font-family: "Aptos Display","Aptos","Segoe UI",sans-serif; font-size: 21px; font-weight: 700; color: #17233a; letter-spacing: .2px; }
.stmt-head .ttl { font-size: 14px; font-weight: 700; text-transform: uppercase; letter-spacing: 1.4px; margin-top: 4px; color: #2a333f; }
.stmt-head .per { font-size: 12px; color: #5a6472; margin-top: 3px; }
.stmt-head .basis { font-size: 10.5px; color: #8a94a3; margin-top: 2px; text-transform: uppercase; letter-spacing: .6px; }
.statement table { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.statement thead th, .statement tr.colhead th {
  text-align: left; font-size: 10.5px; text-transform: uppercase; letter-spacing: .6px;
  color: #5a6472; font-weight: 600; padding: 6px 10px; border-bottom: 1.5px solid #3a4759; background: none;
}
.statement th.num, .statement td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.statement td { padding: 3.5px 10px; border: 0; color: #23272e; }
.statement tr.section td { font-weight: 700; color: #17233a; padding-top: 12px; font-size: 13px; }
.statement td.acct { padding-left: 26px; }             /* account under a header */
.statement td.acct.lvl2 { padding-left: 42px; }        /* sub-account */
.statement tr.sub td { border-top: 1px solid #b9c1cc; font-weight: 700; color: #17233a; }
.statement tr.sub td.lbl { font-weight: 700; }
.statement tr.spacer td { height: 8px; padding: 0; }
.statement tr.grand td {
  border-top: 1.5px solid #17233a; border-bottom: 3px double #17233a;
  font-weight: 800; color: #17233a; font-size: 13.5px; padding-top: 6px; padding-bottom: 6px;
}
.statement tr:hover td { background: #f6f8fb; }
.statement .neg { color: #b23a3a; }
.stmt-actions { max-width: 940px; margin: 0 auto 10px; display: flex; justify-content: flex-end; gap: 6px; }
@media print {
  .statement { border: 0; box-shadow: none; max-width: none; padding: 0; }
  .stmt-actions { display: none !important; }
}

/* ================= REPORTS HUB (QuickBooks-style cards) ================= */
.rpt-toolbar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; margin: 6px 0 12px; }
.rpt-search { flex: 1; min-width: 220px; position: relative; }
.rpt-search input { width: 100%; padding: 7px 10px 7px 30px; border: 1px solid var(--line); border-radius: 7px; font-size: 12.5px; background: var(--card); color: var(--text); }
.rpt-search::before { content: "🔎"; position: absolute; left: 10px; top: 7px; opacity: .55; font-size: 12px; }
.rpt-sec { margin: 14px 0 6px; display: flex; align-items: baseline; gap: 8px; }
.rpt-sec h2 { margin: 0; font-size: 13.5px; }
.rpt-sec .hint { font-size: 11.5px; color: var(--muted); }
.rpt-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 10px; }
.rpt-card { position: relative; background: var(--card); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px 9px; display: flex; flex-direction: column; min-height: 84px; transition: box-shadow .12s, border-color .12s; }
.rpt-card:hover { box-shadow: 0 4px 14px rgba(16,24,40,.09); border-color: #c9cfda; }
.rpt-card .rpt-name { font-weight: 650; font-size: 13px; color: var(--text); padding-right: 22px; }
.rpt-card .rpt-desc { font-size: 11px; color: var(--muted); margin-top: 2px; flex: 1; line-height: 1.3; }
.rpt-card .rpt-foot { display: flex; align-items: center; justify-content: space-between; margin-top: 7px; gap: 8px; }
.rpt-card .btn { padding: 4px 10px; font-size: 11px; }
.rpt-star { position: absolute; top: 10px; right: 10px; cursor: pointer; font-size: 16px; line-height: 1; color: #c7ccd6; background: none; border: 0; padding: 2px; }
.rpt-star.on { color: var(--gold); }
.rpt-badge { display: inline-block; font-size: 10.5px; font-weight: 600; padding: 2px 8px; border-radius: 999px; white-space: nowrap; }
.rpt-badge.red { background: #fbe6e6; color: #a23030; }
.rpt-badge.amber { background: #fbf0d8; color: #8a6412; }
.rpt-badge.green { background: #e2f3e8; color: #1e7d46; }
.rpt-badge.blue { background: #e5edfb; color: #24487e; }
html[data-theme="dark"] .rpt-badge.red { background:#3a1f1f; color:#e2736e; }
html[data-theme="dark"] .rpt-badge.amber { background:#332a12; color:#d8b53f; }
html[data-theme="dark"] .rpt-badge.green { background:#123020; color:#57c98a; }
html[data-theme="dark"] .rpt-badge.blue { background:#16233f; color:#8fb2ff; }
.rpt-empty { color: var(--muted); font-size: 13px; padding: 10px 2px; }
.rpt-card.hidden, .rpt-sec.hidden { display: none; }
.rpt-time { font-size: 10.5px; color: var(--muted); margin-right: 6px; }

/* "Ask BrokerFlow" — plain-English guided reports (EasyAnswer-style) */
.ez-panel { padding: 0; overflow: hidden; }
.ez-row { display: flex; align-items: center; gap: 8px; padding: 7px 12px; flex-wrap: wrap; }
.ez-row + .ez-row { border-top: 1px solid var(--line); }
.ez-icon { width: 18px; height: 18px; border-radius: 5px; display: flex; align-items: center; justify-content: center;
  font-size: 10.5px; color: #fff; flex: none; }
.ez-icon.green { background: #1e7d46; } .ez-icon.blue { background: #24487e; }
.ez-icon.amber { background: #97711a; } .ez-icon.purple { background: #6b46c1; }
.ez-icon.navy { background: var(--navy); } .ez-icon.red { background: #a23030; }
.ez-text { flex: 1; min-width: 210px; font-size: 12px; }
.ez-text select { display: inline-block; width: auto; margin: 0 3px; padding: 3px 6px; font-size: 11.5px; }
.ez-row .btn { flex: none; padding: 4px 11px; font-size: 11px; }

/* Dense list view for the reports hub — the "accounting style" default */
#catalogTable .rpt-collapse table.reg th, #catalogTable .rpt-collapse table.reg td { padding: 4px 10px; font-size: 12px; }
#catalogTable .rpt-collapse table.reg th { font-size: 10.5px; text-transform: uppercase; letter-spacing: .3px; color: var(--muted); }
#catalogTable .rpt-collapse table.reg .btn { padding: 3px 10px; font-size: 11px; }

@media print {
  .sidebar, .filters, .btn, .no-print { display: none !important; }
  .main { padding: 0; max-width: none; }
  body { background: #fff; }
}