/* Wynik kalkulatora: te same odstępy i linie co tabele z 16.09-29.09 (style w linii). */
.ff-kalk-tabela { width: 100%; border-collapse: collapse; font-size: 15px; }
.ff-kalk-tabela td { padding: 7px 0; border-bottom: 1px solid var(--ff-line, #E4DED6); vertical-align: top; }
.ff-kalk-tabela td.ff-kalk-co { padding-right: 10px; }
.ff-kalk-tabela td.ff-kalk-ile { text-align: right; }
.ff-kalk-ile strong { white-space: nowrap; }
.ff-kalk-produkt, .ff-kalk-opak, .ff-kalk-zapas { display: block; font-size: 12px; font-weight: 400; opacity: .75; }
.ff-kalk-zapas { opacity: 1; color: var(--ff-ink-strong, #141414); }
.ff-kalk-dlaczego { margin-top: 4px; font-size: 12px; text-align: left; }
.ff-kalk-dlaczego summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; justify-content: flex-end; color: var(--ff-ink-soft, #5B5347); }
.ff-kalk-dlaczego summary { list-style: none; }
.ff-kalk-dlaczego summary::-webkit-details-marker { display: none; }
.ff-kalk-dlaczego summary::before { content: "\25B8"; margin-right: 6px; }
.ff-kalk-dlaczego[open] summary::before { content: "\25BE"; }
.ff-kalk-dlaczego p { margin: 4px 0 0; line-height: 1.5; }
.ff-kalk-dane { margin: 0 0 8px; font-size: 13px; color: var(--ff-ink-soft, #5B5347); }
.ff-kalk-uwaga { margin: 14px 0 0; font-size: 13px; line-height: 1.6; }
.ff-kalk-braki { margin: 14px 0 0; font-size: 13px; line-height: 1.6; font-weight: 600; }
.ff-kalk-zrodla { margin: 10px 0 0; font-size: 13px; color: var(--ff-ink-soft, #5B5347); }
.ff-kalk-blad { margin: 0; font-size: 15px; color: #8A1C1C; }
.ff-kalk-wynik--liczy { opacity: .45; transition: opacity .15s; }
/* Pola: błąd przy polu, podpowiedź zakresu, suwak zapasu z celem dotyku 44 px. */
.ff-kalkulator [aria-invalid="true"] { border-color: #8A1C1C !important; box-shadow: 0 0 0 1px #8A1C1C; }
.ff-kalk-blad-pola { margin: 6px 0 0; font-size: 13px; color: #8A1C1C; }
.ff-kalk-podpowiedz { margin: 6px 0 0; font-size: 12px; color: var(--ff-ink-soft, #5B5347); }
/* Pasek rysujemy sami, bo motyw zdejmuje suwakowi wygląd systemowy (bez tego zostaje sama kropka). */
.ff-kalkulator input.ff-kalk-suwak { -webkit-appearance: none; appearance: none; width: 100%; min-height: 44px; margin: 0; padding: 0; border: 0; background: transparent; box-shadow: none; }
.ff-kalkulator input.ff-kalk-suwak::-webkit-slider-runnable-track { height: 6px; border-radius: 3px; background: #C9C0B3; }
.ff-kalkulator input.ff-kalk-suwak::-moz-range-track { height: 6px; border-radius: 3px; background: #C9C0B3; }
.ff-kalkulator input.ff-kalk-suwak::-webkit-slider-thumb { -webkit-appearance: none; width: 24px; height: 24px; margin-top: -9px; border-radius: 50%; border: 0; background: var(--ff-ink-strong, #141414); }
.ff-kalkulator input.ff-kalk-suwak::-moz-range-thumb { width: 24px; height: 24px; border-radius: 50%; border: 0; background: var(--ff-ink-strong, #141414); }
.ff-kalkulator input.ff-kalk-suwak:focus-visible { outline: 2px solid var(--ff-ink-strong, #141414); outline-offset: 4px; }
/* Strzałka listy: motyw zdejmuje systemową, a bez niej lista wygląda jak pole tekstowe z uciętym napisem. */
.ff-kalkulator 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 1.5l5 5 5-5' fill='none' stroke='%235B5347' stroke-width='2'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right 14px center; background-size: 12px 8px; }
/* Ocieplenie: cztery pola na wierzchu, reszta pod „Więcej opcji” na całą szerokość siatki. */
.ff-kalk-wiecej { grid-column: 1 / -1; }
.ff-kalk-wiecej summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-size: 14px; font-weight: 600; list-style: none; }
.ff-kalk-wiecej summary::-webkit-details-marker { display: none; }
.ff-kalk-wiecej summary::before { content: "\25B8"; margin-right: 6px; }
.ff-kalk-wiecej[open] summary::before { content: "\25BE"; }
.ff-kalk-wiecej[open] summary { margin-bottom: 8px; }
/* Bez JavaScriptu: komunikat i wzór pod przykładem. */
.ff-kalk-nojs { margin: 0 0 12px; font-size: 14px; font-weight: 600; }
.ff-kalk-wzor { margin: 16px 0 0; font-size: 13px; line-height: 1.6; }
.ff-kalk-wzor summary { cursor: pointer; min-height: 44px; display: flex; align-items: center; font-weight: 600; }
.ff-kalk-wzor ul { margin: 4px 0 0; padding-left: 18px; }

/* Plan 3: blok „co dalej” (lista do wyceny, mail, PDF). Cele dotyku min. 44 px. */
.ff-kalk-dalej { margin-top: 24px; padding-top: 18px; border-top: 1px solid var(--ff-line, #E4DED6); display: grid; gap: 18px; }
.ff-kalk-przycisk { min-height: 44px; padding: 12px 18px; border-radius: 8px; border: 0; background: var(--ff-ink-strong, #141414); color: #FFFFFF; font-weight: 600; font-size: 16px; cursor: pointer; width: 100%; }
.ff-kalk-przycisk[disabled] { opacity: .6; cursor: progress; }
.ff-kalk-link { min-height: 44px; padding: 10px 0; border: 0; background: none; color: inherit; font-size: 15px; text-decoration: underline; cursor: pointer; }
.ff-kalk-mail { display: grid; gap: 12px; }
.ff-kalk-mail-tytul { margin: 0; font-weight: 700; font-size: 17px; }
.ff-kalk-zgoda { display: flex; gap: 10px; align-items: flex-start; min-height: 44px; font-size: 15px; line-height: 1.45; cursor: pointer; }
.ff-kalk-zgoda input { width: 22px; height: 22px; margin: 2px 0 0; flex: none; }
.ff-kalk-zgoda small { display: block; margin-top: 4px; font-size: 12px; color: var(--ff-ink-soft, #5B5347); }
.ff-kalk-wycena { margin: 0; padding: 12px 14px; border: 1px solid var(--ff-line, #E4DED6); border-radius: 8px; display: grid; gap: 12px; }
.ff-kalk-wycena legend { padding: 0 6px; font-weight: 600; font-size: 14px; }
.ff-kalk-status { margin: 0; min-height: 1.4em; font-size: 15px; }
.ff-kalk-status--blad { color: #8A1C1C; }
.ff-kalk-pobierz { margin: 0; }
.ff-kalk-pulapka { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* Atrybut hidden ma przegrywać z display:grid powyżej (blok, pole wyceny, kod pocztowy, błędy). */
.ff-kalkulator [hidden] { display: none !important; }
.ff-kalkulator { scroll-margin-top: 90px; }
.ff-kalk-odbior { margin: 0; padding: 0; border: 0; min-width: 0; display: grid; gap: 6px; }
.ff-kalk-odbior legend { padding: 0; margin-bottom: 4px; font-weight: 600; font-size: 14px; }
