/* QVEI-style skin — reference: wpb.qvei.com admin console. White sidebar with
   grouped uppercase labels and a blue active indicator, hairline tables with
   uppercase micro headers and zebra rows, flat uppercase status text.
   Loaded last from index.html (?v= bump on any change) so it overrides the
   navy sidebar in palette.css/workflow.css and the dark-era base in styles.css
   without touching those files. Feature sheets that are more specific
   (board/reports/workflow/detection tables) keep their own component styling. */

:root{--radius:10px;--sidebar:#ffffff}

/* ---------- Sidebar: white, QVEI-style ---------- */
.sidebar,body.workflow-mode .sidebar{
  --text:#1c2946;--muted:#5a6a85;--dim:#8b97ad;
  --line:#e7ebf1;--line-soft:#eef1f6;--mint:var(--accent);
  background:#fff;color:var(--text);border-color:var(--line);
}
.sidebar .brand,body.workflow-mode .sidebar .brand{color:#101c36;letter-spacing:.5px}
.sidebar .brand-sub,body.workflow-mode .sidebar .brand-sub{color:var(--dim)}
.sidebar .workspace,body.workflow-mode .sidebar .workspace{
  background:#f6f8fb;border-color:#e4e9f1;color:#24314e;
}
.sidebar .workspace small,body.workflow-mode .sidebar .workspace small{color:var(--muted)}
.sidebar .workspace-icon,body.workflow-mode .sidebar .workspace-icon{
  background:var(--accent-soft);border-color:var(--accent-border);color:var(--accent);
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
.sidebar .workspace-tag,body.workflow-mode .sidebar .workspace-tag{display:none}
.sidebar .nav-label,body.workflow-mode .sidebar .nav-label{
  color:#98a2b5;font-size:10px;font-weight:700;letter-spacing:.14em;
  text-transform:uppercase;margin:14px 18px 8px 30px;
}
/* Full-bleed nav rows so the active indicator hugs the sidebar edge. */
.main-nav{margin:0 -18px}
body.workflow-mode .main-nav{margin:0 -12px}
.sidebar .nav-item,body.workflow-mode .sidebar .nav-item{
  color:#45536f;border-radius:6px;padding-left:30px;padding-right:18px;
}
body.workflow-mode .sidebar .nav-item{padding-left:21px}
body.workflow-mode .sidebar .nav-label{margin-left:21px}
.sidebar .nav-item [data-icon],body.workflow-mode .sidebar .nav-item [data-icon]{color:#7a87a0}
.sidebar .nav-item:hover,body.workflow-mode .sidebar .nav-item:hover{background:#f2f4f9;color:#101c36}
.sidebar .nav-item.active,body.workflow-mode .sidebar .nav-item.active{
  background:#eef2f8;color:#0d1a36;border-radius:0;box-shadow:inset 3px 0 0 var(--accent);
}
.sidebar .nav-item.active [data-icon],body.workflow-mode .sidebar .nav-item.active [data-icon]{color:var(--accent)}
.sidebar .trust-card strong,body.workflow-mode .sidebar .trust-card strong{color:#24314e}
.sidebar .trust-card > [data-icon],body.workflow-mode .sidebar .trust-card > [data-icon]{
  background:var(--accent-soft);border-color:var(--accent-border);color:var(--accent);
}
.sidebar .trust-card p,body.workflow-mode .sidebar .trust-card p{color:var(--dim)}
.sidebar .text-link,body.workflow-mode .sidebar .text-link{color:var(--muted)}
.sidebar .text-link:hover,body.workflow-mode .sidebar .text-link:hover{color:var(--accent)}
.sidebar .avatar,body.workflow-mode .sidebar .avatar{
  background:#eef1f6;border-color:#dde3ec;color:#44536e;
}
.sidebar .local-status:hover,body.workflow-mode .sidebar .local-status:hover{background:#f6f8fb}

/* ---------- Tables: hairline rules, uppercase micro headers, zebra ---------- */
thead{background:transparent}
thead th{
  background:transparent;color:#667085;font-size:11px;font-weight:650;
  letter-spacing:.08em;text-transform:uppercase;
  border-top:1px solid #44506a;border-bottom:1px solid var(--line);
}
th,td{font-variant-numeric:tabular-nums}
tbody tr:nth-child(even) td{background:#fafbfd}
tbody tr:hover td{background:#f3f6fc}

/* ---------- Status: flat uppercase text, QVEI-style ---------- */
.badge{border:0;text-transform:uppercase;letter-spacing:.06em;font-weight:650}
/* [class] lifts specificity over palette's .badge.<variant> tinted chips. */
td .badge,td .badge[class]{background:transparent;padding:2px 4px;border-radius:0}
.wf-table .wf-status{
  background:transparent;padding:2px 4px;border-radius:0;
  text-transform:uppercase;letter-spacing:.06em;font-weight:700;
}

/* ---------- Page chrome ---------- */
h1{font-size:1.5rem;font-weight:650;letter-spacing:-.4px}
.eyebrow{font-size:11px;font-weight:650;letter-spacing:1.2px;color:#98a2b5}
.page-heading p{color:#667085}
@media(max-width:1200px){
  .main-nav{margin:0 -12px}
  .sidebar .nav-item{padding-left:24px}
  .sidebar .nav-label{margin-left:24px}
}

/* ---------- Compact layout pass: QVEI density ---------- */

/* Sidebar: drop decorative furniture, tighten vertical rhythm. */
.sidebar .workspace,body.workflow-mode .sidebar .workspace{display:none}
.sidebar .trust-card,body.workflow-mode .sidebar .trust-card{display:none}
.sidebar{padding-top:20px}
.sidebar .brand{font-size:.9375rem}
.sidebar .brand img{width:30px;height:30px}
.sidebar .nav-item,body.workflow-mode .sidebar .nav-item{
  padding-top:8px;padding-bottom:8px;font-size:13.5px;gap:10px;
}
.sidebar .nav-item [data-icon] svg,body.workflow-mode .sidebar .nav-item [data-icon] svg{width:17px;height:17px}
.sidebar .nav-label,body.workflow-mode .sidebar .nav-label{margin:12px 18px 6px 30px}
body.workflow-mode .sidebar .nav-label{margin-top:10px}
.sidebar .local-status{padding:11px 8px}
.sidebar-foot{padding:12px 0}

/* Topbar: slim, drop the "Workspace /" breadcrumb decoration. */
.topbar,body.workflow-mode .topbar{height:58px;padding:0 24px}
.breadcrumb{gap:8px}
.breadcrumb>[data-icon],.breadcrumb>span:nth-of-type(-n+2),.breadcrumb>.slash{display:none}

/* Content rhythm: tighter page padding and heading block. */
main{padding:18px 28px 0}
.page-heading{margin-bottom:14px;align-items:center}
.eyebrow{display:none}
h1{font-size:1.35rem;letter-spacing:-.3px}
.page-heading p{margin-top:2px;font-size:13px}
body.workflow-mode .page-heading h1{font-size:1.35rem}

/* Metric cards: smaller values, tighter padding. */
.metrics-grid{gap:12px;margin-bottom:16px}
.metric{padding:13px 15px 11px}
.metric-label{font-size:12px}
.metric-value{font-size:1.45rem;letter-spacing:-.6px;margin:8px 0 4px}
.metric-bottom{font-size:12px}
.chart-grid{gap:14px;margin-bottom:18px}
.panel{border-radius:8px}
.panel-head{padding:13px 16px 0}
.section-heading{margin:20px 0 12px}

/* Tables sit flush on the page like QVEI: no box around table panels. */
.panel.table-panel,.panel.wt-table-panel{border:0;background:transparent;border-radius:0;overflow:visible}
.panel.table-panel .panel-head,.panel.wt-table-panel .panel-head{padding:0 0 8px}
.panel.table-panel .table-footer{border-top:0;padding:8px 0 0}
thead th{padding:8px 12px}
td{padding:9px 12px;font-size:13px}
th:first-child,td:first-child{padding-left:14px}
th:last-child,td:last-child{padding-right:14px}
.table-footer{padding:9px 14px}
.empty-state{padding:36px 20px}

/* Exceptions/board (wf) tables: kill the 65px row height. */
.wf-table th{height:34px;padding:7px 10px}
.wf-table td{height:auto;padding-top:9px;padding-bottom:9px}
.wf-metric{padding:10px 14px 8px}
.wf-pagination{padding:12px 4px}
.wf-footnote{padding:0 4px 16px}

/* Controls: smaller buttons and inputs. */
.primary-button{padding:8px 13px;font-size:13px;border-radius:6px}
.primary-button svg{width:15px;height:15px}
.subtle-button{padding:5px 10px;font-size:12.5px;border-radius:6px}
.subtle-button svg{width:13px;height:13px}
.icon-button{width:30px;height:30px}
.period-switch button{padding:5px 9px}
.search-field{padding:7px 11px;min-width:240px}
.filter-controls select{padding:8px 30px 8px 11px}

/* Detail drawer: tighter chrome. */
.drawer-head{padding:16px 22px}
.drawer-body{padding:18px 22px}

/* Feature views: compact their stat cards. */
.ingest-metrics>div,.ingest-metrics>.ingest-metric-button{padding:13px 16px}
.ingest-metrics strong{font-size:1.35rem;margin-top:8px}
.rp-card{padding:15px;min-height:0}
.rp-card strong{font-size:1.5rem}
.rp-section-head{padding:14px 16px}
.ld-toolbar h2{font-size:1.125rem}

.page-footer{margin-top:18px;padding-bottom:16px}
@media(max-width:1200px){
  main{padding:16px 20px 0}
}


/* ---------- v3: QVEI declutter (peer-reviewed scoping) ----------
   Scoped to the payment-list views (.wf-workspace, which batches/board/
   deposits/allowlist do NOT use) and away from board's nb-metrics ring
   tiles and the detail drawer's .wf-detail-tabs, per Cursor review. */

/* Metrics: flat totals strip instead of cards. */
.wf-metrics:not(.nb-metrics):not(.auto-batch-metrics){
  display:flex;flex-wrap:wrap;gap:4px 36px;margin:0 24px 14px;
}
.wf-metrics:not(.nb-metrics):not(.auto-batch-metrics) .wf-metric{
  display:flex;flex-direction:column;gap:2px;
  border:0;background:none;border-radius:0;padding:0;box-shadow:none;min-height:0;
}
.wf-metrics:not(.nb-metrics):not(.auto-batch-metrics) .wf-metric svg{display:none}
.wf-metrics:not(.nb-metrics):not(.auto-batch-metrics) .wf-metric small{display:none}
.wf-metrics:not(.nb-metrics):not(.auto-batch-metrics) .wf-metric strong{font-size:1.375rem;letter-spacing:-.5px}
.wf-metrics:not(.nb-metrics):not(.auto-batch-metrics) .wf-metric span{
  order:-1;font-size:10px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:#98a2b5;
}

/* Diagnostics rows: exceptions only; deposits keeps its own widget. */
.wf-dataset-note:has(> #wf-deposit-monitor){display:none}
.wf-workspace [data-chain-monitor]{display:none}

/* Second dataset note: descriptive span gone, export buttons right-aligned. */
.wf-dataset-note{border:0;background:none;padding:0 24px;margin:0 0 10px;justify-content:flex-end}
.wf-dataset-note:has([data-wf-action="export"])>span{display:none}
@media(max-width:800px){
  .wf-metrics:not(.nb-metrics):not(.auto-batch-metrics){margin-left:16px;margin-right:16px}
  .wf-dataset-note{padding-left:16px;padding-right:16px}
}

/* Critical banner moved into the topbar pill (#critical-pill, styled in workflow.css). */

/* Status tabs: quiet text + blue underline. Drawer tabs (.wf-detail-tabs) untouched. */
.wf-toolbar-top .wf-tabs{gap:0}
.wf-toolbar-top .wf-tabs button{
  background:none;border:0;box-shadow:none;border-radius:0;
  color:var(--muted);padding:6px 2px;margin-right:16px;font-size:13px;
}
.wf-toolbar-top .wf-tabs button.active{
  background:none;color:var(--text);box-shadow:inset 0 -2px 0 var(--accent);
}
.wf-toolbar-top .wf-tabs .wf-counter{
  background:none;border:0;padding:0;margin-left:5px;color:#98a2b5;font-size:11px;
  font-variant-numeric:tabular-nums;
}

/* Filter bar: compact, fully functional. */
.wf-filters{gap:8px}
.wf-filters select,.wf-filters input{min-height:32px;padding:5px 9px;font-size:12.5px}
.wf-filters .wf-source-date>span{font-size:11px}
.wf-filter-submit{padding:5px 10px;font-size:12.5px}

/* Table: no progress bars; small coin circles; severity = dot only
   (font-size:0 keeps the text for screen readers, unlike display:none). */
.wf-table progress{display:none}
.wf-asset .asset-symbol{width:20px;height:20px;font-size:11px}
.wf-severity{font-size:0;gap:4px}
.wf-severity i{width:8px;height:8px}

/* Subnav: quiet text tabs. */
.wt-subnav{margin-bottom:14px;padding-bottom:0;border-bottom:0;gap:0}
.wt-subnav button,.wt-subnav .wt-subnav-current{
  min-height:0;padding:6px 2px;margin-right:16px;border:0;border-radius:0;
  background:none;color:var(--muted);font-size:13px;
}
.wt-subnav button.selected,.wt-subnav .wt-subnav-current{
  background:none;color:var(--text);box-shadow:inset 0 -2px 0 var(--accent);
}

/* Footnote paragraph: payment-list views only (batches/board keep theirs). */
.wf-workspace .wf-footnote{display:none}

/* Sidebar API line: single line, no hostname. */
.sidebar .local-status{padding:9px 8px}
.sidebar .local-status small{display:none}
.sidebar .local-status>[data-icon]{display:none}

/* ---------- v4: remaining views (peer-reviewed scoping) ---------- */

/* Deposits: flat totals strip (same pattern as .wf-metrics). */
.deposits-metrics{display:flex;flex-wrap:wrap;gap:4px 36px}
.deposits-metrics>div{border:0;background:none;border-radius:0;padding:0}
.deposits-metrics span{font-size:10px;font-weight:650;letter-spacing:.12em;text-transform:uppercase;color:#98a2b5}
.deposits-metrics strong{margin-top:2px;font-size:1.375rem;letter-spacing:-.5px;color:var(--text)}

/* Ingest/normalization: flat totals strip; supersedes the v3 card compaction. */
.ingest-metrics>div,.ingest-metrics>.ingest-metric-button{border:0;background:none;padding:0}
.ingest-metrics svg{display:none}
.ingest-metrics>div>span{
  display:block;font-size:10px;font-weight:650;letter-spacing:.12em;
  text-transform:uppercase;color:#98a2b5;
}
.ingest-metrics strong{color:var(--text);margin-top:2px;font-size:1.375rem}

/* Detection hero: light panel instead of the navy banner. */
.dt-hero{background:#fff;border:1px solid var(--line);border-radius:8px;color:var(--text)}
.dt-hero:after{display:none}
.dt-eyebrow{color:#98a2b5}
.dt-hero h2{color:#101828}
.dt-hero h2 span{color:var(--accent)}
.dt-hero p{color:var(--muted)}
.dt-live-state{color:var(--muted)}
.dt-live-state strong{color:var(--text)}
.dt-hero-scale i{background:var(--accent)}
.dt-hero-stat{border-left:1px solid var(--line)}
.dt-hero-stat>span:first-child{color:#98a2b5}
.dt-hero-stat>strong{color:#101828;font-size:clamp(30px,3.4vw,44px)}
.dt-hero-stat small{color:var(--muted)}
.dt-reference-note{color:var(--dim)}
@media(max-width:600px){.dt-hero-stat{border-top:1px solid var(--line);border-left:0;padding-left:0;padding-top:14px}}

/* Detection stat cards: flat strip. */
.dt-stats{display:flex;flex-wrap:wrap;gap:4px 36px;margin:18px 0 24px}
.dt-stat{border:0;background:none;border-radius:0;padding:0}
.dt-stat:before{display:none}
.dt-stat>strong{font-size:1.25rem;line-height:1.5;margin-top:2px}
.dt-stat>small{display:none}

/* Deposits workflow-step pills inside cells: flat status text.
   [class] lifts specificity over palette's .workflow-step.<state> tints. */
td .workflow-step,td .workflow-step[class]{
  border:0;background:transparent;padding:2px 4px;border-radius:0;
  text-transform:uppercase;letter-spacing:.06em;font-weight:650;
}

/* v6: exceptions header merge — on wide screens the flat totals strip sits
   right-aligned, like the "totals right" half of a header row. v8 fix: the
   old -42px pull-up assumed the workspace subnav tabs occupied the row above
   the strip, but on the payment views #workspace-subnav is empty, so the
   strip was pulled through the 58px topbar into the #critical-pill (and
   overlapped the node-alerts panel when one is shown). Keep the alignment,
   drop the pull-up; below 1280px everything stays stacked. */
@media(min-width:1280px){
  .wf-workspace:not(.has-detail) > .wf-main > .wf-metrics:first-child{
    justify-content:flex-end;gap:4px 28px;
  }
}
