/* Rytvae — shared styles for the loan calculators (Home Loan EMI, Balance Transfer, Loan Eligibility).
   Uses only the design tokens defined in css/styles.css, so the light section variant applies automatically. */

/* tool switcher under the hero */
.lc-switch { display:flex; flex-wrap:wrap; gap:.45rem; justify-content:center; margin:0 auto 1.6rem; }
.lc-switch a { display:inline-flex; align-items:center; gap:.45rem; white-space:nowrap; padding:.5rem .95rem; border-radius:999px; border:1px solid var(--line); color:var(--silver); font-weight:600; font-size:.82rem; transition:.25s var(--ease); }
.lc-switch a:hover { border-color:var(--red); color:var(--white); }
.lc-switch a.is-on { background:var(--grad-red); color:#fff; border-color:transparent; }
.lc-switch a i { font-size:.85em; }

/* layout — mirrors the DLOD calculator */
.lc-wrap { display:grid; grid-template-columns:minmax(300px,370px) 1fr; gap:1.6rem; align-items:start; }
@media (max-width:900px){ .lc-wrap { grid-template-columns:1fr; } .lc-inputs { position:static !important; } }
.lc-wrap > div { min-width:0; }
.lc-inputs { background:var(--graphite); border:1px solid var(--line); border-radius:var(--radius); padding:1.5rem; position:sticky; top:1.25rem; box-shadow:var(--shadow); }
.lc-card { background:var(--graphite); border:1px solid var(--line); border-radius:var(--radius); padding:1.4rem 1.45rem; min-width:0; }
.lc-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(190px,1fr)); gap:.9rem; }
.lc-grid--2 { display:grid; grid-template-columns:repeat(auto-fit,minmax(280px,1fr)); gap:1.2rem; }
.lc-stack > * + * { margin-top:1.4rem; }
.lc-k { font-size:.72rem; font-weight:700; letter-spacing:.09em; text-transform:uppercase; color:var(--muted); margin-bottom:.45rem; }
.lc-v { font-family:var(--f-data); font-weight:700; font-size:1.4rem; color:var(--white); line-height:1.15; }
.lc-v--red { color:var(--red); }
.lc-v--xl { font-size:clamp(1.9rem,4vw,2.6rem); }
.lc-note { font-size:.74rem; color:var(--faint); margin-top:.35rem; line-height:1.5; }
.lc-p { color:var(--muted); font-size:.86rem; line-height:1.6; max-width:66ch; margin-bottom:1rem; }
.lc-h { font-family:var(--f-display); font-size:1.3rem; color:var(--white); font-weight:600; margin-bottom:.8rem; }
.lc-h--sm { font-size:1.1rem; }
.lc-head { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center; gap:.7rem; margin-bottom:1rem; }
.lc-head .lc-h { margin:0; }

@media (max-width:520px){
  .lc-grid { grid-template-columns:1fr 1fr; gap:.6rem; }
  .lc-grid > .lc-card { padding:1rem; }
  .lc-grid .lc-v { font-size:1.12rem; }
  .lc-inputs, .lc-card { padding:1.15rem; }
}

/* pills, toggles, inputs */
.lc-pill { white-space:nowrap; padding:.5rem .95rem; border-radius:999px; border:1px solid var(--line); background:transparent; color:var(--silver); font-weight:600; font-size:.82rem; cursor:pointer; transition:.25s var(--ease); font-family:var(--f-body); }
.lc-pill:hover { border-color:var(--red); color:var(--white); }
.lc-pill.is-on { background:var(--grad-red); color:#fff; border-color:transparent; }
.lc-pill:disabled { opacity:.45; cursor:not-allowed; }
.lc-row { display:flex; flex-wrap:wrap; gap:.45rem; }
.lc-mini { display:inline-flex; gap:.3rem; background:var(--char); border:1px solid var(--line); border-radius:999px; padding:.25rem; flex-wrap:wrap; }
.lc-mini button { padding:.4rem .8rem; border-radius:999px; border:0; background:transparent; color:var(--muted); font-weight:600; font-size:.76rem; cursor:pointer; font-family:var(--f-body); }
.lc-mini button.is-on { background:var(--white); color:var(--ink); }
.lc-input { width:100%; padding:.65rem .8rem; border:1px solid var(--line); border-radius:var(--radius-sm); background:var(--char); color:var(--white); font-family:var(--f-data); font-weight:600; font-size:.95rem; }
.lc-select { width:100%; padding:.6rem .75rem; border-radius:var(--radius-sm); font-size:.9rem; font-family:var(--f-body); font-weight:600; }
.lc-select--sm { width:auto; padding:.45rem .7rem; border-radius:999px; font-size:.8rem; }
.lc-label { display:block; font-size:.8rem; color:var(--muted); margin-bottom:.3rem; }
.lc-label--strong { font-weight:600; color:var(--silver); font-size:.86rem; margin-bottom:.5rem; }
.lc-field { margin-bottom:1.35rem; }
.lc-field__top { display:flex; justify-content:space-between; align-items:flex-end; gap:.6rem; margin-bottom:.5rem; }
.lc-field__top label { font-size:.86rem; font-weight:600; color:var(--silver); line-height:1.35; }
.lc-field__top .val { font-family:var(--f-data); font-weight:700; color:var(--white); font-size:1rem; white-space:nowrap; }
.lc-field input[type="range"] { margin-top:.6rem; }
.lc-2col { display:grid; grid-template-columns:1fr 1fr; gap:.5rem; }
.lc-adv { border-top:1px dashed var(--line); padding-top:1.1rem; }
.lc-tile { background:var(--char); border-radius:12px; padding:.9rem 1rem; min-width:0; }
.lc-tile .lc-v { font-size:1.05rem; }

/* tables */
.lc-table-wrap { overflow-x:auto; }
.lc-table { width:100%; border-collapse:collapse; }
.lc-table th { font-size:.7rem; font-weight:700; letter-spacing:.06em; text-transform:uppercase; color:var(--muted); padding:.6rem .5rem; border-bottom:1px solid var(--line); white-space:nowrap; text-align:right; }
.lc-table th:first-child, .lc-table td:first-child { text-align:left; }
.lc-table td { font-family:var(--f-data); font-size:.84rem; color:var(--silver); padding:.55rem .5rem; border-bottom:1px solid var(--graphite-2); text-align:right; white-space:nowrap; }
.lc-table td.k { font-family:var(--f-body); color:var(--silver); }
.lc-table td.hi, .lc-table th.hi { color:var(--white); font-weight:700; }
.lc-table td.int { color:var(--red); font-weight:600; }
.lc-table td.good { color:var(--white); font-weight:700; }
.lc-table tr.is-cur td { background:rgba(225,27,46,.07); }
.lc-table tr.is-best td { background:rgba(201,162,75,.14); }
.lc-table td.cell-cur { background:rgba(225,27,46,.12); color:var(--white); font-weight:700; box-shadow:inset 0 0 0 1px rgba(225,27,46,.45); }
.lc-table td.cell-na { color:var(--faint); }
.lc-scroll { max-height:440px; overflow-y:auto; }
.lc-pager { display:flex; justify-content:space-between; align-items:center; gap:1rem; margin-top:1rem; flex-wrap:wrap; }

/* charts */
.lc-chart { position:relative; height:260px; }
.lc-chart--tall { height:300px; }
.lc-legend { display:flex; flex-wrap:wrap; gap:.9rem; font-size:.76rem; color:var(--muted); margin-top:.6rem; }
.lc-legend span { display:inline-flex; align-items:center; gap:.4rem; }
.lc-legend i { width:12px; height:12px; border-radius:3px; display:inline-block; }

/* alerts, banners, verdicts */
.lc-alert { background:rgba(225,27,46,.08); border:1px solid rgba(225,27,46,.35); border-radius:var(--radius-sm); padding:.85rem .95rem; }
.lc-alert p { color:var(--red-bright); font-size:.8rem; font-weight:600; margin-bottom:.25rem; }
.lc-alert p:last-child { margin-bottom:0; }
.lc-banner { display:flex; gap:.9rem; align-items:flex-start; border-radius:var(--radius); padding:1.1rem 1.2rem; border:1px solid var(--line); background:var(--char); }
.lc-banner > i { font-size:1.15rem; margin-top:.15rem; color:var(--muted); }
.lc-banner strong { display:block; color:var(--white); font-size:1rem; margin-bottom:.2rem; }
.lc-banner p { color:var(--muted); font-size:.85rem; line-height:1.55; margin:0; }
.lc-banner--good { border-color:rgba(201,162,75,.55); background:rgba(201,162,75,.10); }
.lc-banner--good > i { color:var(--gold); }
.lc-banner--warn { border-color:var(--line); }
.lc-banner--bad { border-color:rgba(225,27,46,.4); background:rgba(225,27,46,.06); }
.lc-banner--bad > i { color:var(--red); }
.lc-banner--info > i { color:var(--red); }
.lc-badge { display:inline-flex; align-items:center; gap:.35rem; font-size:.68rem; font-weight:700; letter-spacing:.08em; text-transform:uppercase; padding:.3rem .6rem; border-radius:999px; background:var(--char); color:var(--silver); border:1px solid var(--line); }
.lc-badge--gold { background:rgba(201,162,75,.16); border-color:rgba(201,162,75,.5); color:var(--white); }
.lc-badge--red { background:var(--grad-red); border-color:transparent; color:#fff; }

/* income allocation bar */
.lc-bar { display:flex; height:16px; border-radius:999px; overflow:hidden; background:var(--graphite-2); gap:2px; }
.lc-bar span { display:block; height:100%; }
.lc-bar .b-exist { background:#5c5c65; }
.lc-bar .b-new { background:var(--red); }
.lc-bar .b-free { background:var(--gold); opacity:.55; }

/* worked-out steps */
.lc-steps { list-style:none; counter-reset:s; padding:0; margin:0; }
.lc-steps li { counter-increment:s; display:grid; grid-template-columns:34px 1fr auto; gap:.8rem; align-items:baseline; padding:.85rem 0; border-bottom:1px dashed var(--line); }
.lc-steps li:last-child { border-bottom:0; }
.lc-steps li::before { content:counter(s); width:26px; height:26px; border-radius:50%; display:grid; place-items:center; background:var(--char); border:1px solid var(--line); font-family:var(--f-data); font-size:.78rem; font-weight:700; color:var(--white); }
.lc-steps .t { color:var(--silver); font-size:.9rem; }
.lc-steps .t small { display:block; color:var(--faint); font-size:.76rem; margin-top:.2rem; }
.lc-steps .v { font-family:var(--f-data); font-weight:700; color:var(--white); white-space:nowrap; }
.lc-steps li.is-final .v { color:var(--red); font-size:1.15rem; }
@media (max-width:520px){ .lc-steps li { grid-template-columns:30px 1fr; } .lc-steps .v { grid-column:2; } }

/* editable rows (prepayments) */
.lc-edit { background:var(--char); border-radius:12px; padding:.8rem .85rem; }
.lc-edit__row { display:grid; grid-template-columns:110px minmax(120px,1fr) 150px 38px; gap:.6rem; align-items:end; }
.lc-edit__row + .lc-edit__row { margin-top:.7rem; padding-top:.7rem; border-top:1px dashed var(--line); }
.lc-edit__row .lc-input, .lc-edit__row .lc-select { padding:.55rem .65rem; font-size:.88rem; }
.lc-edit__x { width:38px; height:38px; border-radius:50%; border:1px solid var(--line); background:transparent; color:var(--muted); cursor:pointer; }
.lc-edit__x:hover { border-color:var(--red); color:var(--red); }
@media (max-width:560px){ .lc-edit__row { grid-template-columns:1fr 1fr; } }

/* FAQ */
.lc-faq { margin-top:2.5rem; }
.lc-faq details { background:var(--graphite); border:1px solid var(--line); border-radius:var(--radius); padding:0 1.3rem; }
.lc-faq details + details { margin-top:.7rem; }
.lc-faq summary { cursor:pointer; list-style:none; padding:1.05rem 0; font-weight:700; color:var(--white); display:flex; justify-content:space-between; gap:1rem; align-items:center; }
.lc-faq summary::-webkit-details-marker { display:none; }
.lc-faq summary::after { content:"+"; font-family:var(--f-data); color:var(--red); font-size:1.2rem; }
.lc-faq details[open] summary::after { content:"–"; }
.lc-faq details p { color:var(--muted); font-size:.9rem; line-height:1.7; padding-bottom:1.1rem; max-width:80ch; }

/* print-only report */
.lc-report { display:none; }
.lc-report h2 { font-family:var(--f-display); font-size:1.5rem; color:#14141a; margin-bottom:.2rem; }
.lc-report h3 { font-family:var(--f-display); font-size:1.1rem; color:#14141a; margin:1.4rem 0 .5rem; }
.lc-report .rp-brand { font-family:var(--f-data); font-size:.72rem; letter-spacing:.2em; text-transform:uppercase; color:#e11b2e; margin-bottom:.8rem; }
.lc-report .rp-meta { font-size:.8rem; color:#6d6d78; margin-bottom:1rem; }
.lc-report table { width:100%; border-collapse:collapse; font-size:.78rem; }
.lc-report th, .lc-report td { border-bottom:1px solid #dcd8d0; padding:.35rem .4rem; text-align:right; color:#14141a; }
.lc-report th:first-child, .lc-report td:first-child { text-align:left; }
.lc-report th { font-size:.68rem; text-transform:uppercase; letter-spacing:.05em; color:#6d6d78; }
.lc-report .rp-legal { margin-top:1.4rem; font-size:.7rem; color:#6d6d78; line-height:1.55; }
@media print {
  .loader,.nav,.drawer,.page-hero,.lc-switch,.lc-wrap,.lc-faq,.cta-band,.footer,.fab,.to-top,.mobile-cta,.lc-noprint { display:none !important; }
  .section--light { background:#fff !important; border:0 !important; padding:0 !important; }
  .section--light::before { display:none !important; }
  .lc-report { display:block !important; }
  .lc-report tr { break-inside:avoid; }
}