/* Kreator umowy najmu: formularz wieloetapowy. Mobile first, paleta jak landing (bursztyn i orzech).
   Ładowany tylko na szablonie page-kreator-najmu.php (inc/kreator-najmu-formularz.php). */
.kn-form {
	--kn-walnut: #0F1F3A;
	--kn-amber: #047857;
	--kn-amber-hover: #065F46;
	--kn-amber-soft: #ECFDF5;
	--kn-honey: #34D399;
	--kn-cream: #F3FAF6;
	--kn-paper: #FFFFFF;
	--kn-border: #DCEFE4;
	--kn-ink: #0F1F3A;
	--kn-text: #1E293B;
	--kn-muted: #475569;
	--kn-err: #B42318;
	--kn-err-bg: #FEF3F2;
	background: var(--kn-cream);
	padding: 1.5rem 0 3rem;
	min-height: 70vh;
	color: var(--kn-text);
}
.kn-form__wrap { max-width: 720px; margin: 0 auto; padding: 0 16px; }
.kn-form h1 { font-size: 1.5rem; line-height: 1.2; letter-spacing: -.02em; color: var(--kn-ink); margin: 0 0 .5rem; }
.kn-form__lead { margin: 0 0 1.25rem; color: var(--kn-muted); font-size: 1rem; }
.kn-podglad { background: var(--kn-amber-soft); border: 1px solid var(--kn-border); border-radius: 12px; padding: .75rem 1rem; margin: 0 0 1rem; font-size: .9375rem; color: #065F46; }

#kn-app { background: var(--kn-paper); border: 1px solid var(--kn-border); border-radius: 16px; padding: 1.25rem 1rem 1rem; box-shadow: 0 14px 30px -22px rgba(15,31,58,.45); }
#kn-app * { box-sizing: border-box; }

.kn-nagl { margin-bottom: 1.25rem; }
.kn-krok { margin: 0 0 .5rem; font-size: .875rem; font-weight: 700; color: var(--kn-amber-hover); text-transform: uppercase; letter-spacing: .04em; }
.kn-postep { height: 8px; background: var(--kn-border); border-radius: 999px; overflow: hidden; }
.kn-postep__slup { height: 100%; background: var(--kn-amber); border-radius: 999px; transition: width .25s ease; }

.kn-ekran h2 { font-size: 1.375rem; line-height: 1.25; margin: 0 0 1.25rem; color: var(--kn-ink); outline: none; }
.kn-grupa h3 { font-size: 1.0625rem; margin: 1.5rem 0 .25rem; color: var(--kn-ink); }

.kn-pole { margin: 0 0 1.25rem; }
.kn-pole--krotkie > input, .kn-pole--krotkie > select { max-width: 18rem; }
.kn-et { display: block; margin: 0 0 .375rem; font-weight: 700; font-size: 1rem; color: var(--kn-ink); }
.kn-et--sekcja { font-size: 1.0625rem; margin-top: 1.25rem; }

.kn-form input[type="text"], .kn-form input[type="email"], .kn-form input[type="tel"], .kn-form input[type="date"], .kn-form select, .kn-form textarea {
	width: 100%; min-height: 48px; padding: .625rem .75rem; font: inherit; font-size: 16px; /* 16px: iOS nie przybliża pola */
	color: var(--kn-ink); background: #fff; border: 1.5px solid #A7D7BE; border-radius: 10px; appearance: none; -webkit-appearance: none;
}
.kn-form select { background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%236B5440' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right .875rem center; padding-right: 2.25rem; }
.kn-form textarea { min-height: 7rem; resize: vertical; }
.kn-form input:focus-visible, .kn-form select:focus-visible, .kn-form textarea:focus-visible, .kn-btn:focus-visible, .kn-link:focus-visible, .kn-opcja:focus-within { outline: 3px solid var(--kn-walnut); outline-offset: 2px; }
.kn-form input:focus, .kn-form select:focus, .kn-form textarea:focus { border-color: var(--kn-amber); }
.has-err > input, .has-err > select, .has-err > textarea, .has-err .kn-radia { border-color: var(--kn-err); }

.kn-pomoc { margin: .375rem 0 0; font-size: .9375rem; line-height: 1.55; color: var(--kn-muted); }
.kn-zywe { margin: .375rem 0 0; font-size: .9375rem; font-weight: 600; color: var(--kn-amber-hover); }
.kn-zywe:empty { display: none; }
.kn-info { margin: 0 0 1.25rem; padding: .75rem 1rem; background: var(--kn-cream); border-left: 4px solid var(--kn-honey); border-radius: 8px; font-size: .9375rem; line-height: 1.55; }
.kn-zestawienie { margin: .25rem 0 1.25rem; padding: .75rem 1rem; background: var(--kn-cream); border-radius: 8px; font-size: .9375rem; line-height: 1.55; }

.kn-blad { display: none; margin: .375rem 0 0; padding: .625rem .75rem; background: var(--kn-err-bg); border: 1px solid #FDA29B; border-radius: 8px; color: var(--kn-err); font-size: .9375rem; line-height: 1.5; font-weight: 600; }
.kn-blad.is-on { display: block; }
.kn-blad--pw .kn-btn { margin: .5rem .5rem 0 0; }
.kn-ogolne { display: none; margin: 0 0 1rem; padding: .75rem 1rem; background: var(--kn-err-bg); border: 1px solid #FDA29B; border-radius: 10px; color: var(--kn-err); font-weight: 600; }
.kn-ogolne.is-on { display: block; }
.kn-ostrz:empty { display: none; }
.kn-ostrz__poz { margin: 0 0 .75rem; padding: .75rem 1rem; border-radius: 10px; font-size: .9375rem; line-height: 1.55; background: var(--kn-amber-soft); border: 1px solid var(--kn-honey); color: #065F46; }
.kn-ostrz__poz--czerwony { background: var(--kn-err-bg); border-color: #FDA29B; color: var(--kn-err); }

/* Wybory (radio, checkbox) jako duże, dotykowe karty */
.kn-radia { display: grid; gap: .5rem; border: 1.5px solid transparent; border-radius: 12px; }
.kn-opcja { display: flex; align-items: flex-start; gap: .75rem; padding: .75rem 1rem; min-height: 52px; background: #fff; border: 1.5px solid #A7D7BE; border-radius: 12px; cursor: pointer; font-weight: 400; margin: 0; transition: border-color .12s, background .12s; }
.kn-opcja:hover { border-color: var(--kn-amber); }
.kn-opcja:has(input:checked) { border-color: var(--kn-amber); background: var(--kn-amber-soft); }
.kn-opcja input { width: 22px; height: 22px; margin: .1rem 0 0; flex: none; accent-color: var(--kn-amber); }
.kn-opcja__tekst { display: flex; flex-direction: column; flex: 1; }
.kn-opcja__nazwa { font-weight: 700; color: var(--kn-ink); }
.kn-opcja small { margin-top: .15rem; font-size: .875rem; color: var(--kn-muted); line-height: 1.45; font-weight: 400; }
.kn-cena { font-weight: 800; font-size: 1.25rem; color: var(--kn-amber-hover); white-space: nowrap; }
.kn-radia--poziome { grid-template-columns: 1fr; }

.kn-karta { margin: 0 0 1rem; padding: 1rem; border: 1px solid var(--kn-border); border-radius: 12px; background: #fff; }
.kn-karta legend { padding: 0 .375rem; font-weight: 700; color: var(--kn-ink); }
.kn-kara { padding: .25rem 0; }
.kn-wiersz { display: grid; gap: .5rem; padding: .75rem; margin: 0 0 .75rem; background: #fff; border: 1px solid var(--kn-border); border-radius: 12px; }
.kn-szybkie { display: flex; flex-wrap: wrap; gap: .5rem; margin: 0 0 .75rem; }
.kn-chip { min-height: 40px; padding: .375rem .75rem; border: 1px solid var(--kn-border); border-radius: 999px; background: #fff; font: inherit; font-size: .9375rem; cursor: pointer; color: var(--kn-amber-hover); }
.kn-chip:hover { border-color: var(--kn-amber); }

.kn-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 52px; padding: .75rem 1.25rem; font: inherit; font-weight: 800; font-size: 1.0625rem; border-radius: 12px; border: 2px solid transparent; cursor: pointer; text-align: center; }
.kn-btn--glowny { background: var(--kn-amber); color: #fff; }
.kn-btn--glowny:hover { background: var(--kn-amber-hover); }
.kn-btn--drugi { background: #fff; color: var(--kn-amber-hover); border-color: #A7D7BE; font-weight: 700; min-height: 48px; }
.kn-btn--drugi:hover { border-color: var(--kn-amber); }
.kn-btn:disabled, .kn-btn.is-wait { opacity: .6; cursor: wait; }
.kn-link { background: none; border: 0; padding: .5rem 0; font: inherit; color: var(--kn-amber-hover); text-decoration: underline; text-underline-offset: 3px; cursor: pointer; }

.kn-nawig { display: flex; justify-content: space-between; align-items: center; gap: .75rem; margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid var(--kn-border); }
.kn-nawig .kn-nast { flex: 1; max-width: 22rem; margin-left: auto; }
.kn-stopka { margin: .75rem 0 0; font-size: .8125rem; color: var(--kn-muted); line-height: 1.5; }

.kn-podsum .kn-sekcja { margin: 0 0 1rem; padding: 1rem; border: 1px solid var(--kn-border); border-radius: 12px; background: #fff; }
.kn-sekcja__g { display: flex; justify-content: space-between; align-items: baseline; gap: 1rem; }
.kn-sekcja__g h3 { margin: 0 0 .5rem; font-size: 1.0625rem; color: var(--kn-ink); }
.kn-dl { margin: 0; display: grid; grid-template-columns: minmax(0, 1fr); gap: 0; }
.kn-dl dt { font-size: .8125rem; font-weight: 700; color: var(--kn-muted); text-transform: uppercase; letter-spacing: .03em; margin-top: .5rem; }
.kn-dl dd { margin: 0; overflow-wrap: anywhere; }
.kn-ramka { margin: 0 0 1rem; padding: 1rem; background: var(--kn-amber-soft); border: 1px solid var(--kn-honey); border-radius: 12px; color: #065F46; font-size: .9375rem; line-height: 1.55; }

@media (min-width: 640px) {
	.kn-form { padding: 2.5rem 0 4rem; }
	.kn-form h1 { font-size: 2rem; }
	#kn-app { padding: 1.75rem 1.75rem 1.25rem; }
	.kn-dl { grid-template-columns: 11rem minmax(0, 1fr); column-gap: 1rem; }
	.kn-dl dt { margin-top: .25rem; padding-top: .125rem; }
	.kn-dl dd { margin-bottom: .25rem; }
	.kn-wiersz { grid-template-columns: 2fr 1fr 1fr auto; align-items: end; }
	.kn-radia--poziome { grid-template-columns: repeat(3, 1fr); }
}
/* Mobile: przyklejony pasek nawigacji, kciuk sięga */
@media (max-width: 639px) {
	.kn-nawig { position: sticky; bottom: 0; margin: 1.25rem -1rem -1rem; padding: .75rem 1rem calc(.75rem + env(safe-area-inset-bottom)); background: var(--kn-paper); border-top: 1px solid var(--kn-border); border-radius: 0 0 16px 16px; z-index: 5; }
}
@media (prefers-reduced-motion: reduce) { .kn-postep__slup { transition: none; } }