/* RajKhaleel Decision Lab — calculator UI v2 (dark-dominant). Depends on tokens + frameworks.
   Calc block sits in a dark section: white input panel (legible) + black results panel + yellow metrics. */

.rk-calc{display:grid;gap:var(--rk-gap);align-items:start;grid-template-columns:minmax(0,1fr)}
.rk-calc>*{min-width:0}
@media(min-width:980px){.rk-calc{grid-template-columns:minmax(0,1fr) minmax(0,1.15fr);align-items:stretch}}

/* Calculator intro (visible heading + trust line above the tool) */
.rk-calcintro{margin:0 0 clamp(1.25rem,2.5vw,2rem);max-width:70ch}
.rk-calcintro__t{font-family:var(--rk-font-display);font-size:clamp(1.4rem,2.4vw,1.9rem);color:var(--rk-ink);margin:0 0 .5rem;line-height:1.15}
.rk-calcintro__s{font-size:1rem;color:var(--rk-body);line-height:1.6;margin:0}
.rk-trustline{display:flex;flex-wrap:wrap;align-items:center;gap:.5rem .9rem;margin-top:1.1rem;padding:.7rem 1rem;border:1px solid var(--rk-hair-light);border-left:3px solid var(--rk-yellow);border-radius:var(--rk-radius-sm);background:#fff}
.rk-trustline__k{font-family:var(--rk-font-sans);text-transform:uppercase;letter-spacing:.1em;font-size:.68rem;font-weight:800;color:var(--rk-ink)}
.rk-trustline__a{font-size:.8rem;color:var(--rk-gold-text-light);font-weight:700}
.rk-trustline__r{font-size:.78rem;color:var(--rk-body)}

/* Advanced / optional settings — progressive disclosure inside the form */
.rk-advset{grid-column:1/-1;border:1px solid var(--rk-hair-light);border-radius:var(--rk-radius-sm);background:#fbfbfb;padding:0 1rem}
.rk-advset>summary{cursor:pointer;font-weight:700;color:var(--rk-ink);font-size:.9rem;padding:.85rem .2rem;list-style:none;display:flex;align-items:center;gap:.5rem}
.rk-advset>summary::-webkit-details-marker{display:none}
.rk-advset>summary::before{content:"+";color:var(--rk-gold-text-light);font-weight:800;font-size:1.1rem}
.rk-advset[open]>summary::before{content:"–"}
.rk-advset__grid{display:grid;gap:1rem;padding:.4rem 0 1.1rem}
@media(min-width:560px){.rk-advset__grid{grid-template-columns:1fr 1fr}}
.rk-advset__note{grid-column:1/-1;font-size:.8rem;color:var(--rk-body);margin:.2rem 0 0;line-height:1.5}

/* How to use this calculator — one compact editorial framework (all 8 pages) */
.rk-howto{margin:0 0 clamp(1.5rem,3vw,2.25rem);border:1px solid var(--rk-hair-light);border-left:3px solid var(--rk-yellow);border-radius:var(--rk-radius);background:#fff;padding:clamp(1.1rem,2vw,1.4rem)}
.rk-howto__k{font-family:var(--rk-font-sans);text-transform:uppercase;letter-spacing:.12em;font-size:.7rem;font-weight:800;color:var(--rk-gold-text-light);margin:0 0 1rem}
.rk-howto__list{list-style:none;margin:0;padding:0;display:grid;gap:1.1rem}
@media(min-width:760px){.rk-howto__list{grid-template-columns:repeat(4,1fr);gap:1.6rem}}
.rk-howto__list li{display:flex;gap:.7rem;align-items:flex-start}
.rk-howto__n{font-family:var(--rk-font-display);color:var(--rk-gold-text-light);font-weight:700;font-size:1.05rem;flex:0 0 auto;line-height:1.2}
.rk-howto__b{display:flex;flex-direction:column;gap:.15rem;min-width:0}
.rk-howto__t{font-family:var(--rk-font-display);color:var(--rk-ink);font-size:1rem;line-height:1.2}
.rk-howto__s{font-size:.84rem;color:var(--rk-body);line-height:1.45}

/* Cross-link between complementary calculators */
.rk-calclink{display:flex;flex-wrap:wrap;gap:.5rem 1rem;align-items:baseline;margin-top:1.25rem;padding:1rem 1.15rem;border:1px solid var(--rk-hair-light);border-radius:var(--rk-radius-sm);background:var(--rk-neutral)}
.rk-calclink__k{font-weight:700;color:var(--rk-ink);font-size:.95rem}

/* Input panel — clean white for form legibility */
.rk-calc__panel{background:#fff;border:1px solid var(--rk-hair-light);border-radius:var(--rk-radius);padding:clamp(1.25rem,2vw,1.75rem)}
.rk-calc__panel h2{font-size:1.1rem;margin:0 0 1rem;color:var(--rk-ink)}
.rk-calc-form{display:grid;gap:1rem}
@media(min-width:560px){.rk-calc-form--2{grid-template-columns:1fr 1fr}}
.rk-cfield{display:flex;flex-direction:column;gap:.35rem}
.rk-cfield--full{grid-column:1/-1}
.rk-cfield label{font-weight:600;color:var(--rk-ink);font-size:.88rem;line-height:1.3}
/* Reserve a consistent 2-line label region so a wrapping label (or a label + hint) never pushes its own
   input below the neighbouring field's input — neighbouring controls in a row stay aligned (§4). */
@media(min-width:560px){.rk-calc-form--2 .rk-cfield>label:first-child{min-height:2.55em;display:block}}
.rk-cfield .rk-hint{font-weight:400;color:var(--rk-body);font-size:.78rem}
.rk-cfield input,.rk-cfield select{font:inherit;color:var(--rk-ink);background:#fff;border:1px solid #cccccc;border-radius:var(--rk-radius-sm);padding:.6rem .7rem;min-height:44px;width:100%}
.rk-cfield input:focus,.rk-cfield select:focus{outline:none;border-color:var(--rk-yellow);box-shadow:0 0 0 3px rgba(255,200,0,.28)}
.rk-cfield .rk-input-affix{position:relative;display:flex;align-items:center}
.rk-cfield .rk-input-affix input{padding-right:2.6rem}
.rk-cfield .rk-affix{position:absolute;right:.7rem;color:var(--rk-body);font-size:.82rem;font-weight:600;pointer-events:none}
/* Results-panel return-view selector (Property ROI) — a result view, shown at the top of the results */
.rk-viewtabs{display:inline-flex;flex-wrap:wrap;gap:.3rem;margin:0 0 1.1rem;padding:.25rem;background:rgba(255,255,255,.06);border:1px solid var(--rk-hair-dark);border-radius:999px}
.rk-viewtab{appearance:none;border:0;background:transparent;color:var(--rk-on-dark);font:inherit;font-size:.82rem;font-weight:700;padding:.5rem .95rem;border-radius:999px;cursor:pointer;min-height:38px;transition:background var(--rk-transition),color var(--rk-transition)}
.rk-viewtab:hover{color:#fff}
.rk-viewtab.is-active{background:var(--rk-yellow);color:#000}
@media(max-width:520px){.rk-viewtabs{display:flex;width:100%}.rk-viewtab{flex:1 1 auto;text-align:center;padding:.5rem .5rem}}
.rk-fieldset{border:1px solid var(--rk-hair-light);border-radius:var(--rk-radius-sm);padding:.85rem 1rem;grid-column:1/-1}
.rk-fieldset legend{font-weight:600;font-size:.85rem;padding:0 .35rem;color:var(--rk-ink)}
.rk-fieldset .rk-radio{margin:.35rem 0;font-size:.9rem}

/* Results — black panel with yellow-accented metrics */
.rk-calc__results{background:#000;color:#fff;border-radius:var(--rk-radius);padding:clamp(1.25rem,2vw,1.75rem);min-height:200px;border:1px solid var(--rk-hair-dark)}
.rk-calc__results h2{color:#fff;font-size:1.1rem;margin:0 0 1rem}
.rk-result__grid{display:grid;gap:.75rem;grid-template-columns:repeat(2,1fr)}
@media(min-width:1100px){.rk-result__grid{grid-template-columns:repeat(3,1fr)}}
.rk-metric{background:var(--rk-charcoal-2);border:1px solid var(--rk-hair-dark);border-radius:var(--rk-radius-sm);padding:.85rem .9rem;display:flex;flex-direction:column;gap:.15rem}
.rk-metric__v{font-family:var(--rk-font-display);font-size:1.2rem;color:#fff;line-height:1.15}
.rk-metric__l{font-size:.72rem;letter-spacing:.04em;text-transform:uppercase;color:var(--rk-on-dark-dim)}
.rk-metric--hi{border-color:var(--rk-yellow)}
.rk-metric--hi .rk-metric__v{color:var(--rk-yellow)}

/* Results table on black */
.rk-calc__results .rk-matrix-wrap{border-color:var(--rk-hair-dark);background:transparent}
.rk-calc__results .rk-matrix{color:var(--rk-on-dark);min-width:520px}
.rk-calc__results .rk-matrix caption{color:var(--rk-on-dark-dim);font-weight:500;font-size:.82rem}
.rk-calc__results .rk-matrix thead th{background:#151515;color:#fff}
.rk-calc__results .rk-matrix tbody th{background:#111;color:#fff}
.rk-calc__results .rk-matrix th,.rk-calc__results .rk-matrix td{border-top-color:var(--rk-hair-dark)}
.rk-calc__results .rk-matrix tbody tr:hover td{background:rgba(255,255,255,.03)}
.rk-calc__results .rk-note{color:var(--rk-on-dark-dim)}
.rk-tag-illus{display:inline-block;font-size:.66rem;text-transform:uppercase;letter-spacing:.08em;color:#000;background:var(--rk-yellow);border-radius:3px;padding:.05rem .3rem;margin-left:.35rem;vertical-align:middle}

/* Assumptions / sources / disclaimer footer (white section) */
.rk-calc-foot{display:grid;gap:1.25rem}
@media(min-width:820px){.rk-calc-foot{grid-template-columns:1fr 1fr}}
.rk-calc-foot__box{background:#fff;border:1px solid var(--rk-hair-light);border-radius:var(--rk-radius);padding:1.25rem}
.rk-calc-foot__box h3{font-size:1rem;margin:0 0 .6rem;color:var(--rk-ink)}
.rk-calc-foot__box ul{margin:0;padding-left:1.1rem;font-size:.9rem;color:var(--rk-body)}
.rk-calc-foot__box li{margin:.3rem 0}
.rk-reviewed{display:inline-block;font-size:.78rem;color:var(--rk-body);background:var(--rk-neutral);border:1px solid var(--rk-hair-light);border-radius:999px;padding:.3rem .8rem;margin-top:.5rem}
.rk-srcgroup__k{font-family:var(--rk-font-sans);text-transform:uppercase;letter-spacing:.12em;font-size:.66rem;font-weight:800;color:var(--rk-gold-text-light);margin:0 0 .5rem}
.rk-srclist{list-style:none;margin:0;padding:0;display:grid;gap:.9rem}
.rk-srclist li{display:flex;flex-direction:column;gap:.2rem}
.rk-src__t{font-family:var(--rk-font-display);font-size:1rem;color:var(--rk-ink)}
.rk-src__d{font-size:.84rem;color:var(--rk-body);line-height:1.45}
.rk-srclist .rk-flink{margin-top:.15rem;font-size:.9rem}
.rk-disclaimer{font-size:.82rem;color:var(--rk-body);border-left:3px solid var(--rk-yellow);padding:.4rem 0 .4rem 1rem;margin:1.5rem 0}
/* Collapsed methodology fold (light section, all calculators) */
.rk-methodfold{border-top:1px solid var(--rk-divider-samelight);margin-top:.2rem}
.rk-methodfold>summary{cursor:pointer;list-style:none;padding:1rem 0;font-weight:700;color:var(--rk-ink);font-size:.95rem;display:flex;align-items:center;gap:.55rem}
.rk-methodfold>summary::-webkit-details-marker{display:none}
.rk-methodfold>summary::before{content:"+";color:var(--rk-gold-text-light);font-weight:800;font-size:1.2rem;line-height:1}
.rk-methodfold[open]>summary::before{content:"\2013"}
.rk-methodfold>summary:focus-visible{outline:3px solid var(--rk-yellow);outline-offset:2px}
.rk-methodfold .rk-calc-foot{padding-bottom:1.2rem}

/* Result outcome hero + supporting blocks (inside the black results panel) */
.rk-outcome{border-radius:var(--rk-radius);padding:clamp(1.1rem,2vw,1.5rem);margin:0 0 1.1rem;border:1px solid var(--rk-hair-dark);background:var(--rk-charcoal-2)}
.rk-outcome--primary{border-color:var(--rk-yellow);background:linear-gradient(180deg,rgba(255,200,0,.10),rgba(255,200,0,.02))}
.rk-outcome--soft{background:rgba(255,255,255,.03)}
.rk-outcome__k{font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--rk-on-dark-dim);margin:0 0 .35rem;font-weight:700}
.rk-outcome__v{font-family:var(--rk-font-display);font-size:clamp(1.5rem,3.2vw,2.15rem);line-height:1.12;color:#fff;margin:0}
.rk-outcome--primary .rk-outcome__v{color:var(--rk-yellow)}
.rk-outcome__v--mid{font-size:clamp(1.4rem,2.6vw,1.8rem)}
.rk-outcome__u{font-family:var(--rk-font-sans);font-size:.9rem;font-weight:600;color:var(--rk-on-dark-dim);letter-spacing:normal}
.rk-outcome__s{font-size:.92rem;line-height:1.55;color:var(--rk-on-dark);margin:.6rem 0 0}
.rk-outcome__s strong{color:#fff}
.rk-rsubhead{font-family:var(--rk-font-sans);text-transform:uppercase;letter-spacing:.12em;font-size:.7rem;font-weight:800;color:var(--rk-yellow);margin:1.6rem 0 .2rem}
.rk-reportcta{margin:1.3rem 0;padding:clamp(1.1rem,2vw,1.4rem);border-radius:var(--rk-radius);border:1px solid var(--rk-yellow);background:rgba(255,200,0,.06)}
.rk-reportcta__k{font-family:var(--rk-font-display);font-size:1.1rem;color:#fff;margin:0 0 .3rem}
.rk-reportcta__s{font-size:.88rem;color:var(--rk-on-dark);margin:0 0 1rem;line-height:1.5}
.rk-warn{margin:1.3rem 0;padding:.4rem 0 .4rem 1rem;border-left:3px solid var(--rk-yellow)}
.rk-warn__k{font-family:var(--rk-font-sans);text-transform:uppercase;letter-spacing:.08em;font-size:.74rem;font-weight:800;color:#fff;margin:0 0 .4rem}
.rk-warn p{font-size:.9rem;color:var(--rk-on-dark);line-height:1.55;margin:0 0 .6rem}
.rk-warn .rk-flink{color:var(--rk-yellow);font-weight:600;text-decoration:none}
.rk-warn .rk-flink::after{content:" →"}
.rk-warn .rk-flink:hover{text-decoration:underline}
/* Decision-reason + must-verify lists inside the results panel */
.rk-reasons{margin:.5rem 0 1rem;padding-left:1.1rem;list-style:none}
.rk-reasons li{position:relative;font-size:.9rem;color:var(--rk-on-dark);line-height:1.5;margin:0 0 .4rem;padding-left:.9rem}
.rk-reasons li::before{content:"";position:absolute;left:0;top:.55em;width:.4rem;height:.4rem;border-radius:50%;background:var(--rk-yellow)}
.rk-reasons li b{color:#fff;font-weight:700}
.rk-reasons--verify li::before{border-radius:1px;background:#ff8c42}

/* Progressive-disclosure collapsibles inside the black results panel */
.rk-rdetails{margin:1rem 0;border:1px solid var(--rk-hair-dark);border-radius:var(--rk-radius-sm);background:rgba(255,255,255,.02)}
.rk-rdetails>summary{cursor:pointer;list-style:none;padding:.9rem 1rem;font-weight:700;color:#fff;font-size:.9rem;display:flex;align-items:center;gap:.55rem}
.rk-rdetails>summary::-webkit-details-marker{display:none}
.rk-rdetails>summary::before{content:"+";color:var(--rk-yellow);font-weight:800;font-size:1.15rem;line-height:1}
.rk-rdetails[open]>summary::before{content:"\2013"}
.rk-rdetails[open]>summary{border-bottom:1px solid var(--rk-hair-dark)}
.rk-rdetails>summary:focus-visible{outline:3px solid var(--rk-yellow);outline-offset:-3px}
.rk-rdetails__body{padding:.4rem 1rem 1rem}
.rk-rsub2{font-size:.72rem;font-weight:700;color:var(--rk-on-dark);margin:1rem 0 .1rem;text-transform:uppercase;letter-spacing:.07em}

/* Mortgage journey milestone timeline */
.rk-mjourney{display:grid;grid-auto-flow:column;grid-auto-columns:minmax(155px,1fr);gap:.6rem;overflow-x:auto;padding-bottom:.5rem}
@media(max-width:640px){.rk-mjourney{grid-auto-flow:row;grid-auto-columns:auto}}
.rk-mstone{background:var(--rk-charcoal-2);border:1px solid var(--rk-hair-dark);border-radius:var(--rk-radius-sm);padding:.8rem .85rem;display:grid;grid-template-columns:1fr auto;gap:.18rem .5rem;align-content:start}
.rk-mstone__y{grid-column:1/-1;font-family:var(--rk-font-display);color:var(--rk-yellow);font-size:.98rem;margin-bottom:.35rem;border-bottom:1px solid var(--rk-hair-dark);padding-bottom:.35rem}
.rk-mstone__l{color:var(--rk-on-dark-dim);font-size:.72rem}
.rk-mstone__v{color:#fff;font-size:.78rem;text-align:right;font-variant-numeric:tabular-nums}
.rk-mstone__v--eq{color:var(--rk-yellow)}

/* One mortgage chart: balance ↓ vs equity ↑ */
.rk-chart{margin:.3rem 0 0}
.rk-chart svg{width:100%;height:auto;display:block;overflow:visible}
.rk-chart__axis{stroke:var(--rk-hair-dark);stroke-width:1}
.rk-chart__bal{fill:none;stroke:#8f8f8f;stroke-width:2.5;stroke-linejoin:round}
.rk-chart__eq{fill:none;stroke:var(--rk-yellow);stroke-width:2.5;stroke-linejoin:round}
.rk-chart__x{display:flex;justify-content:space-between;color:var(--rk-on-dark-dim);font-size:.72rem;margin-top:.25rem}
.rk-chart__legend{display:flex;flex-wrap:wrap;gap:1.2rem;margin-top:.55rem}
.rk-chart__key{font-size:.76rem;color:var(--rk-on-dark);display:inline-flex;align-items:center;gap:.4rem}
.rk-chart__key--bal::before{content:"";width:16px;height:3px;background:#8f8f8f;display:inline-block;border-radius:2px}
.rk-chart__key--eq::before{content:"";width:16px;height:3px;background:var(--rk-yellow);display:inline-block;border-radius:2px}

/* ROI (and comparator) mode toggle — segmented pills */
.rk-calc-modes{display:flex;flex-wrap:wrap;gap:.4rem;grid-column:1/-1;background:var(--rk-neutral);border:1px solid var(--rk-hair-light);border-radius:999px;padding:.3rem}
.rk-calc-modes legend{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.rk-calc-modes label{flex:1 1 auto;display:flex;align-items:center;justify-content:center;text-align:center;padding:.55rem .8rem;border-radius:999px;font-size:.85rem;font-weight:600;color:var(--rk-body);cursor:pointer;min-height:40px;white-space:nowrap}
.rk-calc-modes input{position:absolute;opacity:0;width:0;height:0}
.rk-calc-modes input:checked+span,.rk-calc-modes label:has(input:checked){background:#000;color:#fff}
.rk-calc-modes label:has(input:focus-visible){outline:3px solid var(--rk-yellow);outline-offset:2px}

/* Branded PDF report gate (dark band) */
.rk-reportgate__inner{display:grid;gap:clamp(1.5rem,3vw,2.5rem);align-items:center}
@media(min-width:900px){.rk-reportgate__inner{grid-template-columns:1fr 1fr}}
.rk-reportgate__copy p{color:var(--rk-on-dark);max-width:52ch}
.rk-reportgate__form{background:var(--rk-charcoal-2);border:1px solid var(--rk-hair-dark);border-radius:var(--rk-radius);padding:clamp(1.25rem,2.5vw,1.75rem);display:flex;flex-direction:column;gap:.9rem}
.rk-reportgate__done{background:var(--rk-charcoal-2);border:1px solid var(--rk-yellow);border-radius:var(--rk-radius);padding:clamp(1.25rem,2.5vw,1.75rem)}
.rk-reportgate__done-t{font-family:var(--rk-font-display);font-size:1.25rem;color:#fff;margin:0 0 1rem}

/* Print: do not let a raw print substitute for the branded report */
.rk-print-only{display:none}
@media print{
  .rk-masthead,.rk-footer,.rk-prefooter,.rk-wa-fab,.rk-modal,.rk-calc__panel,.rk-reportgate,.rk-calc__results .rk-matrix-wrap,.rk-calc-foot,.rk-hero__actions{display:none!important}
  .rk-print-only{display:block!important;padding:24px;border:2px solid #000;border-radius:8px}
  body{background:#fff!important;color:#000!important}
}

/* ---- Decision Lab FROZEN global workspace (DECISION_LAB_GLOBAL_CALCULATOR_RULES_FINAL) ---- */
/* Desktop: a contained working area with substantially MORE visible height before internal scroll begins,
   so the calculator reads as the main working area of the page — core inputs on the left and the primary
   outcome + KPI cards on the right stay visible; only advanced/detailed content scrolls internally.
   Left and right share the same max-height (the grid stretches both columns to one balanced workspace).
   Tablet / mobile (<980px): normal vertical page flow — NO nested scroll. */
@media(min-width:980px){
  .rk-calc__panel,.rk-calc__results{max-height:clamp(820px,86vh,900px);overflow-y:auto}
  .rk-calc__panel{scrollbar-gutter:stable}
}
@media(min-width:1180px){
  .rk-calc__panel,.rk-calc__results{max-height:clamp(880px,88vh,980px)}
}
/* Subtle premium scrollbars for the two panels — visible enough to signal more content, never dominant.
   Scroll chaining to the page is left at the browser default (no trap: reaching an edge scrolls the page). */
.rk-calc__panel,.rk-calc__results{scrollbar-width:thin}
.rk-calc__panel{scrollbar-color:rgba(20,20,20,.26) transparent}
.rk-calc__results{scrollbar-color:rgba(255,255,255,.28) transparent}
.rk-calc__panel::-webkit-scrollbar,.rk-calc__results::-webkit-scrollbar{width:9px}
.rk-calc__panel::-webkit-scrollbar-track,.rk-calc__results::-webkit-scrollbar-track{background:transparent}
.rk-calc__panel::-webkit-scrollbar-thumb{background:rgba(20,20,20,.20);border-radius:9px;border:3px solid transparent;background-clip:content-box}
.rk-calc__results::-webkit-scrollbar-thumb{background:rgba(255,255,255,.22);border-radius:9px;border:3px solid transparent;background-clip:content-box}
.rk-calc__panel:hover::-webkit-scrollbar-thumb{background:rgba(20,20,20,.32);background-clip:content-box}
.rk-calc__results:hover::-webkit-scrollbar-thumb{background:rgba(255,255,255,.34);background-clip:content-box}
/* Conditional-visibility: .rk-cfield uses display:flex, which would defeat the [hidden] attribute. */
.rk-calc [hidden],.rk-cfield[hidden],.rk-advset[hidden]{display:none!important}
/* Your-situation indicator lists (inside the black results panel) */
.rk-sitwrap{display:grid;gap:.2rem;margin-top:.3rem}
.rk-factorlist{list-style:none;margin:.1rem 0 .7rem;padding:0;display:grid;gap:.3rem}
.rk-factorlist li{position:relative;padding-left:1rem;font-size:.86rem;color:var(--rk-on-dark);line-height:1.4}
.rk-factorlist li::before{content:"";position:absolute;left:0;top:.55em;width:.4rem;height:.4rem;background:var(--rk-yellow);border-radius:50%}
