/* Kalkulator zdolności pożyczkowej – style narzędzia. Korzysta z tokenów --pp-* ze styl.css;
   te same selektory kz-* co w pierwowzorze, więc poprawki przenosi się przez diff. */
:root{--kz-granica:#b45309}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.kz [hidden]{display:none!important}
.kz{display:grid;gap:28px;align-items:start}
.kz-form{display:grid;gap:22px}
.kz-form fieldset{margin:0;border:1px solid var(--pp-linia);border-radius:var(--pp-radius);padding:18px 18px 8px;min-width:0;background:var(--pp-papier)}
.kz-form legend{font-weight:600;font-size:17px;padding:0 8px}
.kz-field{margin-bottom:16px}
.kz-field > label,.kz-label{display:block;font-weight:600;font-size:15px;margin-bottom:6px}
.kz-hint{font-size:14px;line-height:1.45;margin:6px 0 0;color:var(--pp-atrament-2)}
.kz-err{display:block;font-size:14px;font-weight:600;line-height:1.4;margin-top:6px;color:#b42318}
.kz-err::before{content:"\26A0\00a0"}
.kz-row{display:flex;gap:10px;align-items:center}

.kz-form input[type=number]{
  width:100%;max-width:200px;min-height:46px;padding:10px 12px;border:1px solid var(--pp-atrament-3);border-radius:var(--pp-radius);
  background:var(--pp-papier);color:var(--pp-atrament);font:inherit;font-weight:600;font-size:17px}
.kz-form input[type=number][readonly]{max-width:90px;text-align:center;background:var(--pp-tlo)}
.kz-form input:focus-visible,.kz-form button:focus-visible,.kz-seg input:focus-visible + span{outline:3px solid var(--pp-akcent);outline-offset:2px}
.kz-form input[aria-invalid=true]{border:2px dashed #b42318}

.kz-form input[type=range]{width:100%;height:34px;margin:6px 0 0;background:transparent;accent-color:var(--pp-akcent);cursor:pointer}
.kz-form input[type=range]::-webkit-slider-runnable-track{height:8px;border-radius:8px;background:var(--pp-linia)}
.kz-form input[type=range]::-moz-range-track{height:8px;border-radius:8px;background:var(--pp-linia)}
.kz-form input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:26px;height:26px;margin-top:-9px;border-radius:50%;background:var(--pp-akcent);border:3px solid #fff;box-shadow:0 0 0 1.5px var(--pp-akcent)}
.kz-form input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:var(--pp-akcent);border:3px solid #fff;box-shadow:0 0 0 1.5px var(--pp-akcent)}

.kz-step{flex:none;width:44px;height:44px;border:1px solid var(--pp-akcent);border-radius:var(--pp-radius);background:var(--pp-papier);color:var(--pp-akcent-ciemny);
  font:inherit;font-weight:700;font-size:1.3rem;line-height:1;cursor:pointer}
.kz-step:hover{background:var(--pp-akcent-tlo)}
.kz-step:active{transform:translateY(1px)}

.kz-tryb{display:grid;gap:8px;margin-bottom:16px}
.kz-seg{position:relative;display:block}
.kz-seg input{position:absolute;opacity:0;width:100%;height:100%;inset:0;margin:0;cursor:pointer}
.kz-seg span{display:block;padding:12px 14px;border:1px solid var(--pp-akcent);border-radius:var(--pp-radius);background:var(--pp-papier);color:var(--pp-akcent-ciemny);font-weight:600;font-size:15px;text-align:center}
.kz-seg input:checked + span{background:var(--pp-akcent);color:var(--pp-biel)}

.kz-form .pp-przycisk{justify-self:start;min-height:48px;cursor:pointer;font-family:inherit}

.kz-wynik{background:var(--pp-akcent-tlo-2);color:var(--pp-atrament);border:1px solid var(--pp-linia);border-left:6px solid transparent;border-radius:var(--pp-radius);padding:22px 20px;min-height:340px}
.kz-wynik.is-zapas{border-left-color:var(--pp-akcent)}
.kz-wynik.is-granica{border-left-color:var(--kz-granica)}
.kz-wynik.is-przekracza,.kz-wynik.is-napiety{border-left-color:var(--pp-atrament-2)}
.kz-pusty{margin:0;font-weight:600;font-size:17px;line-height:1.5}
.kz-blad{font-weight:600}
.kz-stan{display:flex;gap:12px;align-items:center;margin:0;font-weight:700;font-size:1.4rem;line-height:1.25}
.kz-stan svg{flex:none;width:46px;height:46px;color:var(--pp-akcent-ciemny)}
.kz-wynik.is-granica .kz-stan svg{color:var(--kz-granica)}
.kz-wynik.is-przekracza .kz-stan svg,.kz-wynik.is-napiety .kz-stan svg{color:var(--pp-atrament-2)}
.kz-rata{margin:16px 0 0;line-height:1.3}
.kz-kwota-do{margin:14px 0 0;line-height:1.3}
.kz-etykieta{font-size:15px;font-weight:500;color:var(--pp-atrament-2)}
.kz-liczba{display:block;font-size:2.1rem;line-height:1.1;font-weight:700;letter-spacing:-0.02em}
.kz-prog{margin:14px 0 0;padding:12px 14px;border:1px solid var(--pp-linia);border-radius:var(--pp-radius);font-size:14px;line-height:1.55;background:var(--pp-papier)}
.kz-tips{list-style:none;margin:14px 0 0;padding:0;display:grid;gap:10px;font-size:15px;line-height:1.5}
.kz-tips li{padding-left:16px;position:relative}
.kz-tips li::before{content:"";position:absolute;left:0;top:.6em;width:7px;height:7px;border-radius:50%;background:var(--pp-akcent)}
.kz-ustaw{display:inline-block;margin-top:4px;min-height:44px;padding:8px 16px;border:1px solid var(--pp-akcent);border-radius:999px;background:var(--pp-papier);
  color:var(--pp-akcent-ciemny);font:inherit;font-weight:600;font-size:14px;cursor:pointer}
.kz-ustaw:hover{background:var(--pp-akcent);color:var(--pp-biel)}
.kz-ustaw:focus-visible{outline:3px solid var(--pp-akcent);outline-offset:2px}
.kz-skladniki{margin-top:16px;border-top:1px solid var(--pp-linia);padding-top:12px}
.kz-skladniki summary{cursor:pointer;font-weight:600;font-size:15px;list-style:none}
.kz-skladniki summary::-webkit-details-marker{display:none}
.kz-skladniki summary::after{content:"+";float:right;font-weight:600}
.kz-skladniki[open] summary::after{content:"\2013"}
.kz-skladniki dl{display:grid;grid-template-columns:1fr auto;gap:6px 14px;margin:10px 0 0;font-size:14px}
.kz-skladniki dt,.kz-skladniki dd{margin:0}
.kz-skladniki dd{text-align:right;font-weight:600}
.kz-skladniki .kz-sum{border-top:1px solid var(--pp-atrament-3);padding-top:6px;font-weight:700}
.kz-przypis{margin:16px 0 0;font-size:13px;line-height:1.55;color:var(--pp-atrament-3)}
.kz-cta{margin:16px 0 0}
.kz-cta .pp-przycisk{width:100%;justify-content:center}
.kz-pomoc{margin:14px 0 0;font-weight:500;line-height:1.55}
.kz-pomoc a{font-weight:600}
.kz-wsk{display:flex;gap:8px;align-items:center;font-size:14px;font-weight:600;margin:6px 0 0;color:var(--pp-atrament)}
.kz-wsk-kropka{flex:none;width:12px;height:12px;border-radius:50%;background:var(--pp-atrament-2)}
.kz-wsk[data-stan=zapas] .kz-wsk-kropka{background:var(--pp-akcent)}
.kz-wsk[data-stan=granica] .kz-wsk-kropka{background:var(--kz-granica)}
.kz-wsk[data-stan=przekracza] .kz-wsk-kropka,.kz-wsk[data-stan=napiety] .kz-wsk-kropka{background:var(--pp-atrament-2)}
.kz-noscript{margin:14px 0 0;font-size:15px;line-height:1.55}
.pp-tabela-opak .kz-noscript{margin:0;padding:12px 16px}

/* pasek mobilny: czysto informacyjny (bez kliknięcia, bez fokusu); pod przyklejonym nagłówkiem serwisu od 640 px */
.kz-pasek[hidden],.kz-pasek [hidden]{display:none!important}
.kz-pasek{position:sticky;top:0;z-index:19;display:flex;gap:10px;align-items:center;margin:0 -16px 14px;padding:10px 16px;
  background:var(--pp-akcent-tlo-2);color:var(--pp-atrament);box-shadow:var(--pp-cien);font-weight:600;font-size:15px;border-left:6px solid transparent;border-bottom:1px solid var(--pp-linia)}
.kz-pasek svg{flex:none;width:22px;height:22px;color:var(--pp-akcent-ciemny)}
.kz-pasek-rata{margin-left:auto;white-space:nowrap}
.kz-pasek-stan{min-width:0}
.kz-pasek.is-zapas{border-left-color:var(--pp-akcent)}
.kz-pasek.is-granica{border-left-color:var(--kz-granica)}
.kz-pasek.is-granica svg{color:var(--kz-granica)}
.kz-pasek.is-przekracza,.kz-pasek.is-napiety{border-left-color:var(--pp-atrament-2)}
.kz-pasek.is-przekracza svg,.kz-pasek.is-napiety svg{color:var(--pp-atrament-2)}

/* sygnał zmiany wyniku */
@keyframes kz-blysk{from{box-shadow:0 0 0 4px rgba(11,107,79,.45)}to{box-shadow:0 0 0 4px transparent}}
.kz-wynik.is-zmiana,.kz-pasek.is-zmiana{animation:kz-blysk .8s ease-out}

/* tabela przykładowa: liczby do prawej, pierwsza kolumna do lewej */
#kz-tabela th,#kz-tabela td{text-align:right;white-space:nowrap}
#kz-tabela th:first-child,#kz-tabela td:first-child{text-align:left}
#kz-tabela thead th{vertical-align:bottom;white-space:normal}
.kz-tabela-podpis{margin-top:12px}

@media (min-width:640px){
  .kz-pasek{top:65px}
}
@media (min-width:768px){
  .kz-pasek{margin:0 -24px 14px;padding:10px 24px}
}
@media (min-width:992px){
  .kz-pasek{display:none!important}
  .kz{grid-template-columns:1fr 440px;gap:40px}
  .kz-wynik{position:sticky;top:81px}
  .kz-tryb{grid-template-columns:1fr 1fr}
}
@media (prefers-reduced-motion:reduce){
  .kz *,.kz-step,.kz-ustaw{transition:none!important;animation:none!important}
  .kz-wynik.is-zmiana,.kz-pasek.is-zmiana{animation:none!important}
}