/* Shared platform chrome stylesheet.
 *
 * Every proposal tool built with a dark/light calculator UI (design tokens,
 * panels, currency bar, model tabs, wizard modal, changelog modal, theme
 * toggle, discount/escalation approval modals) had its own copy of this same
 * ~220-line block, hand-copied tool to tool. This is that block, extracted
 * once - link it with <link rel="stylesheet" href="/shared/platform.css">
 * instead of pasting a new <style> block into a new tool.
 *
 * What this file deliberately does NOT own: page title, hero copy, and any
 * layout specific to a single product's inputs (that stays in the tool's own
 * <style> block, scoped to that product's own classes/ids).
 *
 * --orange is BUI's brand accent by default. A tool for a different brand
 * variant can override the handful of --orange*/--accent* custom properties
 * in its own <style> block, after this stylesheet is linked.
 */

/* ── DESIGN TOKENS ── */
:root {
  --bg:       #0d1117;  --panel:    #161c27;  --panel2:   #1c2333;
  --panel3:   #222d40;  --field-bg: #111822;
  --border:   rgba(255,255,255,0.07);  --border-md: rgba(255,255,255,0.13);
  --text:     #e2eaf8;  --text-sub: #5d7a9a;  --text-dim: #344d68;
  --orange:   #D9861C;  --orange-bg:rgba(217,134,28,0.1); --orange-bd:rgba(217,134,28,0.3);
  --green:    #22c55e;  --green-bg: rgba(34,197,94,0.1);
  --accent:   #00c9d4;  --accent-bg:rgba(0,201,212,0.1);  --accent-bd:rgba(0,201,212,0.3);
  --hero-bg:  #0d2236;  --hero-val: #00c9d4;
  --r: 12px;  --r-sm: 7px;
}
[data-theme="light"] {
  --bg:#dce2ee; --panel:#f2f5fc; --panel2:#e8edf8; --panel3:#dce3f2;
  --field-bg:#fff; --border:rgba(0,0,0,0.07); --border-md:rgba(0,0,0,0.13);
  --text:#0d1828; --text-sub:#486880; --text-dim:#96afc8;
  --orange:#9C6014; --orange-bg:rgba(156,96,20,0.08); --orange-bd:rgba(156,96,20,0.25);
  --green:#16a34a; --green-bg:rgba(22,163,74,0.08);
  --accent:#007b84; --accent-bg:rgba(0,123,132,0.08); --accent-bd:rgba(0,123,132,0.25);
  --hero-bg:#d8eef4; --hero-val:#007b84;
}

/* ── BASE ── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html,body{min-height:100%;font-family:'DM Sans',sans-serif;background:var(--bg);color:var(--text);font-size:14px;line-height:1.5;transition:background .2s,color .2s;}
body::before{content:'';position:fixed;inset:0;background-image:linear-gradient(rgba(255,255,255,.018) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.018) 1px,transparent 1px);background-size:36px 36px;pointer-events:none;z-index:0;}
[data-theme="light"] body::before{background-image:linear-gradient(rgba(0,0,0,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(0,0,0,.04) 1px,transparent 1px);}
.wrap{position:relative;z-index:1;max-width:900px;margin:0 auto;padding:32px 20px 60px;}

/* ── HEADER ── */
.hero-header{text-align:center;margin-bottom:32px;}
.hero-eyebrow{font-size:11px;font-weight:700;letter-spacing:.22em;text-transform:uppercase;color:var(--orange);margin-bottom:12px;}
.hero-title{font-family:'Rajdhani',sans-serif;font-size:clamp(36px,6vw,52px);font-weight:700;line-height:1;color:var(--text);}
.hero-title em{font-style:normal;color:var(--orange);}
.hero-sep{width:44px;height:2px;background:var(--orange);margin:16px auto;}
.hero-sub{font-size:13px;color:var(--text-sub);margin-bottom:8px;}
.hero-warn{font-size:12px;font-weight:600;color:var(--orange);}

/* ── THEME TOGGLE ── */
.theme-row{display:flex;justify-content:flex-end;margin-bottom:18px;}
.theme-toggle{display:flex;background:var(--panel);border:1px solid var(--border-md);border-radius:20px;padding:3px;gap:2px;}
.theme-opt{display:flex;align-items:center;gap:5px;padding:4px 14px;border-radius:16px;border:none;background:transparent;font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;color:var(--text-sub);cursor:pointer;transition:all .15s;}
.theme-opt svg{width:12px;height:12px;}
.theme-opt.active{background:var(--accent);color:#fff;}

/* ── CURRENCY BAR ── */
.currency-bar{display:flex;align-items:center;gap:10px;background:var(--panel);border:1px solid var(--border-md);border-radius:var(--r-sm);padding:8px 14px;margin-bottom:16px;}
.currency-bar-lbl{font-size:10px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim);margin-right:4px;}
.curr-btns{display:flex;gap:3px;}
.curr-btn{padding:4px 12px;border:1px solid var(--border-md);border-radius:20px;background:transparent;color:var(--text-sub);font-family:'Rajdhani',sans-serif;font-size:13px;font-weight:700;cursor:pointer;transition:all .14s;}
.curr-btn:hover{color:var(--text);border-color:var(--text-dim);}
.curr-btn.active{background:var(--orange);border-color:var(--orange);color:#fff;}
.curr-rate{margin-left:auto;font-size:11px;color:var(--text-dim);}

/* ── MODEL TABS ── */
.model-tabs{display:grid;grid-template-columns:repeat(2,1fr);gap:4px;margin-bottom:20px;background:var(--panel);border:1px solid var(--border-md);border-radius:var(--r-sm);padding:4px;}
.mtab{padding:9px 8px;border:none;border-radius:5px;background:transparent;color:var(--text-sub);font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;letter-spacing:.05em;text-transform:uppercase;cursor:pointer;transition:all .15s;text-align:center;}
.mtab:hover{color:var(--text);}
.mtab.active{background:var(--orange);color:#fff;}

/* ── LAYOUT ── */
.layout{display:grid;grid-template-columns:1fr 1fr;gap:16px;align-items:start;}

/* ── PANELS ── */
.panel{background:var(--panel);border:1px solid var(--border-md);border-radius:var(--r);padding:22px;}
.panel-heading{font-size:10px;font-weight:700;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:18px;}

/* ── INPUTS ── */
.field-row{display:flex;flex-direction:column;gap:7px;padding:13px 0;border-bottom:1px solid var(--border);}
.field-row:last-of-type{border-bottom:none;}
.field-label{font-size:12px;color:var(--text);font-weight:500;}
.fi{width:100%;background:var(--field-bg);border:1px solid var(--border-md);border-radius:var(--r-sm);color:var(--text);outline:none;transition:border-color .14s;}
input[type=number].fi{padding:8px 12px;font-family:'Rajdhani',sans-serif;font-size:18px;font-weight:600;-moz-appearance:textfield;}
input[type=number].fi::-webkit-outer-spin-button,
input[type=number].fi::-webkit-inner-spin-button{-webkit-appearance:none;}
input[type=number].fi:focus{border-color:var(--orange);}
select.fi{padding:8px 28px 8px 12px;font-size:13px;cursor:pointer;-webkit-appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='11' height='6' viewBox='0 0 11 6'%3E%3Cpath d='M1 1l4.5 4L10 1' stroke='%235d7a9a' stroke-width='1.5' fill='none' stroke-linecap='round'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right 10px center;}
select.fi:focus{border-color:var(--orange);}
.lp{display:none;}
.lp.on{display:block;}

/* ── CHIPS ── */
.chip{display:inline-flex;align-items:center;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;}
.chip.orange{color:var(--orange);background:var(--orange-bg);border:1px solid var(--orange-bd);}
.chip.teal{color:var(--accent);background:var(--accent-bg);border:1px solid var(--accent-bd);}

/* ── FOOTNOTES ── */
.footnotes{margin-top:16px;padding-top:13px;border-top:1px solid var(--border);}
.footnotes p{font-size:11px;color:var(--text-sub);line-height:1.65;margin-bottom:3px;}
.footnotes strong{color:var(--text);font-weight:600;}

/* ── RESULTS ── */
.hero-stat{background:var(--hero-bg);border:1px solid var(--accent-bd);border-radius:var(--r-sm);padding:14px 18px;margin-bottom:10px;display:flex;justify-content:space-between;align-items:flex-end;}
.hs-lbl{font-size:9px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--accent);opacity:.75;margin-bottom:4px;}
.hs-val{font-family:'Rajdhani',sans-serif;font-size:28px;font-weight:700;color:var(--hero-val);line-height:1;}
.hs-col.right{text-align:right;}
.hs-val.sm{font-size:20px;}
.stat{background:var(--panel2);border:1px solid var(--border);border-radius:var(--r-sm);padding:12px 14px;margin-bottom:8px;}
.stat-lbl{font-size:9px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;color:var(--text-sub);margin-bottom:5px;}
.stat-lbl small{font-size:9px;font-weight:400;letter-spacing:0;text-transform:none;color:var(--text-dim);margin-left:5px;}
.stat-val{font-family:'Rajdhani',sans-serif;font-size:20px;font-weight:700;color:var(--text);line-height:1;}
.stat-val.green{color:var(--green);}
.stat-val.dim{color:var(--text-sub);}
.stat-val.orange{color:var(--orange);}

/* ── COLLAPSIBLES ── */
.coll-toggle{display:flex;align-items:center;gap:6px;padding:9px 0 5px;cursor:pointer;font-size:10px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;color:var(--text-sub);border-top:1px solid var(--border);user-select:none;transition:color .14s;}
.coll-toggle:hover{color:var(--accent);}
.coll-body{display:none;border:1px solid var(--border);border-radius:var(--r-sm);overflow:hidden;margin-bottom:4px;}
.coll-body.open{display:block;}
table.ct{width:100%;border-collapse:collapse;}
table.ct th{font-size:9px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--text-dim);padding:7px 12px;background:var(--panel3);border-bottom:1px solid var(--border);text-align:left;}
table.ct th:last-child{text-align:right;}
table.ct td{font-size:11px;color:var(--text-sub);padding:7px 12px;border-bottom:1px solid var(--border);}
table.ct tr:last-child td{border-bottom:none;}
table.ct td:last-child{text-align:right;font-family:'Rajdhani',sans-serif;font-size:13px;font-weight:600;color:var(--text);}
table.ct tr.hi td{background:var(--accent-bg);color:var(--text);}
table.ct tr.hi td:last-child{color:var(--accent);}
table.ct th.num{text-align:right;}
table.ct td.num{text-align:right;font-family:'Rajdhani',sans-serif;font-size:13px;font-weight:600;color:var(--text);}
.pay-pill{padding:5px 14px;border-radius:20px;font-size:12px;font-weight:600;cursor:pointer;border:1px solid var(--border-md);background:transparent;color:var(--text-sub);transition:all .15s;font-family:'DM Sans',sans-serif;}
.pay-pill.active{background:var(--accent);border-color:var(--accent);color:#fff;}
.pay-pill:hover:not(.active){border-color:var(--accent);color:var(--accent);}
/* Switch toggle */
.disc-toggle-row{display:flex;align-items:center;justify-content:space-between;padding:10px 0;border-bottom:1px solid var(--border);}
.toggle-label{font-size:12px;color:var(--text);font-weight:500;}
.toggle-label .tl-sub{font-size:11px;color:var(--text-sub);font-weight:400;margin-top:2px;}
.sw{position:relative;display:inline-block;width:40px;height:22px;cursor:pointer;flex-shrink:0;}
.sw input{opacity:0;width:0;height:0;}
.sw-track{position:absolute;inset:0;background:var(--field-bg);border:1px solid var(--border-md);border-radius:11px;transition:.2s;}
.sw input:checked+.sw-track{background:var(--orange);border-color:var(--orange);}
.sw-thumb{position:absolute;top:3px;left:3px;width:14px;height:14px;background:var(--text-dim);border-radius:50%;transition:.2s;}
.sw input:checked~.sw-thumb{transform:translateX(18px);background:#fff;}

/* Multi-year schedule table */
table.my{width:100%;border-collapse:collapse;}
table.my th{font-size:9px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--text-dim);padding:7px 12px;text-align:left;background:var(--panel3);}
table.my th:not(:first-child){text-align:right;}
table.my td{font-size:12px;color:var(--text-sub);padding:8px 12px;border-top:1px solid var(--border);}
table.my td:not(:first-child){text-align:right;font-family:'Rajdhani',sans-serif;font-size:13px;font-weight:600;color:var(--text);}
table.my tr.tcv-row td{color:var(--orange);font-weight:700;border-top:2px solid var(--border-md);}
.my-block{display:none;}
.my-block.on{display:block;}
.stat.tcv-stat{display:none;}
.stat.tcv-stat.on{display:block;}

/* Escalation below-floor approval modal */
.esc-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.82);z-index:2000;align-items:center;justify-content:center;}
.esc-bg.open{display:flex;}
.esc-modal-card{background:var(--panel);border:1px solid var(--orange-bd);border-radius:var(--r);padding:26px;width:100%;max-width:440px;}
.esc-title{font-family:'Rajdhani',sans-serif;font-size:20px;font-weight:700;color:var(--orange);margin-bottom:8px;}
.esc-body-text{font-size:13px;color:var(--text-sub);line-height:1.6;margin-bottom:14px;}
.esc-confirm-box{background:var(--orange-bg);border:1px solid var(--orange-bd);border-radius:var(--r-sm);padding:12px;margin-bottom:16px;}
.esc-confirm-title{font-size:10px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--orange);margin-bottom:5px;}
.esc-confirm-text{font-size:12px;color:var(--orange);}
.esc-actions{display:flex;gap:10px;}

/* ── GENERATE WIZARD MODAL ── */
.modal-bg{display:none;position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:1000;align-items:center;justify-content:center;}
.modal-bg.open{display:flex;}
.modal{background:var(--panel);border:1px solid var(--border-md);border-radius:var(--r);padding:28px;width:100%;max-width:480px;}
.modal-title{font-family:'Rajdhani',sans-serif;font-size:20px;font-weight:700;color:var(--text);margin-bottom:4px;}
.modal-sub{font-size:12px;color:var(--text-sub);margin-bottom:20px;}
.qf{display:flex;flex-direction:column;gap:5px;margin-bottom:14px;}
.qf label{font-size:11px;font-weight:600;color:var(--text-sub);}
.qi{width:100%;padding:9px 12px;background:var(--field-bg);border:1px solid var(--border-md);border-radius:var(--r-sm);color:var(--text);font-family:'DM Sans',sans-serif;font-size:13px;outline:none;transition:border-color .14s;}
.qi:focus{border-color:var(--orange);}
.qi[readonly]{opacity:.7;cursor:not-allowed;}
.modal-steps{display:flex;gap:6px;margin-bottom:20px;}
.modal-step{flex:1;height:3px;border-radius:2px;background:var(--border-md);transition:background .2s;}
.modal-step.done{background:var(--orange);}
.modal-actions{display:flex;gap:10px;margin-top:20px;}
.modal-err{font-size:11px;color:#f87171;margin-top:8px;min-height:16px;}
.pricing-summary{background:var(--panel2);border:1px solid var(--border);border-radius:var(--r-sm);padding:14px;margin-bottom:16px;font-size:12px;color:var(--text-sub);}
.pricing-summary strong{color:var(--text);display:block;margin-bottom:6px;font-size:13px;}
.pricing-summary .ps-row{display:flex;justify-content:space-between;padding:3px 0;border-bottom:1px solid var(--border);}
.pricing-summary .ps-row:last-child{border-bottom:none;font-weight:600;color:var(--text);padding-top:6px;}
.ps-val{font-family:'Rajdhani',sans-serif;font-size:13px;font-weight:600;color:var(--text);}
#btn-back{flex:1;padding:10px;background:var(--panel2);border:1px solid var(--border-md);border-radius:6px;color:var(--text-sub);font-family:'DM Sans',sans-serif;font-size:13px;cursor:pointer;}
#btn-next,#btn-download{flex:2;padding:10px;background:var(--orange);border:none;border-radius:6px;color:#fff;font-family:'Rajdhani',sans-serif;font-size:14px;font-weight:700;cursor:pointer;}
#btn-view-html{flex:1;padding:10px;background:var(--panel2);border:1px solid var(--border-md);border-radius:6px;color:var(--text-sub);font-family:'DM Sans',sans-serif;font-size:12px;cursor:pointer;}

/* ── TOOLBAR BUTTONS (changelog, seller card, sign out) ── */
.battlecard-btn{display:flex;align-items:center;gap:7px;padding:5px 14px;border-radius:20px;border:1px solid var(--border-md);background:transparent;color:var(--text-sub);font-family:'DM Sans',sans-serif;font-size:12px;font-weight:600;cursor:pointer;transition:all .15s;text-decoration:none;}
.battlecard-btn:hover{border-color:var(--accent);color:var(--accent);}
.battlecard-btn svg{width:13px;height:13px;flex-shrink:0;}

/* ── STRATEGIC DISCOUNT APPROVAL MODAL ── */
.disc-modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:2000;display:none;align-items:center;justify-content:center;}
.disc-modal-bg.open{display:flex;}
.disc-modal{background:var(--panel);border:1px solid var(--border-md);border-radius:var(--r);width:420px;max-width:92vw;overflow:hidden;}
.disc-modal-header{padding:20px 22px 14px;border-bottom:1px solid var(--border);}
.disc-modal-header h3{font-size:16px;font-weight:700;color:var(--text);}
.disc-modal-body{padding:18px 22px;}
.disc-modal-body p{font-size:13px;color:var(--text-sub);line-height:1.6;margin-bottom:14px;}
.disc-modal-warning{background:var(--orange-bg);border:1px solid var(--orange-bd);border-radius:var(--r-sm);padding:12px 16px;}
.disc-modal-warning-title{font-size:9px;font-weight:700;letter-spacing:.14em;color:var(--orange);margin-bottom:6px;}
.disc-modal-warning-text{font-size:12px;color:var(--text-sub);line-height:1.6;}
.disc-modal-footer{padding:14px 22px 20px;display:flex;gap:10px;justify-content:flex-end;border-top:1px solid var(--border);}
.disc-btn-confirm{background:var(--orange);color:#fff;border:none;padding:10px 18px;border-radius:var(--r-sm);font-size:13px;font-weight:700;cursor:pointer;transition:background .15s;}
.disc-btn-confirm:hover{filter:brightness(1.15);}
.btn{padding:10px 18px;border:none;border-radius:var(--r-sm);font-family:'DM Sans',sans-serif;font-size:13px;font-weight:600;cursor:pointer;transition:all .15s;}
.btn-secondary{background:var(--panel2);color:var(--text-sub);border:1px solid var(--border-md);}
.btn-secondary:hover{border-color:var(--accent);color:var(--accent);}

/* ── CHANGELOG MODAL ── */
.cl-modal-bg{position:fixed;inset:0;background:rgba(0,0,0,.75);z-index:3000;display:none;align-items:center;justify-content:center;}
.cl-modal-bg.open{display:flex;}
.cl-modal{background:var(--panel);border:1px solid var(--border-md);border-radius:var(--r);width:520px;max-width:94vw;max-height:88vh;display:flex;flex-direction:column;overflow:hidden;}
.cl-modal-header{padding:18px 22px 14px;border-bottom:1px solid var(--border);display:flex;justify-content:space-between;align-items:center;flex-shrink:0;}
.cl-modal-header h3{font-size:15px;font-weight:700;}
.cl-modal-close{background:none;border:none;color:var(--text-sub);font-size:20px;cursor:pointer;line-height:1;}
.cl-modal-body{padding:18px 22px;overflow-y:auto;flex:1;min-height:0;}
.cl-version{margin-bottom:20px;}
.cl-version:last-child{margin-bottom:0;}
.cl-ver-label{font-size:10px;font-weight:700;letter-spacing:.15em;text-transform:uppercase;color:var(--accent);margin-bottom:3px;}
.cl-unreleased .cl-ver-label{color:var(--orange);}
.cl-ver-date{font-size:11px;color:var(--text-sub);margin-bottom:10px;}
.cl-item{font-size:12.5px;color:var(--text);padding:5px 0 5px 16px;position:relative;border-bottom:1px solid var(--border);line-height:1.45;}
.cl-item:last-child{border-bottom:none;}
.cl-item::before{content:"·";position:absolute;left:4px;color:var(--accent);}
.cl-item b{color:var(--text);font-weight:600;}
.cl-item span{color:var(--text-sub);}
