/* ============================================================================
   Perpetuum Capital — "Ledger" design system.
   Everything is scoped under body.ledger so no rule leaks outside the app.
   Restyles the existing Bootstrap 5 classes IN PLACE — no markup/logic changes.
   Palette from the PDF-report house style: amber #F4A81D / ink #1c1c1c / green.
   ============================================================================ */
:root{
  --l-amber:#F4A81D; --l-amber-dark:#E09A10; --l-cream:#FBF3DD; --l-navy:#2F3A56;
  --l-ink:#1c1c1c; --l-ink2:#4a463d; --l-mut:#7e7a70; --l-line:#E7E3DA;
  --l-bg:#FBFAF7; --l-surface:#FFFFFF; --l-surface2:#F4F2ED;
  --l-pos:#2E7D32; --l-neg:#C0392B; --l-warn:#B07D08;
  --l-posbg:rgba(46,125,50,.10); --l-negbg:rgba(192,57,43,.10);
  --l-font:-apple-system,"SF Pro Text","Helvetica Neue","Segoe UI",Roboto,Arial,sans-serif;
  --l-mono:"SF Mono",ui-monospace,Menlo,Consolas,monospace;
  --l-radc:12px; --l-radi:10px; --l-radp:999px;
  --l-shadow:0 1px 3px rgba(0,0,0,.06);
}

/* ---- base ---- */
body.ledger{background:var(--l-bg);color:var(--l-ink);font-family:var(--l-font);line-height:1.5}
body.ledger .fig,body.ledger .num{font-variant-numeric:tabular-nums lining-nums;font-feature-settings:"tnum" 1}
body.ledger .container{max-width:1180px}
body.ledger h1,body.ledger h2,body.ledger h3{letter-spacing:-.4px;font-weight:800;color:var(--l-ink)}
body.ledger a{color:var(--l-amber-dark)}
body.ledger code{background:var(--l-surface2);color:var(--l-ink);border:1px solid var(--l-line);border-radius:5px;padding:1px 5px}

/* ============================ TOP NAV (.lnav — new markup) ================= */
body.ledger .lnav{display:flex;align-items:center;gap:1px;background:var(--l-ink);color:#f4f0e6;
  padding:0 18px;height:76px;overflow-x:auto;-webkit-overflow-scrolling:touch}
body.ledger .lnav .brand{display:flex;align-items:center;gap:9px;font-weight:700;margin-right:14px;white-space:nowrap;font-size:15.5px;color:#fff}
body.ledger .lnav .brand .dot{width:22px;height:22px;border-radius:6px;flex:0 0 auto;
  background:conic-gradient(from 210deg,var(--l-amber),var(--l-amber-dark) 55%,#000 55%)}
body.ledger .lnav a{position:relative;padding:0 12px;height:76px;display:flex;align-items:center;
  color:rgba(244,240,230,.62);font-size:14.5px;font-weight:500;text-decoration:none;white-space:nowrap}
body.ledger .lnav a:hover{color:#fff}
body.ledger .lnav a.active{color:#fff;font-weight:700}
body.ledger .lnav a.active::after{content:"";position:absolute;left:8px;right:8px;bottom:0;height:3px;
  border-radius:3px 3px 0 0;background:var(--l-amber)}
body.ledger .lnav a.gg{color:var(--l-amber);font-weight:700}
body.ledger .lnav .spacer{margin-left:auto}
body.ledger .lnav .util{color:rgba(244,240,230,.62);font-weight:600}
body.ledger .lnav .util.first{margin-left:6px;border-left:1px solid rgba(244,240,230,.20)}
/* golden egg — pure CSS, always renders */
body.ledger .lnav .egg{display:inline-block;width:13px;height:17px;margin-right:7px;vertical-align:-3px;flex:0 0 auto;
  background:radial-gradient(ellipse 62% 56% at 37% 30%,#FDE79A 0%,#F4A81D 52%,#D28D0C 100%);
  border-radius:50% 50% 50% 50% / 60% 60% 40% 40%;
  box-shadow:inset 0 -1px 2px rgba(150,95,0,.35),0 1px 1px rgba(0,0,0,.25)}

/* ============================ FLASH MESSAGES ============================== */
body.ledger .alert-success{background:var(--l-cream);border:1px solid color-mix(in srgb,var(--l-amber) 40%,transparent);
  color:var(--l-ink);border-radius:var(--l-radc)}

/* ============================ BUTTONS ==================================== */
body.ledger .btn{border-radius:var(--l-radi);font-weight:600}
body.ledger .btn-warning,body.ledger .btn-primary,
body.ledger .btn[type="submit"]{background:var(--l-amber)!important;border-color:var(--l-amber)!important;color:var(--l-ink)!important}
body.ledger .btn-warning:hover,body.ledger .btn-primary:hover,
body.ledger .btn[type="submit"]:hover{background:var(--l-amber-dark)!important;border-color:var(--l-amber-dark)!important}
body.ledger .btn-secondary{background:var(--l-surface);border:1px solid var(--l-line);color:var(--l-ink)}

/* ============================ TABLES ==================================== */
body.ledger .table{border-collapse:collapse;color:var(--l-ink);--bs-table-bg:transparent}
body.ledger .table>:not(caption)>*>*{background-color:transparent}
body.ledger .table thead th{background:var(--l-amber)!important;color:var(--l-ink)!important;
  border:0!important;font-weight:700;padding:11px 14px;vertical-align:middle}
body.ledger .table tbody td,body.ledger .table tbody th{border:0;border-bottom:1px solid var(--l-line);
  padding:11px 14px;vertical-align:middle}
body.ledger .table.table-group-divider tbody{border-top:0}
body.ledger .table tbody tr:hover>*{background:color-mix(in srgb,var(--l-ink) 3%,transparent)}
body.ledger .table-responsive{border:1px solid var(--l-line);border-radius:var(--l-radc);background:var(--l-surface);box-shadow:var(--l-shadow)}
body.ledger .table-responsive>.table{margin-bottom:0}

/* ============================ CHAIN TABS (nav-tabs → segmented) ========== */
body.ledger .nav-tabs{border:0;gap:3px;padding:4px;background:var(--l-surface2);border-radius:11px;
  display:inline-flex;flex-wrap:wrap;margin-bottom:18px}
body.ledger .nav-tabs .nav-item{margin:0}
body.ledger .nav-tabs .nav-link{border:0!important;border-radius:8px;color:var(--l-mut);font-weight:600;padding:8px 15px;background:transparent}
body.ledger .nav-tabs .nav-link:hover{color:var(--l-ink)}
body.ledger .nav-tabs .nav-link.active{background:var(--l-surface)!important;color:var(--l-ink)!important;box-shadow:var(--l-shadow)}

/* ============================ FORM CONTROLS ============================= */
body.ledger .form-control,body.ledger .form-select{background:var(--l-surface);color:var(--l-ink);
  border:1.5px solid var(--l-line);border-radius:var(--l-radi);font-weight:600;
  font-variant-numeric:tabular-nums lining-nums;padding:9px 13px}
body.ledger .form-control:focus,body.ledger .form-select:focus{border-color:var(--l-amber);
  box-shadow:0 0 0 3px color-mix(in srgb,var(--l-amber) 22%,transparent)}
body.ledger .form-control.is-invalid,body.ledger .form-select.is-invalid{border-color:var(--l-neg)}
body.ledger .invalid-feedback{color:var(--l-neg);font-weight:600}
/* switches & radios in the brand amber */
body.ledger .form-check-input:checked{background-color:var(--l-amber);border-color:var(--l-amber)}
body.ledger .form-check-input:focus{border-color:var(--l-amber);box-shadow:0 0 0 3px color-mix(in srgb,var(--l-amber) 22%,transparent)}

/* ============================ CARDS ==================================== */
body.ledger .card{border:1px solid var(--l-line);border-radius:var(--l-radc);background:var(--l-surface);box-shadow:var(--l-shadow)}
body.ledger .card-header{background:var(--l-amber)!important;color:var(--l-ink)!important;border-bottom:0;font-weight:700}
body.ledger .card-title{color:var(--l-ink)}
/* info / example callout → cream */
body.ledger .alert-info{background:var(--l-cream);border:1px solid color-mix(in srgb,var(--l-amber) 35%,transparent);color:var(--l-ink)}
body.ledger .alert-warning{background:var(--l-cream);border:1px solid color-mix(in srgb,var(--l-warn) 45%,transparent);color:var(--l-ink)}

/* ============================ BADGES =================================== */
body.ledger .badge.bg-success{background:var(--l-posbg)!important;color:var(--l-pos)!important;font-weight:700}
body.ledger .badge.bg-secondary{background:color-mix(in srgb,var(--l-ink) 8%,transparent)!important;color:var(--l-ink2)!important;font-weight:600}

/* ==================== PANEL COMPONENTS (Golden Goose / Outcomes) ========== */
body.ledger .l-ph{display:flex;align-items:baseline;gap:12px;margin:0 0 6px;flex-wrap:wrap}
body.ledger .l-ph h2,body.ledger .l-ph h1{font-size:24px;margin:0;font-weight:800}
body.ledger .l-ph .l-tag{font-size:14.5px;color:var(--l-mut);font-weight:500}
body.ledger .l-sub{color:var(--l-mut);font-size:15px;margin:0 0 18px}
body.ledger .l-pill{display:inline-flex;align-items:center;gap:7px;font-size:12px;font-weight:700;padding:4px 12px;border-radius:var(--l-radp)}
body.ledger .l-pill .dot{width:8px;height:8px;border-radius:50%}
body.ledger .l-pill.run{color:var(--l-pos);background:var(--l-posbg)}
body.ledger .l-pill.run .dot{background:var(--l-pos);box-shadow:0 0 0 3px var(--l-posbg)}
body.ledger .l-pill.stop{color:var(--l-warn);background:color-mix(in srgb,var(--l-warn) 15%,transparent)}
body.ledger .l-pill.stop .dot{background:var(--l-warn)}
body.ledger .l-pill.panic{color:var(--l-neg);background:var(--l-negbg)}
body.ledger .l-pill.panic .dot{background:var(--l-neg)}

body.ledger .l-kpis{display:grid;grid-template-columns:repeat(auto-fit,minmax(158px,1fr));gap:16px;margin:0 0 18px}
body.ledger .l-tile{background:var(--l-surface);border:1px solid var(--l-line);border-radius:var(--l-radc);padding:16px 18px;box-shadow:var(--l-shadow)}
body.ledger .l-tile .k{font-size:12px;letter-spacing:.05em;text-transform:uppercase;color:var(--l-mut);font-weight:600}
body.ledger .l-tile .v{font-size:29px;font-weight:700;margin-top:7px;letter-spacing:-.5px;font-variant-numeric:tabular-nums lining-nums}
body.ledger .l-tile .v.pos{color:var(--l-pos)} body.ledger .l-tile .v.neg{color:var(--l-neg)}
body.ledger .l-tile .s{font-size:13.5px;color:var(--l-mut);margin-top:4px;font-variant-numeric:tabular-nums}

body.ledger .l-btns{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:0}
body.ledger .l-btn{display:inline-flex;align-items:center;justify-content:center;gap:7px;line-height:1;padding:11px 18px;border-radius:var(--l-radi);font-weight:600;font-size:14.5px;border:1px solid transparent;cursor:pointer;text-decoration:none}
body.ledger .l-btn svg{width:14px;height:14px;flex:0 0 auto;display:block}
body.ledger .l-btn.primary{background:var(--l-amber);color:var(--l-ink)}
body.ledger .l-btn.danger{background:var(--l-neg);color:#fff}
body.ledger .l-btn.ok{background:var(--l-pos);color:#fff}
body.ledger .l-btn.ghost{background:var(--l-surface);border-color:var(--l-line);color:var(--l-ink)}
body.ledger .l-btn.dl{background:var(--l-navy);color:#fff}

body.ledger .l-sec{margin:22px 0 14px;background:var(--l-ink);color:var(--l-surface);padding:9px 15px;
  border-left:5px solid var(--l-amber);border-radius:0 6px 6px 0;font-size:13.5px;letter-spacing:.06em;text-transform:uppercase;font-weight:700}

body.ledger .l-bk{background:var(--l-surface);border:1px solid var(--l-line);border-radius:var(--l-radc);padding:16px 18px;box-shadow:var(--l-shadow);margin:0 0 4px}
body.ledger .l-bk .h{font-size:14px;margin-bottom:13px} body.ledger .l-bk .h b{color:var(--l-ink)} body.ledger .l-bk .h span{color:var(--l-mut)}
body.ledger .l-bk .bkrow{display:flex;align-items:center;gap:12px 14px;flex-wrap:wrap}
body.ledger .l-bk .upd{font-size:14px;color:var(--l-mut)}

body.ledger .l-tblwrap{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--l-line);border-radius:var(--l-radc);background:var(--l-surface);box-shadow:var(--l-shadow);margin-bottom:16px}
body.ledger .l-tbl{width:100%;border-collapse:collapse;font-size:15px}
body.ledger .l-tbl thead th{text-align:left;padding:12px 14px;font-size:14px;color:var(--l-ink);font-weight:700;background:var(--l-amber);white-space:nowrap}
body.ledger .l-tbl thead th.num{text-align:right}
body.ledger .l-tbl tbody td{text-align:left;padding:10px 14px;border-bottom:1px solid var(--l-line);vertical-align:middle}
body.ledger .l-tbl tbody td.num{text-align:right;font-variant-numeric:tabular-nums lining-nums}
body.ledger .l-tbl tbody tr:last-child td{border-bottom:0}
body.ledger .l-tbl tbody tr:hover td{background:color-mix(in srgb,var(--l-ink) 3%,transparent)}
body.ledger .l-tbl .pos{color:var(--l-pos);font-weight:700} body.ledger .l-tbl .neg{color:var(--l-neg);font-weight:700}
body.ledger .l-tbl .sym{font-weight:700}
body.ledger .l-clstag{display:inline-block;text-align:center;line-height:1.35;font-size:13px;font-weight:600;padding:4px 11px;border-radius:8px;
  background:color-mix(in srgb,var(--l-amber) 16%,var(--l-surface));color:var(--l-warn);border:1px solid color-mix(in srgb,var(--l-amber) 30%,transparent)}
body.ledger .l-muted{color:var(--l-mut);font-size:14px}

/* ==================== EVMs config table (.cfg-tbl) ==================== */
body.ledger .cfg-tbl{table-layout:fixed;min-width:860px}
body.ledger .cfg-tbl thead th:nth-child(1){width:18%}
body.ledger .cfg-tbl thead th:nth-child(2){width:8%}
body.ledger .cfg-tbl thead th:nth-child(3){width:15%}
body.ledger .cfg-tbl thead th:nth-child(4){width:17%}
body.ledger .cfg-tbl td.unitcol{color:var(--l-mut)}
body.ledger .cfg-tbl td.curval,body.ledger .cfg-tbl td.curval-txt{color:var(--l-mut);font-weight:600;
  font-variant-numeric:tabular-nums lining-nums;overflow-wrap:break-word}
body.ledger .cfg-tbl td.expl{color:var(--l-mut);font-size:14.5px}
body.ledger .cfg-tbl td.setcol .form-control{width:100%;max-width:175px;margin-left:auto;margin-right:auto;text-align:right}
body.ledger .cfg-tbl td.setcol .form-select{width:100%;max-width:175px;margin-left:auto;margin-right:auto}
body.ledger .cfg-tbl td.setcol textarea.form-control{max-width:100%;text-align:left;font-size:13px;
  font-weight:500;line-height:1.45;resize:vertical}
body.ledger .cfg-tbl td.fw-semibold{font-weight:600}


/* EVMs — match the SOL DEXes type scale */
body.ledger .cfg-tbl tbody td{font-size:16px}
body.ledger .cfg-tbl td.fw-semibold{font-size:17px}
body.ledger .cfg-tbl thead th{font-size:15px}
body.ledger .cfg-tbl td.setcol .form-control{font-size:16.5px}
body.ledger .cfg-tbl td.setcol .form-select{font-size:15.5px}

/* ============================ MOBILE ================================== */
@media(max-width:600px){
  body.ledger .lnav{padding:0 12px}
  body.ledger .container{padding-left:14px;padding-right:14px}
  body.ledger .table,body.ledger .l-tbl{min-width:560px}
  body.ledger .l-btns .l-btn{flex:1 1 auto}
}
