/* ==========================================================================
   True Figure Operations - app theme.
   Loaded AFTER assets/style.css and deliberately overrides the case-study
   "warm paper + serif analyst report" look, which is wrong for a dashboard.
   Dark rail, cream canvas, square hairline-bordered cards, blue mono labels.
   ========================================================================== */

:root{
  --d-ink:#0f1115;          --d-rail:#0d0f13;        --d-rail-2:#161a21;
  --d-rail-tx:#d9dde4;      --d-rail-mut:#767d8b;    --d-rail-hd:#5d6572;
  --d-canvas:#f1efe9;       --d-card:#fbfaf7;        --d-line:#12151a;
  --d-hair:#d8d5cd;         --d-blue:#2544d8;        --d-blue-d:#16309e;
  --d-amber:#c2620f;        --d-green:#0d7a4f;       --d-red:#b3271e;
  --d-mut:#6a7080;
  --d-mono:ui-monospace,'SF Mono',Menlo,Consolas,monospace;
  --d-sans:-apple-system,'Helvetica Neue','Segoe UI',Arial,sans-serif;
}

html,body{background:var(--d-canvas)!important}
body{font-family:var(--d-sans)!important; color:var(--d-ink)!important}
#bar{display:none!important}
main{padding:0!important; background:var(--d-canvas)!important}
.wrap{max-width:none!important; padding:0!important; margin:0!important}
.phero,.pager,.tabbar{display:none!important}

/* ---------- shell ---------- */
.dash-shell{display:flex; align-items:stretch; margin:0!important; min-height:100vh}
.dash-side{
  width:252px; flex:none; background:var(--d-rail); color:var(--d-rail-tx);
  padding:0 0 28px; border:0; position:sticky; top:0; height:100vh; overflow-y:auto}
.ds-brand{display:flex; align-items:center; gap:11px; padding:20px 20px 19px;
  border-bottom:1px solid #232830}
.ds-mark{display:flex; align-items:flex-end; gap:2.5px; height:21px}
.ds-mark i{display:block; width:5px; border-radius:1px; background:#fff}
.ds-mark i:nth-child(1){height:9px; opacity:.45}
.ds-mark i:nth-child(2){height:14px; opacity:.7}
.ds-mark i:nth-child(3){height:21px; background:var(--d-blue)}
.ds-brand b{font-size:15px; font-weight:800; letter-spacing:.06em; color:#fff; display:block;
  text-transform:uppercase; font-family:var(--d-sans)}
.ds-brand em{font-style:normal; font-family:var(--d-mono); font-size:9.5px; letter-spacing:.28em;
  color:var(--d-rail-mut); display:block; margin-top:3px; text-transform:uppercase}

.ds-grp{font-family:var(--d-mono); font-size:9.5px; letter-spacing:.2em; color:var(--d-rail-hd);
  font-weight:600; padding:22px 20px 8px; text-transform:uppercase}
.ds-nv{display:flex; align-items:center; gap:0; width:100%; text-align:left; background:none;
  border:0; border-left:3px solid transparent; padding:9px 20px; font-family:var(--d-sans);
  font-size:14.5px; color:var(--d-rail-tx); font-weight:400; cursor:pointer; transition:background .12s}
.ds-nv i{display:none}
.ds-nv:hover{background:#171b22}
.ds-nv.on{background:var(--d-rail-2); border-left-color:var(--d-blue); font-weight:600; color:#fff}
.ds-n{margin-left:auto; font-family:var(--d-mono); font-size:11px; color:var(--d-rail-hd)}
.ds-nv.on .ds-n{color:var(--d-blue)}
.ds-sub{display:none; padding:2px 0 4px}
.ds-grp.open + .ds-sub, .ds-sub.open{display:block}
.ds-sub a{display:block; padding:6px 20px 6px 32px; font-size:13px; color:var(--d-rail-mut);
  text-decoration:none; border-left:3px solid transparent}
.ds-sub a:hover{background:#171b22; color:var(--d-rail-tx)}
.ds-tog{display:flex; align-items:center; width:100%; background:none; border:0; cursor:pointer;
  font-family:var(--d-mono); font-size:9.5px; letter-spacing:.2em; color:var(--d-rail-hd);
  font-weight:600; padding:22px 20px 8px; text-transform:uppercase}
.ds-tog span{margin-left:auto; font-size:11px; transition:transform .15s}
.ds-tog.open span{transform:rotate(90deg)}
.ds-foot{margin:22px 20px 0; padding-top:14px; border-top:1px solid #232830;
  font-family:var(--d-mono); font-size:10px; line-height:1.7; color:var(--d-rail-hd); letter-spacing:.04em}

/* ---------- topbar + main ---------- */
.dash-main{flex:1; min-width:0; padding:0!important; background:var(--d-canvas)}
.dash-top{display:flex; align-items:flex-end; justify-content:space-between; gap:20px;
  padding:20px 30px 17px; border-bottom:1px solid var(--d-line); background:var(--d-canvas)}
.dash-top .eyebrow{font-family:var(--d-mono)!important; font-size:10px!important; letter-spacing:.2em;
  color:var(--d-blue)!important; text-transform:uppercase; margin:0 0 5px!important; display:block}
.dash-top h2{font-size:27px!important; font-weight:800!important; letter-spacing:-.02em!important;
  margin:0!important; font-family:var(--d-sans)!important; color:var(--d-ink)!important}
.dash-top .meta{font-family:var(--d-mono); font-size:10.5px; color:var(--d-mut); letter-spacing:.05em; text-align:right}
.tabpane{padding:22px 30px 40px}

/* ---------- typography inside panes ---------- */
.dash-main h2,.dash-main h3{font-family:var(--d-sans)!important; letter-spacing:-.01em}
.dash-main .eyebrow{font-family:var(--d-mono)!important; font-size:10.5px!important; line-height:1.7!important;
  letter-spacing:.03em; color:var(--d-mut)!important; text-transform:none!important}
.dash-main .sec-head h2{font-size:17px!important; font-weight:800!important}
.dash-main .kicker{font-family:var(--d-mono)!important; font-size:9.5px!important; letter-spacing:.2em!important;
  color:var(--d-blue)!important; background:none!important; padding:0!important; border:0!important}

/* ---------- cards: square, hairline, no shadow ---------- */
.dash-main .card,.dash-main .panel,.dash-main .tbl-wrap,.dash-main .box{
  background:var(--d-card)!important; border:1px solid var(--d-line)!important; border-radius:0!important;
  box-shadow:none!important}
.dash-main .card .lbl,.dash-main .kpi .lbl{font-family:var(--d-mono)!important; font-size:9.5px!important;
  letter-spacing:.16em!important; color:var(--d-blue)!important; text-transform:uppercase; font-weight:600}
.dash-main .card .val,.dash-main .kpi .val{font-size:30px!important; font-weight:800!important;
  letter-spacing:-.03em!important; color:var(--d-ink)!important; font-family:var(--d-sans)!important;
  font-variant-numeric:tabular-nums; margin-top:6px}
.dash-main .card .note{font-size:12px!important; color:var(--d-mut)!important; margin-top:5px}
.dash-main .card .stripe{display:none!important}
.dash-main .kpi.acc .val{color:var(--d-amber)!important}
.dash-main .kpi.good .val{color:var(--d-green)!important}

/* ---------- tables ---------- */
.dash-main .tbl{background:var(--d-card)}
.dash-main .tbl th{font-family:var(--d-mono)!important; font-size:9.5px!important; letter-spacing:.13em!important;
  text-transform:uppercase; color:var(--d-mut)!important; background:#efece5!important;
  border-bottom:1px solid var(--d-line)!important; font-weight:600}
.dash-main .tbl td{font-size:13px!important; border-bottom:1px solid var(--d-hair)!important; color:var(--d-ink)}
.dash-main .tbl tr:hover td{background:#f4f2ec}
.dash-main .tbl .prov{font-weight:600}

/* ---------- chips, pills, filters ---------- */
.dash-main .pill,.dash-main .chip{font-family:var(--d-mono)!important; font-size:10px!important;
  letter-spacing:.08em; border-radius:0!important; border:1px solid var(--d-line)!important;
  background:var(--d-card)!important; color:var(--d-ink)!important; padding:4px 9px!important}
.dash-main .pill b{color:var(--d-blue)}
.dash-main .ofilter button{font-family:var(--d-mono)!important; font-size:10.5px!important;
  letter-spacing:.09em; border-radius:0!important; border:1px solid var(--d-line)!important;
  background:var(--d-card)!important; color:var(--d-ink)!important; text-transform:uppercase; padding:6px 12px!important}
.dash-main .ofilter button.on{background:var(--d-blue)!important; color:#fff!important; border-color:var(--d-blue)!important}
.dash-main select,.dash-main input[type=text],.dash-main .onote,.dash-main .osel{
  border-radius:0!important; border:1px solid var(--d-hair)!important; background:#fff!important;
  font-family:var(--d-sans)!important; font-size:12.5px!important}
.dash-main .btn,.dash-main button.btn{border-radius:0!important}

/* ---------- misc panels ---------- */
.dash-main .grid{gap:14px!important}
.dash-main a{color:var(--d-blue)}
.dash-main .ostat{display:flex; flex-wrap:wrap; gap:7px; margin:12px 0}

@media (max-width:960px){
  .dash-shell{flex-direction:column}
  .dash-side{width:100%; height:auto; position:static; padding-bottom:14px}
  .ds-grp,.ds-tog{padding-top:14px}
  .dash-top{padding:16px 18px 14px}
  .tabpane{padding:16px 18px 30px}
}