@import url("shared-page-base.css");

#loanCreditApp{max-width:660px;margin:auto;color:#2c4367}
#loanCreditApp *{box-sizing:border-box}
#loanCreditApp [hidden]{display:none!important}
#loanCreditApp .lc-card{padding:20px;border:1px solid #dbe5f4;border-radius:20px;background:#fff;box-shadow:0 12px 35px #213c6020}
#loanCreditApp .lc-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px;font-size:14px;font-weight:800;color:#41669b}
#loanCreditApp .lc-toolbar>div{display:flex;align-items:center;gap:7px}
#loanCreditApp .lc-toolbar label{font-size:11px;margin:0}
#lcCurrency{width:76px;height:36px;padding:5px;border:1px solid #cbdcf3;border-radius:8px;background:#f4f8ff;color:#385b92;font-size:14px;font-weight:800}
#loanCreditApp .lc-fields{display:grid;grid-template-columns:1fr 1fr;gap:14px}
#loanCreditApp .lc-field{min-width:0}
#loanCreditApp label{display:block;margin-bottom:8px;font-weight:800;font-size:16px;color:#526c92}
#loanCreditApp input{width:100%;min-width:0;height:60px;border:1px solid #ccdff5;border-radius:12px;background:#f6f9ff;font-size:26px;font-weight:850;color:#295ba5;text-align:center;padding:10px}
#loanCreditApp input[type=number]{appearance:textfield;-moz-appearance:textfield}
#loanCreditApp input::-webkit-inner-spin-button,#loanCreditApp input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}
#loanCreditApp button{min-height:46px;border-radius:10px;font-size:16px;font-weight:850;cursor:pointer;padding:10px 16px}
#loanCreditApp :is(input,select,button,summary):focus-visible{outline:3px solid #91baf1;outline-offset:3px}
#loanCreditApp .lc-terms{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-top:12px}
#loanCreditApp .lc-terms button{font-size:12px;padding:7px 2px;min-height:38px;border:1px solid #d2e0f5;background:#f4f8ff;color:#466ba6}
#loanCreditApp .lc-terms button[aria-pressed=true]{background:#2c65bf;color:white;border-color:#2c65bf}
#loanCreditApp details{margin-top:16px;border:1px solid #dce5f3;border-radius:12px;background:#f8faff;padding:13px}
#loanCreditApp summary{font-size:14px;font-weight:850;cursor:pointer;color:#466998}
#loanCreditApp details[open]>summary{margin-bottom:15px}
#loanCreditApp .lc-note{font-size:12px;line-height:1.7;color:#6b7f9e;margin:12px 0 0}
#lcCalculate{width:100%;margin-top:18px;background:linear-gradient(120deg,#377bdb,#2855a4);color:white;border:0;box-shadow:0 6px 15px #2458a52a}
#lcCalculate:hover{background:#24529f}
#lcResult{margin-top:20px;scroll-margin-top:16px}
#loanCreditApp .lc-hero{text-align:center;padding:26px 12px;background:linear-gradient(140deg,#eef5ff,#e0edff);border:1px solid #cddff9;border-radius:16px}
#loanCreditApp .lc-eyebrow{text-transform:uppercase;font-size:12px;font-weight:850;letter-spacing:.09em;color:#5178af}
#lcPayment{display:block;font-size:74px;font-weight:900;line-height:1.2;letter-spacing:-.045em;white-space:nowrap;color:#285eb1;margin:16px 0 8px;width:100%}
#lcSummary{font-size:14px;font-weight:750;color:#5574a0;margin:0}
#loanCreditApp .lc-stats{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:14px}
#loanCreditApp .lc-stats>div{min-width:0;padding:16px 12px;border:1px solid #dce7f6;border-radius:12px;background:#f6f9ff;text-align:center}
#loanCreditApp .lc-stats span{font-size:12px;color:#687f9e;display:block}
#loanCreditApp .lc-stats strong{font-size:23px;color:#325f9e;font-weight:850;display:block;margin-top:8px;overflow-wrap:anywhere}
#loanCreditApp .lc-cost{padding:16px 0 4px}
#loanCreditApp h3{font-size:17px;color:#48658f;text-align:center;margin:10px 0 14px}
#loanCreditApp .lc-bar{height:18px;display:flex;border-radius:20px;overflow:hidden;background:#e8effb}
#lcPrincipalBar{background:#2f6bc9}
#lcInterestBar{background:#98bdf6}
#loanCreditApp .lc-legend{display:flex;justify-content:space-between;gap:12px;font-size:12px;color:#526c94;margin-top:10px}
#loanCreditApp dl{margin:0;font-size:13px}
#loanCreditApp .lc-dl-row{display:flex;justify-content:space-between;gap:12px;padding:8px 0;border-bottom:1px solid #e3eaf5}
#loanCreditApp dt{color:#667f9f}
#loanCreditApp dd{margin:0;font-weight:800;color:#385e94;text-align:right;overflow-wrap:anywhere}
#loanCreditApp .lc-table-wrap{max-height:390px;overflow:auto;width:100%;overscroll-behavior:contain}
#loanCreditApp table{width:100%;border-collapse:collapse;font-size:12px;white-space:nowrap}
#loanCreditApp th,#loanCreditApp td{padding:10px 8px;text-align:right;border-bottom:1px solid #e0e8f5;color:#526c93}
#loanCreditApp th{position:sticky;top:0;background:#eaf2ff;color:#315d9f}
#lcReset{display:block;margin:20px auto 0;min-width:160px;background:#fff;border:1px solid #cbdcf4;color:#3263aa}
.lc-content-nav{padding:16px;border:1px solid #d5e3f5;border-radius:12px;background:#f5f9ff}
@media(max-width:440px){#loanCreditApp .lc-card{padding:14px}
#loanCreditApp .lc-fields{gap:12px}
#loanCreditApp label{font-size:14px;min-height:34px}
#loanCreditApp .lc-toolbar label{min-height:0}
#loanCreditApp input{font-size:23px;height:58px}
#loanCreditApp .lc-toolbar{font-size:12px}
#loanCreditApp .lc-toolbar>div{gap:4px}
#loanCreditApp .lc-stats strong{font-size:20px}
#loanCreditApp .lc-terms{grid-template-columns:repeat(3,1fr)}
#loanCreditApp .lc-terms button{min-height:42px}
}
#loanCreditApp input.lc-slider{display:block;width:100%;height:22px;min-height:0;margin:12px 0 0;padding:0;border:0;border-radius:0;background:transparent;accent-color:#326aca;cursor:pointer;appearance:auto}
#loanCreditApp .lc-slider-scale{display:flex;justify-content:space-between;color:#7c91ae;font-size:10px;font-weight:700}
#loanCreditApp .lc-charts{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:16px}
#loanCreditApp .lc-chart-card{min-width:0;padding:14px;border:1px solid #dce7f7;border-radius:14px;background:#f8faff;text-align:center}
#loanCreditApp .lc-chart-card h3{margin:0 0 12px;font-size:15px}
#loanCreditApp .lc-donut{position:relative;max-width:180px;margin:auto}
#loanCreditApp .lc-donut svg{display:block;width:100%;height:auto}
#loanCreditApp .lc-donut-label{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;pointer-events:none}
#loanCreditApp .lc-donut-label strong{font-size:28px;font-weight:900;color:#326aca}
#loanCreditApp .lc-donut-label span{font-size:12px;color:#7187aa}
#loanCreditApp .lc-chart-caption{font-size:12px;line-height:1.6;color:#6d83a6;margin:10px 0 0;overflow-wrap:anywhere}
#lcBalanceChart{display:block;width:100%;height:auto;margin:24px auto 0}
#loanCreditApp .lc-bar i{transition:width 1s ease}
@media(max-width:440px){#loanCreditApp .lc-charts{grid-template-columns:1fr}
#loanCreditApp .lc-donut{max-width:190px}
#lcBalanceChart{margin-top:10px}
}
@media(prefers-reduced-motion:reduce){#loanCreditApp .lc-bar i{transition:none}
}
#loanCreditApp .lc-card{padding:20px 24px}
#loanCreditApp .lc-toolbar{margin-bottom:16px}
#loanCreditApp .lc-fields{grid-template-columns:1fr;gap:14px}
#loanCreditApp .lc-field{padding:0 0 7px;border-bottom:1px solid #edf1f7}
#loanCreditApp .lc-input-row{display:flex;align-items:center;justify-content:space-between;gap:14px}
#loanCreditApp .lc-input-row label{flex:1;min-width:0;min-height:0;margin:0;font-size:15px;font-weight:750;line-height:1.4;color:#435879}
#loanCreditApp .lc-value-box{display:flex;align-items:center;gap:7px;width:210px;max-width:58%;height:48px;border:1px solid #d3dfef;border-radius:7px;background:#fff;padding:3px 10px;transition:border-color .15s,box-shadow .15s}
#loanCreditApp .lc-value-box:focus-within{border-color:#326aca;box-shadow:0 0 0 3px #326aca12}
#loanCreditApp .lc-value-box input{flex:1;width:0;min-width:0;height:40px;padding:0;background:transparent;border:0;border-radius:0;box-shadow:none;font-size:34px;font-weight:850;line-height:1.15;text-align:right;letter-spacing:-.035em;color:#214b89}
#loanCreditApp .lc-value-box input:focus-visible{outline:none}
#loanCreditApp .lc-money-symbol,#loanCreditApp .lc-input-unit{color:#7285a2;font-size:17px;font-weight:750;flex-shrink:0}
#loanCreditApp input.lc-slider{appearance:none;-webkit-appearance:none;height:22px;margin:8px 0 0;background:transparent;accent-color:#326aca;padding:0;border:0;box-shadow:none}
#loanCreditApp input.lc-slider::-webkit-slider-runnable-track{height:5px;border-radius:10px;background:linear-gradient(to right,#326aca 0 var(--fill,0%),#e1e8f3 var(--fill,0%) 100%)}
#loanCreditApp input.lc-slider::-webkit-slider-thumb{appearance:none;-webkit-appearance:none;width:18px;height:18px;margin-top:-6.5px;border:3px solid #326aca;border-radius:50%;background:white;box-shadow:0 1px 5px #244f9b25}
#loanCreditApp input.lc-slider::-moz-range-track{height:5px;background:#e1e8f3;border-radius:10px}
#loanCreditApp input.lc-slider::-moz-range-progress{height:5px;background:#326aca;border-radius:10px}
#loanCreditApp input.lc-slider::-moz-range-thumb{width:13px;height:13px;border:3px solid #326aca;border-radius:50%;background:white}
#loanCreditApp .lc-slider-scale{font-size:11px;color:#8795ab;margin-top:0;line-height:1.3}
#loanCreditApp .lc-terms{margin-top:9px}
#loanCreditApp .lc-options{padding:12px;margin-top:13px}
#loanCreditApp .lc-options[open] .lc-fields{gap:12px}
#loanCreditApp #lcCalculate{margin-top:14px}
#loanCreditApp .lc-note{margin-top:10px;font-size:11px}
@media(max-width:440px){#loanCreditApp .lc-card{padding:16px}
#loanCreditApp .lc-fields{gap:11px}
#loanCreditApp .lc-input-row{gap:8px}
#loanCreditApp .lc-input-row label{font-size:14px}
#loanCreditApp .lc-value-box{width:165px;height:45px;padding:3px 8px;gap:4px;max-width:59%}
#loanCreditApp .lc-value-box input{font-size:30px;height:37px}
#loanCreditApp .lc-money-symbol,#loanCreditApp .lc-input-unit{font-size:15px}
#loanCreditApp .lc-terms{grid-template-columns:repeat(6,1fr);gap:4px}
#loanCreditApp .lc-terms button{font-size:11px;min-height:38px}
#loanCreditApp .lc-toolbar{font-size:11px}
}
#loanCreditApp .lc-input-row label{font-size:21px;font-weight:850;line-height:1.3;color:#345780}
@media(max-width:440px){#loanCreditApp .lc-input-row label{font-size:19px}
}
#loanCreditApp .lc-chart-card{padding:20px 16px;background:radial-gradient(ellipse at top right,#ebecff,transparent 65%),linear-gradient(145deg,#f8fbff,#f0f6ff);border:1px solid #dce5fb;box-shadow:0 7px 20px #5268ac0c}
#loanCreditApp .lc-chart-card:first-child{background:radial-gradient(ellipse at bottom left,#fff0e7,transparent 65%),linear-gradient(145deg,#f8fbff,#f3f1ff)}
#loanCreditApp .lc-chart-card h3{font-size:17px;color:#405680;margin-bottom:16px}
#loanCreditApp .lc-donut{max-width:195px;filter:drop-shadow(0 5px 8px #536fbc16)}
#loanCreditApp .lc-donut-label strong{font-size:32px;color:#446bd0}
#loanCreditApp .lc-chart-key{display:flex;justify-content:center;gap:16px;margin:12px 0 0;font-size:12px;font-weight:750;color:#617497}
#loanCreditApp .lc-chart-key span{display:flex;align-items:center;gap:6px}
#loanCreditApp .lc-chart-key i{width:10px;height:10px;border-radius:50%;display:inline-block}
#loanCreditApp .lc-key-principal{background:linear-gradient(135deg,#39a0f5,#4761df)}
#loanCreditApp .lc-key-interest{background:linear-gradient(135deg,#ffad69,#ec668a)}
#loanCreditApp #lcPrincipalBar{background:linear-gradient(90deg,#3b9bec,#5068da)}
#loanCreditApp #lcInterestBar{background:linear-gradient(90deg,#ffa46d,#ec7189)}
#loanCreditApp .lc-legend span:first-child{color:#4775c4}
#loanCreditApp .lc-legend span:last-child{color:#c5636b}
#lcBalanceLine{filter:drop-shadow(0 3px 4px #707ee530)}
#loanCreditApp .lc-chart-caption{font-size:12px;color:#6b7fa5}
@media(max-width:440px){#loanCreditApp .lc-chart-card{padding:18px 14px}
#loanCreditApp .lc-donut{max-width:205px}
}
#loanCreditApp .lc-stats>div:last-child:nth-child(odd){grid-column:1/-1}
#loanCreditApp .lc-debt{margin-top:12px}
#loanCreditApp .lc-debt-name{width:100%;font-size:20px;height:44px;margin-bottom:14px;text-align:left}
#loanCreditApp .lc-remove,#lcAddDebt{background:#edf3ff;border:1px solid #ccdff8;color:#3264aa;font-size:13px;min-height:40px;margin-top:12px}
#loanCreditApp .lc-debt-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
#loanCreditApp .lc-debt-list{padding:10px 0;font-size:13px}
#loanCreditApp .lc-debt-summary{padding:12px;margin-top:8px;border:1px solid #dce6f8;border-radius:10px;background:#f4f8ff;color:#4e6f9f;overflow-wrap:anywhere}
#loanCreditApp .lc-model-note{font-size:12px;line-height:1.7;color:#6c82a6;margin-top:12px}
#loanCreditApp .lc-no-schedule{padding:12px;color:#7185a5;font-size:13px}
.lc-content-nav{padding:16px;border:1px solid #dbe5f5;border-radius:12px;background:#f6f9ff}
#loanCreditApp .lc-input-row label{font-size:21px;font-weight:850}
#loanCreditApp .lc-value-box input{font-size:34px}
@media(max-width:440px){#loanCreditApp .lc-input-row label{font-size:19px}
#loanCreditApp .lc-value-box input{font-size:30px}
}