/*
 * Kasomax - wygląd elementów wtyczki Finex Loan Manager.
 * Ładowany automatycznie przez wtyczkę po jej stylach (motyw/finex-loan-manager/finex-loan-manager.css).
 */

.kasomax-calculator {
    --kc-text: #131739;
    --kc-value: #2244AA;
    --kc-green: #25DA67;
    --kc-green-dark: #16833E;
    --kc-track: #E9ECEF;
    --kc-line: rgba(19, 23, 57, 0.08);
    --kc-summary-bg: #E8F8EE;
}

/* Karta */
.alm-simple-calculator.kasomax-calculator {
    width: 100%;
    max-width: none;
    margin: 0 auto;
    padding: 0;
    border-radius: 24px;
    background: transparent;
    box-shadow: none;
    color: var(--kc-text);
    /* Dopasowanie do szerokości kontenera (shortcode stoi w różnych kolumnach), a nie ekranu */
    container-type: inline-size;
}

.kasomax-calculator .alm-calculator-field {
    margin: 0;
    padding-bottom: 22px;
    border-bottom: 1px solid var(--kc-line);
}

.kasomax-calculator .alm-calculator-field + .alm-calculator-field {
    padding-top: 22px;
}

/* Nagłówek: etykieta + wartość z ołówkiem */
.kasomax-calculator__head {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    min-height: 40px;
}

.kasomax-calculator__label {
    flex: 1 1 auto;
    min-width: 0;
    font-size: 18px;
    font-weight: 600;
    line-height: 1.3;
    color: var(--kc-text);
}

.alm-simple-calculator.kasomax-calculator .alm-amount-display,
.alm-simple-calculator.kasomax-calculator .alm-period-display {
    /* Bez !important - skrypt wtyczki ukrywa wartość (display: none) na czas wpisywania */
    display: inline-flex;
    flex: 0 0 auto;
    align-items: center;
    gap: 10px;
    width: auto !important;
    min-width: 0 !important;
    padding: 0 !important;
    background: none !important;
    border-radius: 0;
    color: var(--kc-value);
    font-size: 30px;
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
    cursor: pointer;
}

.alm-simple-calculator.kasomax-calculator .alm-amount-display::after,
.alm-simple-calculator.kasomax-calculator .alm-period-display::after {
    content: '';
    position: static;
    transform: none;
    flex: 0 0 22px;
    width: 22px;
    height: 22px;
    background: url('img/pencil-line.svg') center / contain no-repeat;
    opacity: 1;
}

/* Pole wpisywania wartości po kliknięciu (wstawiane przez skrypt wtyczki w miejsce wartości) */
.alm-simple-calculator.kasomax-calculator .alm-input-field {
    flex: 0 0 auto;
    width: 7ch !important;
    min-width: 0;
    height: auto;
    margin: 0;
    padding: 0 0 2px !important;
    border: 0 !important;
    border-bottom: 2px solid var(--kc-value) !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--kc-value) !important;
    font-family: inherit;
    font-size: 30px !important;
    font-weight: 700 !important;
    line-height: 1.2;
    text-align: right !important;
    box-shadow: none !important;
    outline: none;
}

.alm-simple-calculator.kasomax-calculator .alm-input-field::placeholder {
    color: var(--kc-value);
    opacity: 0.35;
}

/* Suwak */
.kasomax-calculator .alm-slider-container {
    margin-top: 10px;
}

.kasomax-calculator .alm-custom-slider {
    height: 8px;
    margin: 18px 0 16px;
    border-radius: 8px;
    background: var(--kc-track);
}

.kasomax-calculator .alm-slider-progress {
    border-radius: 8px;
    background: var(--kc-green);
}

/* Uchwyt: zielony kwadrat z zaokrąglonymi rogami, w środku białe kółko */
.kasomax-calculator .alm-slider-handle {
    width: 24px;
    height: 24px;
    border: 0;
    border-radius: 7px;
    background: var(--kc-green-dark);
    box-shadow: 0 2px 6px rgba(22, 131, 62, 0.25);
    box-sizing: border-box;
}

.kasomax-calculator .alm-slider-handle::after {
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
}

.kasomax-calculator .alm-slider-handle img {
    display: none;
}

.kasomax-calculator .alm-slider-values {
    font-size: 12px;
    font-weight: 600;
    color: var(--kc-text);
}

/* 5 etykiet dokładnie pod punktami skali 0/25/50/75/100%: skrajne przy krawędziach, środkowe wyśrodkowane */
.kasomax-calculator .alm-slider-values {
    position: relative;
    height: 16px;
}

.kasomax-calculator .alm-slider-values span {
    position: absolute;
    top: 0;
    white-space: nowrap;
    transform: translateX(-50%);
}

.kasomax-calculator .alm-slider-values span:nth-child(1) { left: 0; transform: none; }
.kasomax-calculator .alm-slider-values span:nth-child(2) { left: 25%; }
.kasomax-calculator .alm-slider-values span:nth-child(3) { left: 50%; }
.kasomax-calculator .alm-slider-values span:nth-child(4) { left: 75%; }
.kasomax-calculator .alm-slider-values span:nth-child(5) { left: auto; right: 0; transform: none; }

/* Przycisk */
.alm-simple-calculator.kasomax-calculator .alm-check-button {
    display: block;
    width: 100%;
    margin-top: 24px;
    padding: 18px 24px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 100px;
    background: var(--kc-green) !important;
    color: var(--kc-text);
    font-size: 18px;
    font-weight: 700;
    text-transform: none;
    letter-spacing: 0;
    box-shadow: none;
    transition: filter 0.2s ease;
}

.alm-simple-calculator.kasomax-calculator .alm-check-button:hover,
.alm-simple-calculator.kasomax-calculator .alm-check-button:focus-visible {
    background: var(--kc-green) !important;
    color: var(--kc-text);
    filter: brightness(0.95);
}

/* Rata / RRSO / przykład reprezentatywny */
.kasomax-calculator__summary {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px 14px;
    margin-top: 18px;
    padding: 12px 16px;
    border-radius: 10px;
    background: var(--kc-summary-bg);
    color: var(--kc-text);
    font-size: 16px;
}

.kasomax-calculator__summary-item strong {
    font-weight: 700;
}

.kasomax-calculator__summary-item + .kasomax-calculator__summary-item {
    padding-left: 14px;
    border-left: 1px solid rgba(19, 23, 57, 0.15);
}

.kasomax-calculator__example {
    margin-left: auto;
    color: var(--kc-text);
    font-size: 12px;
    text-decoration: none;
}

.kasomax-calculator__example:hover {
    text-decoration: underline;
}

/* Wąski kontener (telefon, wąska kolumna) */
@container (max-width: 440px) {
    .kasomax-calculator__label {
        font-size: 15px;
    }

    .alm-simple-calculator.kasomax-calculator .alm-amount-display,
    .alm-simple-calculator.kasomax-calculator .alm-period-display {
        gap: 6px;
        font-size: 22px;
    }

    .alm-simple-calculator.kasomax-calculator .alm-amount-display::after,
    .alm-simple-calculator.kasomax-calculator .alm-period-display::after {
        flex-basis: 18px;
        width: 18px;
        height: 18px;
    }

    .kasomax-calculator .alm-slider-values {
        font-size: 9px;
        letter-spacing: -0.01em;
    }

    /* Okres: skróty "2 m-ce", "10 m-cy" zamiast pełnych nazw (data-short z kalkulatora) */
    .kasomax-calculator .alm-slider-values span[data-short] {
        font-size: 0;
    }

    .kasomax-calculator .alm-slider-values span[data-short]::after {
        content: attr(data-short);
        font-size: 10px;
    }

    .alm-simple-calculator.kasomax-calculator .alm-input-field {
        font-size: 22px !important;
    }

    .kasomax-calculator__example {
        margin-left: 0;
        width: 100%;
    }
}

/* ===== Wskaźnik postępu formularza ([alm_steps_indicator]) ===== */

.kasomax-progress {
    width: 100%;
    font-family: 'SN Pro', 'SN pro', sans-serif;
    color: #3F435A;
}

.kasomax-progress__info {
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 10px;
}

.kasomax-progress__time,
.kasomax-progress__done {
    font-size: 14px;
    font-weight: 400;
    line-height: 1.3;
    letter-spacing: 0.03em;
}

.kasomax-progress__time strong {
    font-weight: 500;
}

.kasomax-progress__done {
    display: inline-flex;
    align-items: baseline;
    gap: 6px;
    white-space: nowrap;
}

.kasomax-progress__done strong {
    color: #16833E;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0.03em;
}

/* Tor: półprzezroczysta biała obudowa (32px) > biały środek (24px) > zielony pasek (16px) */
.kasomax-progress__track {
    box-sizing: border-box;
    height: 32px;
    padding: 3px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 999px;
    background: rgba(255, 255, 255, 0.25);
}

.kasomax-progress__inner {
    box-sizing: border-box;
    height: 24px;
    padding: 4px;
    border-radius: 999px;
    background: #fff;
}

.kasomax-progress__bar {
    height: 16px;
    max-width: 100%;
    border-radius: 999px;
    background: #25DA67;
    box-shadow: 0 4px 4px rgba(37, 218, 103, 0.25);
    transition: width 0.4s ease;
}

/* ===== Formularz wniosku ([alm_loan_application]) ===== */

.alm-loan-application {
    --kf-text: #131739;
    --kf-muted: #3F435A;
    --kf-green: #25DA67;
    --kf-green-dark: #16833E;
    --kf-border: #E1E2EA;
    --kf-mint: #E9FBF0;
    max-width: 760px;
    padding: 0;
    color: var(--kf-text);
    font-family: 'SN pro', sans-serif;
    container-type: inline-size;
}

/* "Składasz wniosek o pożyczkę 10 000 zł na okres 24 miesięcy" */
.alm-loan-application .alm-amount-and-period {
    margin: 0 0 24px !important;
    color: var(--kf-muted);
    font-size: 16px;
    font-weight: 500;
    line-height: 1.3;
}

.alm-loan-application #loan-amount-display,
.alm-loan-application #loan-period-display {
    color: var(--kf-text) !important;
    font-weight: 700;
}

/* Krok: nagłówek z maskotką */
.alm-loan-application .alm-step-content {
    background: transparent;
    border-radius: 0;
}

.kasomax-step-head {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    gap: 16px;
    margin-bottom: 20px;
}

.alm-loan-application .kasomax-step-head__number {
    margin: 0 0 6px !important;
    padding: 0;
    color: var(--kf-green-dark);
    font-size: 36px;
    font-weight: 700;
    line-height: 1.1;
}

.alm-loan-application .kasomax-step-head__name {
    margin: 0 !important;
    padding: 0;
    color: var(--kf-text);
    font-size: 24px;
    font-weight: 500;
    line-height: 1.1;
}

.kasomax-step-head__mascot {
    flex: 0 0 auto;
    width: 130px;
    height: auto;
    margin-bottom: -28px;
    transform: scaleX(-1);
    pointer-events: none;
}

/* Panel z polami */
.kasomax-step-panel {
    position: relative;
    display: flex;
    flex-direction: column;
    gap: 24px;
    padding: 32px 40px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.5);
}

.kasomax-step-panel > .alm-form-row {
    margin-bottom: 0;
}

.alm-loan-application .kasomax-section-title {
    margin: 0;
    color: var(--kf-muted);
    font-size: 24px;
    font-weight: 500;
    line-height: 1.1;
}

/* Pola */
.alm-loan-application .alm-form-row {
    gap: 16px 24px;
}

.alm-loan-application .alm-input {
    height: 52px;
    border: 1px solid var(--kf-border);
    border-radius: 12px !important;
    background: #fff;
    color: var(--kf-text);
    font-size: 16px;
}

.alm-loan-application .alm-input:focus {
    border-color: var(--kf-green-dark);
}

.alm-loan-application .alm-floating-label {
    --alm-label-bg: #fff;
    color: var(--kf-muted) !important;
    font-size: 15px;
}

.alm-loan-application .alm-input-wrapper.is-focused .alm-floating-label,
.alm-loan-application .alm-input-wrapper.has-value .alm-floating-label {
    font-size: 11px;
}

.alm-loan-application .alm-input-wrapper.is-focused .alm-floating-label {
    color: var(--kf-green-dark) !important;
}

.alm-loan-application .alm-input-wrapper:not(.is-focused) .alm-input.is-invalid ~ .alm-floating-label {
    color: #dc3545 !important;
}

.alm-loan-application .alm-select-arrow img {
    filter: none;
    opacity: 0.6;
}

/* Kafelki wyboru (status zamieszkania i kolejne) */
.kasomax-tiles-field .alm-input-wrapper {
    position: relative;
}

.kasomax-tiles {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 12px;
}

.kasomax-tile {
    position: relative;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 14px;
    min-height: 116px;
    padding: 18px 8px 14px;
    border: 1px solid var(--kf-border);
    border-radius: 12px;
    background: #fff;
    color: var(--kf-text);
    font-family: inherit;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.25;
    text-align: center;
    text-transform: none;
    letter-spacing: 0;
    box-shadow: none;
    cursor: pointer;
    transition: border-color 0.2s ease, box-shadow 0.2s ease;
}

/* Tło zawsze białe - motyw (Kadence) koloruje przyciski przy :focus / :active; wybór pokazuje tylko ramka i ✓ */
.kasomax-tiles .kasomax-tile,
.kasomax-tiles .kasomax-tile:hover,
.kasomax-tiles .kasomax-tile:focus,
.kasomax-tiles .kasomax-tile:active,
.kasomax-tiles .kasomax-tile.is-selected {
    background: #fff !important;
    color: var(--kf-text) !important;
    box-shadow: none !important;
}

.kasomax-tile:hover,
.kasomax-tile:focus-visible {
    border-color: var(--kf-green);
    outline: none;
}

/* Ikona z miętowym kółkiem 40x40 przesuniętym w prawy dolny róg */
.kasomax-tile__icon {
    position: relative;
    display: inline-flex;
    width: 48px;
    height: 48px;
}

.kasomax-tile__icon::before {
    content: '';
    position: absolute;
    right: -10px;
    bottom: -8px;
    width: 40px;
    height: 40px;
    border-radius: 50%;
    background: var(--kf-mint);
}

.kasomax-tile__icon img {
    position: relative;
    width: 48px;
    height: 48px;
}

.kasomax-tile__label {
    display: block;
}

/* Wybrany kafelek: zielona ramka i znaczek ✓ w prawym górnym rogu */
.kasomax-tile.is-selected {
    border: 2px solid var(--kf-green-dark);
    padding: 17px 7px 13px;
}

.kasomax-tile.is-selected::after {
    content: '';
    position: absolute;
    top: -8px;
    right: -8px;
    width: 20px;
    height: 20px;
    border-radius: 50%;
    background: var(--kf-green-dark) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5.5 10.5l3 3 6-6.5' fill='none' stroke='%23fff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 20px no-repeat;
}

.kasomax-tiles.is-invalid .kasomax-tile {
    border-color: #dc3545;
}

.kasomax-tiles-field .alm-validation-message {
    position: static;
    margin-top: 8px;
}

/* Nawigacja */
.alm-loan-application .alm-form-navigation {
    margin-top: 32px;
    gap: 16px;
}

.alm-loan-application .alm-next-step {
    min-width: 0;
    width: 100%;
    padding: 18px 24px !important;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 100px;
    background: var(--kf-green);
    color: var(--kf-text);
    font-size: 18px;
    font-weight: 700;
    text-transform: none;
}

.alm-loan-application .alm-next-step:hover {
    background: var(--kf-green);
    filter: brightness(0.95);
}

.alm-loan-application .alm-prev-step {
    color: var(--kf-muted);
}

/* Wąski kontener: jedna kolumna pól, mniejsze odstępy, 2-3 kafelki w rzędzie */
@container (max-width: 640px) {
    .kasomax-step-panel {
        padding: 24px 16px;
    }

    .alm-loan-application .alm-form-row {
        flex-direction: column;
    }

    .kasomax-tiles {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .alm-loan-application .kasomax-step-head__number {
        font-size: 30px;
    }

    .alm-loan-application .kasomax-step-head__name {
        font-size: 20px;
    }

    .kasomax-step-head__mascot {
        width: 96px;
        margin-bottom: -20px;
    }
}

@container (max-width: 400px) {
    .kasomax-tiles {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Suwak wyboru w formularzu (np. "Od jak dawna mieszkasz?") - jak w kalkulatorze */
.kasomax-choice-slider__value {
    color: #2244AA;
    font-size: 24px;
    font-weight: 700;
    line-height: 1.2;
}

.kasomax-choice-slider.is-empty .kasomax-choice-slider__value {
    color: var(--kf-muted);
    font-size: 16px;
    font-weight: 500;
    opacity: 0.7;
}

.kasomax-choice-slider .alm-slider-container {
    margin-top: 6px;
}

.kasomax-choice-slider .alm-custom-slider {
    height: 8px;
    margin: 18px 0 16px;
    border-radius: 8px;
    background: #E9ECEF;
    cursor: pointer;
}

.kasomax-choice-slider .alm-slider-progress {
    border-radius: 8px;
    background: var(--kf-green);
}

.kasomax-choice-slider.is-empty .alm-slider-progress {
    width: 0 !important;
}

.kasomax-choice-slider .alm-slider-handle {
    width: 24px;
    height: 24px;
    border: 0;
    border-radius: 7px;
    background: var(--kf-green-dark);
    box-shadow: 0 2px 6px rgba(22, 131, 62, 0.25);
    box-sizing: border-box;
}

.kasomax-choice-slider .alm-slider-handle::after {
    content: '';
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background: #fff;
}

.kasomax-choice-slider .alm-slider-handle img {
    display: none;
}

.kasomax-choice-slider .alm-slider-values {
    color: var(--kf-text);
    font-size: 12px;
    font-weight: 600;
}

.kasomax-choice-slider.is-invalid .alm-custom-slider {
    box-shadow: 0 0 0 2px rgba(220, 53, 69, 0.35);
}

.kasomax-choice-slider-field .alm-validation-message {
    position: static;
    margin-top: 8px;
}

/* ===== Formularz: typografia i szczegóły według makiety (nadpisuje reguły wyżej) ===== */

.alm-loan-application,
.alm-loan-application input,
.alm-loan-application select,
.alm-loan-application button,
.alm-loan-application label {
    font-family: 'SN pro', sans-serif;
}

/* "Składasz wniosek o pożyczkę 10 000 zł na okres 24 miesięcy" */
.alm-loan-application .alm-amount-and-period {
    margin: 0 0 4px !important;
    color: var(--kf-muted);
    font-size: 18px;
    font-weight: 500;
    line-height: 1.5;
    letter-spacing: -0.03em;
}

.alm-loan-application #loan-amount-display,
.alm-loan-application #loan-period-display {
    color: var(--kf-text) !important;
    font-weight: 700;
}

/* Ikona edycji kwoty i okresu na zielono (#16833E) */
.alm-loan-application .alm-amount-and-period img {
    filter: brightness(0) saturate(100%) invert(34%) sepia(62%) saturate(745%) hue-rotate(95deg) brightness(93%) contrast(91%);
}

/* Krok N. / nazwa kroku */
.alm-loan-application .kasomax-step-head__number {
    color: #16833E;
    font-size: 36px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: -0.03em;
}

.alm-loan-application .kasomax-step-head__name {
    color: #131739;
    font-size: 24px;
    font-weight: 500;
    line-height: 1.1;
    letter-spacing: -0.03em;
}

/* Nazwy sekcji ("Dane podstawowe") */
.alm-loan-application .kasomax-section-title {
    color: #3F435A;
    font-size: 24px;
    font-weight: 400;
    line-height: 1.1;
    letter-spacing: -0.03em;
}

/* Tekst w polach i etykiety w polach */
.alm-loan-application .alm-input,
.alm-loan-application .alm-floating-label {
    color: #3F435A;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.03em;
}

.alm-loan-application .alm-floating-label {
    line-height: 1;
}

/* Podpowiedzi "?" przy polach - nie ma ich na makiecie (zostaje ikona wklejania numeru konta) */
.alm-loan-application .alm-tooltip:not(.alm-paste-icon) {
    display: none;
}

/* Zgody: kwadratowe pola wyboru, po zaznaczeniu zielony kwadrat w środku */
.alm-loan-application .alm-consent-options {
    margin-top: 0;
}

.alm-loan-application .alm-consent-option input[type="checkbox"] {
    width: 20px;
    height: 20px;
    border: 1px solid #C3C6D5;
    border-radius: 4px !important;
    background: #fff;
}

.alm-loan-application .alm-consent-option input[type="checkbox"]:checked {
    border-color: #25DA67;
    border-radius: 4px !important;
}

.alm-loan-application .alm-consent-option input[type="checkbox"]:checked::after {
    width: 10px;
    height: 10px;
    border-radius: 2px !important;
    background-color: #25DA67;
}

.alm-loan-application .alm-consent-option label {
    color: #3F435A;
    font-size: 12px;
    font-weight: 400;
    line-height: 1.5;
}

/* "Zaznacz wszystkie" większe od pozostałych zgód */
.alm-loan-application .alm-consent-options > .alm-consent-option:first-child label {
    font-size: 14px;
}

.alm-loan-application .alm-consent-option label a {
    color: inherit;
    text-decoration: underline;
}

.alm-loan-application .alm-expand-text {
    color: #131739;
    font-weight: 700;
}

/* Teksty opcji w kafelkach (status zamieszkania itd.) */
.alm-loan-application .kasomax-tile {
    color: #3F435A !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.2;
    letter-spacing: -0.03em;
}

/* Maskotka nie zwiększa wysokości nagłówka - stoi w prawym dolnym rogu, nad panelem */
.alm-loan-application .kasomax-step-head {
    min-height: 0;
    padding-right: 150px;
}

.alm-loan-application .kasomax-step-head__mascot {
    position: absolute;
    right: 0;
    bottom: -28px;
    margin: 0;
}

@container (max-width: 640px) {
    .alm-loan-application .kasomax-step-head {
        padding-right: 100px;
    }

    .alm-loan-application .kasomax-step-head__mascot {
        bottom: -20px;
    }
}

/* Odstępy wokół "Składasz wniosek o pożyczkę..." jak na makiecie (odstęp od paska postępu daje układ strony) */
.alm-loan-application .alm-amount-and-period {
    margin: 0 0 24px !important;
}

/* Komunikat błędu pod polem jako nakładka (bez przesuwania formularza, gdy się pojawi).
   Odstęp między wierszami pól 40px mieści: 8px + komunikat (14px) + unoszącą się etykietę pola niżej (~9px) + zapas. */
.alm-loan-application .alm-validation-message {
    position: absolute;
    top: 55px;
    bottom: auto;
    left: 16px;
    right: 0;
    margin: 0;
    font-size: 12px;
    line-height: 1.2;
    letter-spacing: -0.03em;
    transform: none;
}

/* Kafelki i suwaki wyboru: komunikat w zwykłym układzie pod nimi (ich wysokość jest zmienna) */
.alm-loan-application .kasomax-tiles-field .alm-validation-message,
.alm-loan-application .kasomax-choice-slider-field .alm-validation-message {
    position: static;
    margin-top: 8px;
}

.alm-loan-application .kasomax-step-panel {
    gap: 40px;
}

.alm-loan-application .kasomax-step-panel .alm-form-row {
    row-gap: 40px;
}

/* Nagłówek sekcji dalej 24px nad swoimi polami */
.alm-loan-application .kasomax-step-panel > .kasomax-section-title + * {
    margin-top: -16px;
}

/* Elementy w polu wyśrodkowane względem samego pola (52px) */
.alm-loan-application .alm-input-wrapper > .alm-floating-label,
.alm-loan-application .alm-input-wrapper > .phone-prefix,
.alm-loan-application .alm-input-wrapper > .alm-select-arrow,
.alm-loan-application .alm-input-wrapper > .alm-calendar-icon,
.alm-loan-application .alm-input-wrapper > .alm-tooltip {
    top: 26px;
}

/* Maskotka kończy się dokładnie na górnej krawędzi panelu (odstęp nagłówka 20px) - bez nachodzenia pod
   półprzezroczyste tło panelu, które rozjaśniało jej dolny pasek */
.alm-loan-application .kasomax-step-head__mascot {
    bottom: -20px;
}

@container (max-width: 640px) {
    .alm-loan-application .kasomax-step-head__mascot {
        bottom: -20px;
    }
}

/* Mniejszy wewnętrzny odstęp z lewej (14px) i etykiety 14px - etykiety mieszczą się w wąskich polach */
.alm-loan-application .alm-input {
    padding: 0 14px !important;
}

.alm-loan-application .alm-select {
    padding-left: 34px !important;
}

.alm-loan-application .alm-date-input {
    padding-left: 42px !important;
}

.alm-loan-application #phone_number:focus,
.alm-loan-application #phone_number:not(:placeholder-shown) {
    padding-left: 48px !important;
}

.alm-loan-application .alm-input-wrapper > .alm-select-arrow,
.alm-loan-application .alm-input-wrapper > .alm-calendar-icon,
.alm-loan-application .alm-input-wrapper > .phone-prefix {
    left: 14px;
}

.alm-loan-application .alm-floating-label {
    left: 14px;
    max-width: calc(100% - 28px);
    overflow: hidden;
    text-overflow: ellipsis;
    font-size: 14px;
}

.alm-loan-application .alm-input-wrapper .alm-select ~ .alm-floating-label {
    left: 34px;
    max-width: calc(100% - 48px);
}

.alm-loan-application .alm-input-wrapper .alm-date-input ~ .alm-floating-label {
    left: 42px;
    max-width: calc(100% - 56px);
}

/* Etykieta uniesiona nad pole: pełna szerokość pola */
.alm-loan-application .alm-input-wrapper.is-focused .alm-floating-label,
.alm-loan-application .alm-input-wrapper.has-value .alm-floating-label {
    max-width: calc(100% - 24px);
    font-size: 11px;
}

/* Kafelki wyboru (status zamieszkania, wykształcenie itd.): stała wysokość 132px */
.alm-loan-application .kasomax-tile {
    box-sizing: border-box;
    height: 132px;
    min-height: 132px;
    overflow: hidden;
}

/* Kafelki: padding 22px góra / 12px dół, 12px między ikoną a tekstem
   (zaznaczony ma ramkę 2px zamiast 1px - padding o 1px mniejszy, żeby treść nie skakała) */
.alm-loan-application .kasomax-tile {
    gap: 12px;
    padding: 22px 8px 12px;
}

.alm-loan-application .kasomax-tile.is-selected {
    padding: 21px 7px 11px;
}

/* Kafelki: wysokość z proporcji 31:33 (szerokość:wysokość) zamiast stałych 132px */
.alm-loan-application .kasomax-tile {
    height: auto;
    min-height: 0;
    aspect-ratio: 31 / 33;
}

/* Kafelki: 16px po bokach */
.alm-loan-application .kasomax-tile {
    padding: 22px 16px 12px;
}

.alm-loan-application .kasomax-tile.is-selected {
    padding: 21px 15px 11px;
}

/* Telefon / wąski kontener: ikona i tekst wyśrodkowane w pionie */
@container (max-width: 640px) {
    .alm-loan-application .kasomax-tile {
        justify-content: center;
    }
}

/* Znaczek ✓ wystaje poza róg zaznaczonego kafelka - bez obcinania */
.alm-loan-application .kasomax-tile {
    overflow: visible;
}

/* Długie pojedyncze słowa (np. "Współwłasność") mogą zająć boczny padding - bez łamania w środku słowa */
.alm-loan-application .kasomax-tile__label {
    margin: 0 -12px;
    word-break: normal;
    overflow-wrap: normal;
    hyphens: manual;
}

/* Odstęp między kafelkami 16px */
.alm-loan-application .kasomax-tiles {
    gap: 16px;
}

/* Kafelki tekstowe (bez ikony), np. "Od jak dawna mieszkasz?": niższe, 3 w rzędzie, 2 na telefonie */
.alm-loan-application .kasomax-tiles--text {
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.alm-loan-application .kasomax-tile--text {
    aspect-ratio: auto;
    height: auto;
    min-height: 56px;
    justify-content: center;
    padding: 12px 16px;
}

.alm-loan-application .kasomax-tile--text.is-selected {
    padding: 11px 15px;
}

.alm-loan-application .kasomax-tile--text .kasomax-tile__label {
    margin: 0;
}

@container (max-width: 640px) {
    .alm-loan-application .kasomax-tiles--text {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* ===== Kolory UI kasomax zamiast pomarańczowego akcentu wtyczki ===== */

.alm-loan-application {
    --alm-accent-color: #16833E;
    --accent-color: #25DA67;
}

/* Numer konta (26 cyfr ze spacjami): miejsce na ikonę wklejania i mniejsza czcionka na wąskich ekranach */
.alm-loan-application #bank_account {
    padding-right: 48px !important;
    text-overflow: ellipsis;
}

@media (max-width: 480px) {
    .alm-loan-application #bank_account {
        font-size: 14px;
        letter-spacing: -0.03em;
    }
}

@media (max-width: 380px) {
    .alm-loan-application #bank_account {
        font-size: 12.5px;
        letter-spacing: -0.04em;
    }
}

/* Ikony wtyczki (strzałki selectów, kalendarz, wklejanie numeru konta, "wróć", edycja) na zielono #16833E */
.alm-loan-application img[src*="triangle-left-icon"],
.alm-loan-application img[src*="calendar-icon"],
.alm-loan-application img[src*="paste-icon"],
.alm-loan-application img[src*="tooltip-icon"],
.alm-loan-application .alm-select-arrow img,
.alm-loan-application .alm-prev-step img {
    filter: brightness(0) saturate(100%) invert(34%) sepia(62%) saturate(745%) hue-rotate(95deg) brightness(93%) contrast(91%);
    opacity: 1;
}

/* Ładowanie danych (GUS po NIP, kod pocztowy): zielony spinner zamiast pomarańczowego GIF-a */
.alm-loan-application #company_nip.loading,
.alm-loan-application #postal_code.loading {
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Ccircle cx='12' cy='12' r='9' fill='none' stroke='%23E1E2EA' stroke-width='3'/%3E%3Cpath d='M12 3a9 9 0 0 1 9 9' fill='none' stroke='%2316833E' stroke-width='3' stroke-linecap='round'%3E%3CanimateTransform attributeName='transform' type='rotate' from='0 12 12' to='360 12 12' dur='0.8s' repeatCount='indefinite'/%3E%3C/path%3E%3C/svg%3E");
    background-repeat: no-repeat;
    background-position: right 14px center;
    background-size: 20px;
}

.alm-loan-application .gus-loading-message:before,
.alm-loan-application .postal-loading-message:before {
    border-color: #16833E;
    border-top-color: transparent;
}

/* ===== Mniejsze odstępy między wierszami pól ===== */

/* Uniesiona etykieta stoi na linii ramki pola (wystaje ponad pole tylko o połowę wysokości) */
.alm-loan-application .alm-input-wrapper.is-focused .alm-floating-label,
.alm-loan-application .alm-input-wrapper.has-value .alm-floating-label {
    transform: translateY(calc(-50% - 26px)) !important;
}

/* 32px między wierszami: komunikat błędu (4px pod polem, 14px) + etykieta pola niżej (~6px) + zapas */
.alm-loan-application .alm-validation-message,
.alm-loan-application .alm-input.is-invalid ~ .alm-validation-message {
    top: 56px;
    transform: none !important;
    animation: none !important;
}

.alm-loan-application .kasomax-step-panel {
    gap: 32px;
}

.alm-loan-application .kasomax-step-panel .alm-form-row {
    row-gap: 32px;
}

.alm-loan-application .kasomax-step-panel > .kasomax-section-title + * {
    margin-top: -8px;
}

/* ===================================================================
   TELEFON (90% ruchu): mniejsze fonty, ciaśniejsze odstępy, niższe pola i kafelki.
   Formularz reaguje na szerokość swojego kontenera, pasek postępu na szerokość ekranu.
   Tekst w polach zostaje 16px - przy mniejszym iOS przybliża stronę po kliknięciu w pole.
   =================================================================== */

@media (max-width: 640px) {
    .kasomax-progress__info {
        margin-bottom: 8px;
    }

    .kasomax-progress__time,
    .kasomax-progress__done {
        font-size: 12px;
    }

    .kasomax-progress__time strong {
        white-space: nowrap;
    }

    .kasomax-progress__done strong {
        font-size: 20px;
    }

    .kasomax-progress__track {
        height: 28px;
    }

    .kasomax-progress__inner {
        height: 20px;
    }

    .kasomax-progress__bar {
        height: 12px;
    }
}

@container (max-width: 640px) {
    /* Kwota i okres */
    .alm-loan-application .alm-amount-and-period {
        margin-bottom: 16px !important;
        font-size: 14px;
        line-height: 1.4;
    }

    /* Nagłówek kroku */
    .alm-loan-application .kasomax-step-head {
        margin-bottom: 16px;
        padding-right: 88px;
    }

    .alm-loan-application .kasomax-step-head__number {
        font-size: 28px;
    }

    .alm-loan-application .kasomax-step-head__name {
        font-size: 20px;
    }

    .alm-loan-application .kasomax-step-head__mascot {
        width: 84px;
        bottom: -16px;
    }

    /* Panel i sekcje */
    .alm-loan-application .kasomax-step-panel {
        gap: 28px;
        padding: 20px 16px;
        border-radius: 12px;
    }

    .alm-loan-application .kasomax-section-title {
        font-size: 20px;
    }

    .alm-loan-application .kasomax-step-panel > .kasomax-section-title + * {
        margin-top: -12px;
    }

    /* Pola: 48px wysokości, wiersze co 28px (miejsce na komunikat błędu) */
    .alm-loan-application .kasomax-step-panel .alm-form-row {
        row-gap: 28px;
    }

    .alm-loan-application .alm-input {
        height: 48px;
    }

    .alm-loan-application .alm-input-wrapper > .alm-floating-label,
    .alm-loan-application .alm-input-wrapper > .phone-prefix,
    .alm-loan-application .alm-input-wrapper > .alm-select-arrow,
    .alm-loan-application .alm-input-wrapper > .alm-calendar-icon,
    .alm-loan-application .alm-input-wrapper > .alm-tooltip {
        top: 24px;
    }

    .alm-loan-application .alm-input-wrapper.is-focused .alm-floating-label,
    .alm-loan-application .alm-input-wrapper.has-value .alm-floating-label {
        transform: translateY(calc(-50% - 24px)) !important;
    }

    .alm-loan-application .alm-validation-message,
    .alm-loan-application .alm-input.is-invalid ~ .alm-validation-message {
        top: 52px;
    }

    /* Kafelki z ikoną: 3 w rzędzie, mniejsze ikony i tekst */
    .alm-loan-application .kasomax-tiles {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 10px;
    }

    .alm-loan-application .kasomax-tile {
        gap: 8px;
        padding: 14px 6px 10px;
        border-radius: 10px;
        font-size: 12px;
    }

    .alm-loan-application .kasomax-tile.is-selected {
        padding: 13px 5px 9px;
    }

    .alm-loan-application .kasomax-tile__label {
        margin: 0 -4px;
    }

    .alm-loan-application .kasomax-tile__icon,
    .alm-loan-application .kasomax-tile__icon img {
        width: 40px;
        height: 40px;
    }

    .alm-loan-application .kasomax-tile__icon::before {
        width: 32px;
        height: 32px;
        right: -8px;
        bottom: -6px;
    }

    .alm-loan-application .kasomax-tile.is-selected::after {
        top: -6px;
        right: -6px;
        width: 18px;
        height: 18px;
        background-size: 18px;
    }

    /* Kafelki tekstowe (czas zamieszkania): 2 w rzędzie, niższe */
    .alm-loan-application .kasomax-tiles--text {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .alm-loan-application .kasomax-tile--text {
        min-height: 48px;
        padding: 10px 12px;
        font-size: 13px;
    }

    .alm-loan-application .kasomax-tile--text.is-selected {
        padding: 9px 11px;
    }

    /* Zgody */
    .alm-loan-application .alm-consent-option {
        margin-bottom: 12px;
    }

    .alm-loan-application .alm-consent-option:not(:first-child):not(.alm-nested-consent) {
        margin-left: 8px;
    }

    /* Nawigacja */
    .alm-loan-application .alm-form-navigation {
        margin-top: 24px;
        gap: 12px;
    }

    .alm-loan-application .alm-next-step {
        padding: 16px 20px !important;
        font-size: 16px;
    }
}

/* Bardzo wąskie telefony (np. 320px): kafelki z ikoną po 2 w rzędzie */
@container (max-width: 340px) {
    .alm-loan-application .kasomax-tiles {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

/* Kwota i okres nie łamią się w środku ("24 / miesięcy") */
.alm-loan-application #loan-amount-display,
.alm-loan-application #loan-period-display {
    white-space: nowrap;
}

@container (max-width: 640px) {
    /* Wiersze pól co 30px: ok. 7px zapasu między komunikatem błędu a etykietą pola niżej */
    .alm-loan-application .kasomax-step-panel {
        gap: 30px;
    }

    .alm-loan-application .kasomax-step-panel .alm-form-row {
        row-gap: 30px;
    }

    .alm-loan-application .kasomax-step-panel > .kasomax-section-title + * {
        margin-top: -14px;
    }
}

/* Po przejściu do następnego kroku strona przewija się do paska postępu (16px od góry ekranu) */
.kasomax-progress {
    scroll-margin-top: 16px;
}

@container (max-width: 640px) {
    /* Kafelki tekstowe ("Od jak dawna mieszkasz?") też po 3 w rzędzie */
    .alm-loan-application .kasomax-tiles--text {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .alm-loan-application .kasomax-tile--text {
        padding: 8px 6px;
        font-size: 12px;
    }

    .alm-loan-application .kasomax-tile--text.is-selected {
        padding: 7px 5px;
    }
}

/* Najwęższe telefony (320px): również 3 w rzędzie */
@container (max-width: 340px) {
    .alm-loan-application .kasomax-tiles {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }

    .alm-loan-application .kasomax-tile {
        padding: 12px 4px 8px;
        font-size: 11px;
    }

    .alm-loan-application .kasomax-tile.is-selected {
        padding: 11px 3px 7px;
    }
}

/* Telefon/tablet: nagłówek strony Kadence jest przyklejony (60px) - pasek postępu ląduje 16px pod nim */
@media (max-width: 1024px) {
    .kasomax-progress {
        scroll-margin-top: 76px;
    }
}

/* ==========================================================================
   Strona oczekiwania na ofertę (offer-page/processing.php) - pełny ekran, bez menu strony
   ========================================================================== */

.kasomax-processing {
    --kp-text: #131739;
    --kp-blue: #2244AA;
    --kp-green: #25DA67;
    --kp-green-dark: #16833E;
    --kp-green-soft: #E9FBF0;
    --kp-line: #E1E2EA;
    --kp-muted: #5B5F7A;
    position: fixed;
    inset: 0;
    z-index: 100000;
    overflow-x: hidden;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    container-type: inline-size;
    font-family: 'SN Pro', 'SN pro', sans-serif;
    color: var(--kp-text);
    background: linear-gradient(180deg, #E7F6F9 0%, #F4FBFC 45%, #FFFFFF 100%);
}

.kasomax-processing *,
.kasomax-processing *::before,
.kasomax-processing *::after {
    box-sizing: border-box;
}

.kasomax-processing [hidden] {
    display: none !important;
}

/* Kształty Kasomax w tle (img/decorator.svg) - prawy górny róg i lustrzane odbicie w lewym dolnym */
.kasomax-processing__deco {
    position: absolute;
    z-index: 0;
    width: min(502px, 45vw);
    height: auto;
    pointer-events: none;
    user-select: none;
}

.kasomax-processing__deco--right { top: 0; right: 0; }
.kasomax-processing__deco--left { bottom: 0; left: 0; transform: scale(-1, -1); }

/* Logo i karta razem wyśrodkowane w pionie (marginesy auto - przy wysokiej treści zwykłe przewijanie) */
.kasomax-processing__header {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1200px;
    margin: auto auto 0;
    padding: 24px 24px 0;
    display: flex;
    justify-content: center;
}

.kasomax-processing__logo {
    display: block;
    margin: 0 auto;
    height: 36px;
    width: auto;
    max-width: 220px;
}

.kasomax-processing__main {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1200px;
    margin: 0 auto auto;
    padding: 32px 24px 48px;
}

.kasomax-processing__card {
    display: grid;
    grid-template-columns: 1fr 1.15fr;
    align-items: center;
    gap: 48px;
    padding: 32px 40px;
    border-radius: 16px;
    /* Jak panel formularza wniosku (.kasomax-step-panel): półprzezroczysta biel, bez ramki i cienia */
    background: rgba(255, 255, 255, 0.5);
}

/* Misiek w "radarze" */
.kasomax-processing__visual {
    position: relative;
    aspect-ratio: 1 / 0.9;
    display: flex;
    align-items: center;
    justify-content: center;
    overflow: hidden;
    border-radius: 20px;
    background: linear-gradient(160deg, #EEF3FF 0%, #E7F6F9 100%);
}

.kasomax-processing__ring,
.kasomax-processing__ping {
    position: absolute;
    left: 50%;
    top: 50%;
    aspect-ratio: 1;
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.kasomax-processing__ring { border: 2px solid rgba(34, 68, 170, 0.14); }
.kasomax-processing__ring--1 { width: 44%; }
.kasomax-processing__ring--2 { width: 68%; }
.kasomax-processing__ring--3 { width: 92%; }

.kasomax-processing__ping {
    width: 40%;
    border: 3px solid rgba(37, 218, 103, 0.55);
    animation: kasomax-processing-ping 2.4s ease-out infinite;
}

.kasomax-processing__mascot {
    position: relative;
    z-index: 1;
    width: 62%;
    height: auto;
    transform-origin: 50% 90%;
    animation: kasomax-processing-look 4s ease-in-out infinite;
}

/* Cień pod miśkiem - mniejszy, gdy misiek podskakuje */
.kasomax-processing__shadow {
    position: absolute;
    left: 50%;
    top: 78%;
    width: 30%;
    height: 14px;
    border-radius: 50%;
    background: radial-gradient(closest-side, rgba(19, 23, 57, 0.18), rgba(19, 23, 57, 0));
    transform: translateX(-50%);
    animation: kasomax-processing-shadow 4s ease-in-out infinite;
}

/* Wiązka radaru */
.kasomax-processing__sweep {
    position: absolute;
    left: 50%;
    top: 50%;
    width: 92%;
    aspect-ratio: 1;
    border-radius: 50%;
    background: conic-gradient(from 0deg, rgba(37, 218, 103, 0.28), rgba(37, 218, 103, 0) 70deg, rgba(37, 218, 103, 0) 360deg);
    transform: translate(-50%, -50%);
    animation: kasomax-processing-sweep 3.6s linear infinite;
}

/* Kropki krążące po pierścieniach (sprawdzani partnerzy) */
.kasomax-processing__orbit {
    position: absolute;
    left: 50%;
    top: 50%;
    aspect-ratio: 1;
    transform: translate(-50%, -50%);
    animation: kasomax-processing-orbit 6s linear infinite;
}

.kasomax-processing__orbit i {
    position: absolute;
    top: -7px;
    left: 50%;
    width: 14px;
    height: 14px;
    margin-left: -7px;
    border-radius: 50%;
    border: 3px solid #fff;
    box-shadow: 0 4px 10px rgba(19, 23, 57, 0.15);
}

.kasomax-processing__orbit--1 { width: 44%; animation-duration: 5s; }
.kasomax-processing__orbit--1 i { background: var(--kp-green); }
.kasomax-processing__orbit--2 { width: 68%; animation-duration: 8s; animation-direction: reverse; }
.kasomax-processing__orbit--2 i { background: var(--kp-blue); }
.kasomax-processing__orbit--3 { width: 92%; animation-duration: 12s; animation-delay: -4s; }
.kasomax-processing__orbit--3 i { background: #FFD64F; }

.kasomax-processing__float {
    position: absolute;
    left: 50%;
    bottom: 20px;
    transform: translateX(-50%);
    display: flex;
    align-items: center;
    gap: 10px;
    padding: 10px 16px;
    white-space: nowrap;
    font-size: 14px;
    font-weight: 600;
    background: #fff;
    border: 1px solid var(--kp-line);
    border-radius: 999px;
    box-shadow: 0 8px 24px rgba(19, 23, 57, 0.08);
}

.kasomax-processing__spin {
    width: 18px;
    height: 18px;
    flex: none;
    border-radius: 50%;
    border: 3px solid #DCE4F7;
    border-top-color: var(--kp-blue);
    animation: kasomax-processing-spin 0.9s linear infinite;
}

/* Treść */
.kasomax-processing__content {
    display: flex;
    flex-direction: column;
    gap: 24px;
}

.kasomax-processing__pill {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px 6px 8px;
    border-radius: 999px;
    background: var(--kp-green-soft);
    color: var(--kp-green-dark);
    font-size: 14px;
    font-weight: 600;
}

.kasomax-processing__pill-dot {
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--kp-green);
    color: var(--kp-text);
}

.kasomax-processing .kasomax-processing__title {
    margin: 0;
    font-family: inherit;
    font-size: 44px;
    line-height: 1.15;
    font-weight: 700;
    letter-spacing: -0.01em;
    color: var(--kp-text);
}

.kasomax-processing__hl {
    position: relative;
    display: inline-block;
    color: var(--kp-blue);
}

.kasomax-processing__hl svg {
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 100%;
    height: 14px;
}

.kasomax-processing .kasomax-processing__lead {
    margin: 0;
    font-size: 18px;
    line-height: 1.55;
    color: #4A4E6A;
}

.kasomax-processing__timer {
    display: flex;
    flex-direction: column;
    gap: 14px;
    padding: 20px 24px;
    background: #fff;
    border: 1px solid var(--kp-line);
    border-radius: 16px;
}

.kasomax-processing__timer-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
}

.kasomax-processing__timer-label {
    display: flex;
    align-items: center;
    gap: 10px;
    font-size: 16px;
    font-weight: 600;
}

.kasomax-processing__time {
    font-size: 32px;
    font-weight: 700;
    color: var(--kp-blue);
    font-variant-numeric: tabular-nums;
    letter-spacing: 0.02em;
}

.kasomax-processing__track {
    height: 16px;
    overflow: hidden;
    border-radius: 999px;
    background: #E9EEF8;
}

.kasomax-processing__fill {
    width: 0;
    height: 100%;
    border-radius: 999px;
    background: repeating-linear-gradient(-45deg, var(--kp-green) 0 14px, #3FE27C 14px 28px);
    background-size: 40px 100%;
    transition: width 1s linear;
    animation: kasomax-processing-stripes 1.2s linear infinite;
}

.kasomax-processing .kasomax-processing__note {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: var(--kp-muted);
}

/* Po upływie czasu */
.kasomax-processing__info {
    display: flex;
    align-items: flex-start;
    gap: 12px;
    padding: 16px 18px;
    border-radius: 14px;
    background: #EEF3FF;
    border: 1px solid #CBD7F5;
}

.kasomax-processing__info svg {
    flex: none;
    margin-top: 1px;
}

.kasomax-processing .kasomax-processing__info-title {
    margin: 0 0 2px;
    font-size: 15px;
    font-weight: 700;
    color: var(--kp-blue);
}

.kasomax-processing .kasomax-processing__info-text {
    margin: 0;
    font-size: 14px;
    line-height: 1.5;
    color: #4A4E6A;
}

@keyframes kasomax-processing-ping {
    0% { transform: translate(-50%, -50%) scale(0.9); opacity: 0.9; }
    100% { transform: translate(-50%, -50%) scale(2.3); opacity: 0; }
}

/* Misiek rozgląda się: podskok z przechyleniem w lewo, potem w prawo */
@keyframes kasomax-processing-look {
    0%, 40%, 80%, 100% { transform: translateY(0) rotate(0); }
    20% { transform: translateY(-12px) rotate(-5deg); }
    60% { transform: translateY(-12px) rotate(5deg); }
}

@keyframes kasomax-processing-shadow {
    0%, 40%, 80%, 100% { transform: translateX(-50%) scale(1); opacity: 1; }
    20%, 60% { transform: translateX(-50%) scale(0.75); opacity: 0.6; }
}

@keyframes kasomax-processing-sweep {
    to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes kasomax-processing-orbit {
    to { transform: translate(-50%, -50%) rotate(360deg); }
}

@keyframes kasomax-processing-spin {
    to { transform: rotate(360deg); }
}

@keyframes kasomax-processing-stripes {
    to { background-position: 40px 0; }
}

/* "Ogranicz animacje" (np. wyłączone efekty animacji w Windows): misiek i radar ruszają się dalej (spokojne,
   bez błysków - to jedyna informacja, że coś się dzieje), zatrzymujemy tylko przesuwające się paski */
@media (prefers-reduced-motion: reduce) {
    .kasomax-processing__fill {
        animation: none;
    }
}

/* Telefon */
@container (max-width: 900px) {
    .kasomax-processing__header { padding: 16px 16px 0; }
    .kasomax-processing__deco { width: 260px; }
    .kasomax-processing__logo { height: 30px; }
    .kasomax-processing__main { padding: 16px 16px 12px; }

    .kasomax-processing__card {
        grid-template-columns: 1fr;
        gap: 24px;
        padding: 20px 16px;
        border-radius: 12px;
    }

    /* Na telefonie najpierw tekst i timer, misiek pod nimi */
    .kasomax-processing__visual { order: 2; aspect-ratio: auto; height: 240px; }
    .kasomax-processing__mascot { width: auto; height: 190px; }
    /* Niska ramka na telefonie: pierścienie liczone od wysokości, żeby nie wychodziły poza nią */
    .kasomax-processing__ring,
    .kasomax-processing__sweep,
    .kasomax-processing__orbit { width: auto; height: 92%; }
    .kasomax-processing__ring--1,
    .kasomax-processing__orbit--1 { height: 44%; }
    .kasomax-processing__ring--2,
    .kasomax-processing__orbit--2 { height: 68%; }
    .kasomax-processing__float { bottom: 12px; font-size: 13px; }
    .kasomax-processing__content { gap: 20px; }
    .kasomax-processing .kasomax-processing__title { font-size: 30px; }
    .kasomax-processing__hl svg { bottom: -8px; height: 12px; }
    .kasomax-processing .kasomax-processing__lead { font-size: 16px; }
    .kasomax-processing__timer { padding: 16px; }
    .kasomax-processing__time { font-size: 28px; }
}

/* ==========================================================================
   Strona ofert (offer-page/offers.php): najnowsza oferta, "Poszukujesz innych warunków?", lista firm
   ========================================================================== */

.kasomax-offers {
    --ko-text: #131739;
    --ko-blue: #2244AA;
    --ko-green: #25DA67;
    --ko-green-dark: #16833E;
    --ko-green-soft: #E9FBF0;
    --ko-line: #E1E2EA;
    --ko-muted: #4A4E6A;
    --ko-overlap: 50px;
    position: relative;
    overflow: hidden;
    container-type: inline-size;
    font-family: 'SN Pro', 'SN pro', sans-serif;
    color: var(--ko-text);
}

.kasomax-offers *,
.kasomax-offers *::before,
.kasomax-offers *::after {
    box-sizing: border-box;
}

.kasomax-offers p,
.kasomax-offers h1,
.kasomax-offers h2 {
    margin: 0;
}

/* Sekcje: standardowy gradient Kasomax #E7F6F9 -> przezroczysty, powtórzony w drugiej sekcji */
.kasomax-offers__hero-section,
.kasomax-offers__body {
    position: relative;
    background: linear-gradient(180deg, #E7F6F9 0%, rgba(231, 246, 249, 0) 100%);
}

.kasomax-offers__hero-section {
    padding: 24px 0 var(--ko-overlap);
}

/* Druga sekcja nad pierwszą - wyróżniona oferta wchodzi na nagłówek o --ko-overlap */
.kasomax-offers__body {
    z-index: 1;
    padding-bottom: 64px;
}

/* Dekorator w prawym górnym rogu (mocniejszy selektor - style obrazków w treści strony go nie powiększą) */
.kasomax-offers .kasomax-offers__hero-gradient {
    position: absolute;
    top: 0;
    /* Do prawej krawędzi treści (1200px), nie okna */
    right: max(0px, calc((100% - 1200px) / 2));
    width: 520px;
    max-width: 55%;
    height: auto;
    pointer-events: none;
}

.kasomax-offers__inner {
    position: relative;
    z-index: 1;
    max-width: 1248px;
    margin: 0 auto;
    padding: 0 24px;
    display: flex;
    flex-direction: column;
    gap: 32px;
}

/* Nagłówek z miśkiem */
.kasomax-offers__hero {
    position: relative;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    min-height: 330px;
}

.kasomax-offers .kasomax-offers__title {
    align-self: center;
    font-family: inherit;
    font-size: 72px;
    line-height: 1.1;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: var(--ko-text);
}

/* "dopasowaną do Ciebie" - w nowej linii, zielone pociągnięcie z globalnej klasy mark.heading-decorator */
.kasomax-offers mark.kasomax-offers__hl {
    display: block;
    width: fit-content;
    font-size: 60px;
    font-weight: 700;
    color: #131739;
}

/* Misiek stoi na górnej krawędzi wyróżnionej oferty */
.kasomax-offers__hero-mascot {
    display: block;
    width: 273px;
    height: auto;
    margin-right: 120px;
}

/* Najnowsza oferta */
.kasomax-offers__featured {
    position: relative;
    margin-top: calc(-1 * var(--ko-overlap));
    padding: 64px 40px 32px;
    background: #fff;
    border: 1px solid #F0F1F4;
    border-radius: 20px;
}

.kasomax-offers__badge {
    position: absolute;
    top: -12px;
    left: 48px;
    padding: 6px 16px;
    border-radius: 6px;
    background: var(--ko-green);
    color: var(--ko-text);
    font-size: 16px;
    font-weight: 700;
}

.kasomax-offers__partner {
    display: flex;
    align-items: center;
    gap: 24px;
    padding-bottom: 32px;
    border-bottom: 1px solid var(--ko-line);
}

.kasomax-offers__logo {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 180px;
    height: 72px;
    padding: 10px 16px;
    border-radius: 8px;
    background: #F5F6F9;
}

.kasomax-offers__logo--small {
    width: 172px;
    height: 68px;
}

.kasomax-offers__logo-img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.kasomax-offers__logo-name {
    font-size: 18px;
    font-weight: 700;
    text-align: center;
}

.kasomax-offers__partner-text {
    min-height: 72px;
    padding-left: 24px;
    border-left: 1px solid var(--ko-line);
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.kasomax-offers .kasomax-offers__partner-name {
    font-family: inherit;
    font-size: 24px;
    line-height: 1.1;
    font-weight: 700;
    letter-spacing: -0.03em;
    color: #131739;
}

.kasomax-offers .kasomax-offers__product {
    font-size: 15px;
    color: var(--ko-muted);
}

.kasomax-offers__details {
    display: grid;
    grid-template-columns: 1fr 1fr 1.6fr;
    align-items: center;
    gap: 16px;
    padding: 32px 0;
    border-bottom: 1px solid var(--ko-line);
}

.kasomax-offers__stat {
    display: flex;
    flex-direction: column;
    gap: 16px;
    padding-left: 24px;
    border-left: 1px solid var(--ko-line);
}

/* 16px między ikoną a tekstem (gap kolumny), etykieta i wartość bez odstępu */
.kasomax-offers__stat-icon {
    margin-bottom: 0;
    line-height: 0;
    color: var(--ko-blue);
}

.kasomax-offers__stat-text {
    display: flex;
    flex-direction: column;
    gap: 0;
}

.kasomax-offers__stat-label {
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
    color: var(--ko-muted);
}

.kasomax-offers__stat-value {
    font-size: 24px;
    line-height: 1.1;
    font-weight: 700;
    color: #131739;
}

.kasomax-offers__decision {
    display: flex;
    align-items: center;
    gap: 16px;
    padding: 20px;
    border-radius: 10px;
    background: #D5F7E2;
}

.kasomax-offers__decision-icon {
    flex: none;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 50px;
    height: 50px;
    border-radius: 50%;
    background: var(--ko-green-soft);
    color: var(--ko-green-dark);
}

.kasomax-offers .kasomax-offers__decision-title {
    font-size: 24px;
    line-height: 1.25;
    font-weight: 700;
    color: var(--ko-green-dark);
}

.kasomax-offers .kasomax-offers__decision-text {
    font-size: 15px;
    color: var(--ko-text);
}

.kasomax-offers__cta {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 18px;
    padding-top: 32px;
}

.kasomax-offers .kasomax-offers__button {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 100%;
    min-height: 62px;
    padding: 16px 32px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 999px;
    background: var(--ko-green);
    color: var(--ko-text);
    font-family: inherit;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
    white-space: nowrap;
    text-decoration: none;
    box-shadow: none;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.kasomax-offers .kasomax-offers__button:hover,
.kasomax-offers .kasomax-offers__button:focus-visible {
    background: #1FC75C;
    color: var(--ko-text);
}

.kasomax-offers .kasomax-offers__button[disabled] {
    opacity: 0.7;
    cursor: progress;
}

.kasomax-offers .kasomax-offers__button--small {
    width: auto;
    flex: none;
}

.kasomax-offers .kasomax-offers__note {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
    color: #3F435A;
}

.kasomax-offers__note-icon {
    flex: none;
    width: 24px;
    height: 24px;
    color: #2A55D5;
}

/* Poszukujesz innych warunków? */
.kasomax-offers__more {
    position: relative;
    overflow: hidden;
    display: grid;
    grid-template-columns: 1fr auto;
    align-items: center;
    gap: 32px;
    padding: 64px;
    border: 2px solid #fff;
    border-radius: 16px;
    /* #E7F6F9 100% -> 0%: od lewej krawędzi (ok. 3/4 wysokości) do prawego dolnego rogu */
    background: linear-gradient(97deg, #E7F6F9 0%, rgba(231, 246, 249, 0) 100%);
    -webkit-backdrop-filter: blur(40px);
    backdrop-filter: blur(40px);
}

/* 32px między wyróżnioną ofertą a "Poszukujesz innych warunków?" (na telefonie odstęp kolumny to 24px) */
.kasomax-offers__featured + .kasomax-offers__more {
    margin-top: 0;
}

.kasomax-offers__more-text {
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

/* 24px między tekstami a przyciskiem */
.kasomax-offers__more-text .kasomax-offers__button--small {
    margin-top: 24px;
}

.kasomax-offers .kasomax-offers__more-title {
    font-family: inherit;
    font-size: 60px;
    line-height: 1.1;
    font-weight: 700;
    color: var(--ko-text);
}

.kasomax-offers__more-light {
    display: block;
    font-weight: 400;
}

.kasomax-offers .kasomax-offers__more-lead {
    margin-top: 12px;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 500;
    color: #3F435A;
}

/* Misiek z lupą przy dolnej krawędzi boxu (wychodzi poza padding), za nim gradient z nagłówka obrócony o 180° i odbity poziomo */
.kasomax-offers__more-art {
    position: relative;
    align-self: end;
    width: 330px;
    /* Wchodzi w padding u góry i u dołu - prawie cała wysokość boxu bez powiększania go */
    margin: -64px 96px -64px 0;
}

/* Pod miśkiem i tekstem, nad tłem boxu (box ma backdrop-filter = własny kontekst warstw) */
.kasomax-offers__more-gradient {
    z-index: -1;
    position: absolute;
    left: 50%;
    bottom: 0;
    width: 460px;
    max-width: none;
    height: auto;
    /* obrót o 180° + odbicie poziome */
    transform: translateX(-50%) rotate(180deg) scaleX(-1);
    pointer-events: none;
}

.kasomax-offers__more-mascot {
    position: relative;
    display: block;
    width: 100%;
    height: auto;
}

/* Lista pozostałych firm */
.kasomax-offers__list {
    overflow: hidden;
    border: 1px solid var(--ko-line);
    border-radius: 20px;
    background: #fff;
}

.kasomax-offers__list-head {
    display: flex;
    align-items: center;
    gap: 24px;
    /* Ramka nagłówka przykrywa ramkę listy (-1px) */
    margin: -1px -1px 0;
    padding: 32px;
    background: #E7F6F9;
    border: 1px solid #D4DDF7;
    border-radius: 20px 20px 0 0;
}

.kasomax-offers__list-check {
    flex: none;
    display: block;
    width: 64px;
    height: auto;
}

.kasomax-offers .kasomax-offers__list-title {
    font-family: inherit;
    font-size: 30px;
    line-height: 1.1;
    font-weight: 700;
    color: #131739;
}

/* 8px pod nagłówkiem listy */
.kasomax-offers .kasomax-offers__list-lead {
    margin-top: 8px;
    font-size: 24px;
    line-height: 1.3;
    font-weight: 500;
    color: #3F435A;
}

/* Bez wcięcia listy (motyw dodaje ul w treści padding-left) */
.kasomax-offers ul.kasomax-offers__rows {
    list-style: none;
    margin: 0;
    padding: 0;
}

.kasomax-offers__row {
    display: grid;
    /* Kolumna kwoty węższa (stała), okres zajmuje resztę */
    grid-template-columns: auto 320px 1fr auto;
    align-items: center;
    gap: 24px;
    margin: 0;
    padding: 16px 32px 16px 16px;
    border-top: 1px solid #D4DDF7;
}

.kasomax-offers__row:first-child {
    border-top: 0;
}

.kasomax-offers__row-stat {
    display: flex;
    flex-direction: column;
    gap: 0;
    padding-left: 48px;
}

/* Separator po logo: 48px od logo (24px odstępu kolumn + 24px) i 48px do tekstu (padding-left kolumny) */
.kasomax-offers__row .kasomax-offers__logo--small {
    margin-right: 24px;
}

.kasomax-offers__logo--small + .kasomax-offers__row-stat {
    border-left: 1px solid #D4DDF7;
}

.kasomax-offers__row-label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
    color: #3F435A;
}

.kasomax-offers__row-label svg {
    flex: none;
    width: 24px;
    height: 24px;
    color: var(--ko-blue);
}

/* Wartość pod tekstem etykiety (ikona 24px + odstęp 8px) */
.kasomax-offers__row-value {
    padding-left: 32px;
    font-size: 20px;
    line-height: 1.5;
    font-weight: 700;
    color: #131739;
}

.kasomax-offers .kasomax-offers__row-link {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    min-height: 44px;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
    color: var(--ko-text);
    text-decoration: none;
}

.kasomax-offers .kasomax-offers__row-link:hover {
    color: var(--ko-blue);
}

.kasomax-offers__row-arrow {
    display: flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    width: 22px;
    height: 22px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 50%;
    background: #25DA67;
    color: var(--ko-text);
}

/* Tablet */
@container (max-width: 1000px) {
    .kasomax-offers .kasomax-offers__title { font-size: 56px; }
    .kasomax-offers mark.kasomax-offers__hl { font-size: 46px; }
    .kasomax-offers__hero-mascot { width: 220px; margin-right: 24px; }
    .kasomax-offers__details { grid-template-columns: 1fr 1fr; }
    .kasomax-offers__decision { grid-column: 1 / -1; }
    .kasomax-offers__more { padding: 40px; }
    .kasomax-offers .kasomax-offers__more-title { font-size: 44px; }
    .kasomax-offers__more-art { width: 250px; margin: -40px 24px -40px 0; }
    .kasomax-offers__more-gradient { width: 350px; }
    .kasomax-offers__row-stat { padding-left: 24px; }
}

/* Telefon */
@container (max-width: 700px) {
    .kasomax-offers { --ko-overlap: 32px; }
    .kasomax-offers__hero-section { padding-top: 40px; }
    .kasomax-offers__body { padding-bottom: 40px; }
    .kasomax-offers__inner { padding: 0 16px; gap: 24px; }
    .kasomax-offers .kasomax-offers__hero-gradient { max-width: 70%; }

    /* Telefon: tekst na ok. 3/4 szerokości, obok mały misiek jako akcent (stoi na boxie oferty) */
    .kasomax-offers__hero { min-height: 0; flex-direction: row; align-items: flex-end; gap: 8px; }
    .kasomax-offers .kasomax-offers__title { flex: 1 1 auto; min-width: 0; align-self: center; font-size: 28px; padding-bottom: 16px; }
    .kasomax-offers mark.kasomax-offers__hl { font-size: 24px; }
    .kasomax-offers__featured { padding: 20px 16px; }
    .kasomax-offers__hero-mascot { flex: none; align-self: flex-end; width: 76px; margin: 0; }

    .kasomax-offers__featured { border-radius: 16px; }
    .kasomax-offers__badge { left: 16px; font-size: 14px; }
    .kasomax-offers__partner { gap: 16px; padding-bottom: 20px; }
    .kasomax-offers__logo { width: 120px; height: 56px; padding: 8px; }
    .kasomax-offers__partner-text { min-height: 56px; padding-left: 16px; }
    .kasomax-offers .kasomax-offers__partner-name { font-size: 18px; }
    .kasomax-offers .kasomax-offers__product { font-size: 14px; }

    .kasomax-offers__details { gap: 16px 12px; padding: 20px 0; }
    .kasomax-offers__stat { padding-left: 12px; }
    .kasomax-offers__stat-label { font-size: 14px; }
    .kasomax-offers__stat-value { font-size: 20px; }
    .kasomax-offers__decision { gap: 12px; padding: 14px; }
    .kasomax-offers__decision-icon { width: 40px; height: 40px; }
    .kasomax-offers .kasomax-offers__decision-title { font-size: 18px; }
    .kasomax-offers .kasomax-offers__decision-text { font-size: 14px; }

    .kasomax-offers__cta { gap: 12px; padding-top: 20px; }
    .kasomax-offers .kasomax-offers__button { min-height: 56px; font-size: 17px; }
    .kasomax-offers .kasomax-offers__note { font-size: 12px; justify-content: center; text-align: center; }

    .kasomax-offers__more {
        grid-template-columns: 1fr auto;
        gap: 0 8px;
        min-height: 0;
        padding: 24px 16px 0;
    }
    .kasomax-offers__featured + .kasomax-offers__more { margin-top: 8px; }
    .kasomax-offers__more-text { grid-column: 1 / -1; }
    .kasomax-offers .kasomax-offers__more-title { font-size: 32px; }
    .kasomax-offers .kasomax-offers__more-lead { margin-top: 8px; font-size: 16px; }
    .kasomax-offers .kasomax-offers__more-text .kasomax-offers__button--small { min-height: 52px; margin: 20px 0 24px; padding: 12px 28px; }
    /* Misiek obok przycisku, przy dolnej krawędzi */
    .kasomax-offers__more-art { grid-row: 2; grid-column: 2; width: 130px; margin: -76px 0 0; }
    .kasomax-offers__more-gradient { width: 210px; }

    .kasomax-offers__list { border-radius: 16px; }
    .kasomax-offers__list-head { align-items: flex-start; gap: 14px; padding: 20px 16px; border-radius: 16px 16px 0 0; }
    .kasomax-offers__list-check { width: 44px; }
    .kasomax-offers .kasomax-offers__list-title { font-size: 20px; }
    .kasomax-offers .kasomax-offers__list-lead { font-size: 16px; }

    /* Kafelek: logo na środku, pod nim kwota i okres, na dole przycisk "Zobacz ofertę" */
    .kasomax-offers__row { grid-template-columns: 1fr 1fr; gap: 16px 12px; padding: 20px 16px; }
    .kasomax-offers__row .kasomax-offers__logo--small { grid-column: 1 / -1; justify-self: center; width: 160px; height: 64px; margin-right: 0; }
    .kasomax-offers__row-stat { align-items: center; padding-left: 0; text-align: center; }
    .kasomax-offers__logo--small + .kasomax-offers__row-stat { border-left: 0; }
    .kasomax-offers__row-label { justify-content: center; font-size: 14px; }
    .kasomax-offers__row-value { padding-left: 0; font-size: 18px; }
    .kasomax-offers .kasomax-offers__row-link {
        grid-column: 1 / -1;
        justify-content: center;
        width: 100%;
        min-height: 48px;
        padding: 12px 24px;
        border: 1px solid rgba(255, 255, 255, 0.65);
        border-radius: 999px;
        background: var(--ko-green);
        color: var(--ko-text);
        font-weight: 700;
    }
    .kasomax-offers .kasomax-offers__row-link:hover { background: var(--ko-green); color: var(--ko-text); filter: brightness(0.95); }
    .kasomax-offers__row-link .kasomax-offers__row-arrow { display: none; }

    /* Oferta wyróżniona: logo na środku, typ produktu (jeśli jest) pod nim */
    .kasomax-offers__partner { flex-direction: column; justify-content: center; gap: 8px; text-align: center; }
    .kasomax-offers__partner-text { min-height: 0; padding-left: 0; border-left: 0; }
}

/* ==========================================================================
   Dostęp do wniosku przez PESEL (offer-page/auth.php) - pełny ekran, bez menu strony
   ========================================================================== */

.kasomax-auth {
    --ka-text: #131739;
    --ka-blue: #2244AA;
    --ka-green: #25DA67;
    --ka-green-dark: #16833E;
    --ka-green-soft: #E9FBF0;
    --ka-line: #E1E2EA;
    --ka-muted: #5B5F7A;
    --ka-error: #B42323;
    position: fixed;
    inset: 0;
    z-index: 100000;
    overflow-x: hidden;
    overflow-y: auto;
    display: flex;
    flex-direction: column;
    container-type: inline-size;
    font-family: 'SN Pro', 'SN pro', sans-serif;
    color: var(--ka-text);
    background: linear-gradient(180deg, #E7F6F9 0%, #F4FBFC 45%, #FFFFFF 100%);
}

.kasomax-auth *,
.kasomax-auth *::before,
.kasomax-auth *::after {
    box-sizing: border-box;
}

.kasomax-auth p,
.kasomax-auth h2 {
    margin: 0;
}

.kasomax-auth__deco {
    position: absolute;
    z-index: 0;
    width: min(502px, 45vw);
    height: auto;
    pointer-events: none;
}

.kasomax-auth__deco--right { top: 0; right: 0; }
.kasomax-auth__deco--left { bottom: 0; left: 0; transform: scale(-1, -1); }

/* Logo i karta razem wyśrodkowane w pionie */
.kasomax-auth__header {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 1200px;
    margin: auto auto 0;
    padding: 24px 24px 0;
    display: flex;
    justify-content: center;
}

.kasomax-auth__logo {
    display: block;
    margin: 0 auto;
    height: 36px;
    width: auto;
    max-width: 220px;
}

.kasomax-auth__main {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 640px;
    margin: 0 auto auto;
    padding: 32px 24px 48px;
}

.kasomax-auth__card {
    padding: 32px 40px;
    border-radius: 16px;
    /* Jak panel formularza wniosku (.kasomax-step-panel): półprzezroczysta biel, bez ramki i cienia */
    background: rgba(255, 255, 255, 0.5);
}

/* Treść */
.kasomax-auth__content {
    display: flex;
    flex-direction: column;
    gap: 20px;
}

.kasomax-auth__pill {
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 6px 14px 6px 8px;
    border-radius: 999px;
    background: var(--ka-green-soft);
    color: var(--ka-green-dark);
    font-size: 14px;
    font-weight: 600;
}

.kasomax-auth__pill-dot {
    width: 22px;
    height: 22px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: var(--ka-green);
    color: var(--ka-text);
}

.kasomax-auth .kasomax-auth__title {
    font-family: inherit;
    font-size: 44px;
    line-height: 1.15;
    font-weight: 500;
    letter-spacing: -0.01em;
    color: var(--ka-text);
}

.kasomax-auth__hl {
    position: relative;
    display: inline-block;
    font-weight: 700;
    color: var(--ka-blue);
}

.kasomax-auth__hl svg {
    position: absolute;
    left: 0;
    bottom: -10px;
    width: 100%;
    height: 14px;
}

.kasomax-auth .kasomax-auth__lead {
    font-size: 17px;
    line-height: 1.55;
    color: #4A4E6A;
}

/* Formularz */
.kasomax-auth__form {
    display: flex;
    flex-direction: column;
    gap: 16px;
    margin: 4px 0 0;
}

/* Pole PESEL - ten sam wygląd co pola formularza wniosku (.alm-loan-application .alm-input):
   52px, ramka #E1E2EA, etykieta "Wpisz ..." w polu, uniesiona na ramkę przy fokusie / po wpisaniu */
.kasomax-auth__field {
    position: relative;
}

.kasomax-auth .kasomax-auth__input {
    display: block;
    width: 100%;
    height: 52px;
    margin: 0;
    padding: 0 14px;
    border: 1px solid #E1E2EA;
    border-radius: 12px;
    background: #fff;
    box-shadow: none;
    outline: none;
    font-family: 'SN pro', sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    letter-spacing: -0.03em;
    color: #3F435A;
    transition: border-color 0.2s ease;
}

.kasomax-auth .kasomax-auth__input:focus {
    border-color: #16833E;
    box-shadow: none;
    color: #3F435A;
}

.kasomax-auth .kasomax-auth__label {
    position: absolute;
    top: 26px;
    left: 14px;
    max-width: calc(100% - 28px);
    margin: 0;
    padding: 0 4px;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    background: #fff;
    font-family: 'SN pro', sans-serif;
    font-size: 14px;
    font-weight: 400;
    line-height: 1;
    letter-spacing: -0.03em;
    color: #3F435A;
    transform: translateY(-50%);
    transition: transform 0.3s, font-size 0.3s, color 0.25s;
    pointer-events: none;
}

.kasomax-auth .kasomax-auth__input:focus ~ .kasomax-auth__label,
.kasomax-auth .kasomax-auth__input:not(:placeholder-shown) ~ .kasomax-auth__label {
    max-width: calc(100% - 24px);
    font-size: 11px;
    transform: translateY(calc(-50% - 26px));
}

.kasomax-auth .kasomax-auth__input:focus ~ .kasomax-auth__label {
    color: #16833E;
}

/* Błąd (zły PESEL, wygasła sesja) - jak komunikat walidacji w formularzu */
.kasomax-auth .kasomax-auth__field--error .kasomax-auth__input {
    border-color: #dc3545;
}

.kasomax-auth .kasomax-auth__field--error .kasomax-auth__input:not(:focus) ~ .kasomax-auth__label {
    color: #dc3545;
}

.kasomax-auth .kasomax-auth__error {
    margin: 4px 0 0;
    padding-left: 16px;
    font-size: 12px;
    font-weight: 500;
    line-height: 1.2;
    color: #dc3545;
}

.kasomax-auth .kasomax-auth__button {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 10px;
    width: 100%;
    min-height: 60px;
    margin: 0;
    padding: 16px 28px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 999px;
    background: var(--ka-green);
    box-shadow: none;
    color: var(--ka-text);
    font-family: inherit;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: normal;
    text-transform: none;
    cursor: pointer;
    transition: background-color 0.2s ease;
}

.kasomax-auth .kasomax-auth__button:hover,
.kasomax-auth .kasomax-auth__button:focus-visible {
    background: #1FC75C;
    color: var(--ka-text);
}

.kasomax-auth .kasomax-auth__note {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 8px;
    font-size: 14px;
    line-height: 1.4;
    color: var(--ka-muted);
}

.kasomax-auth__note svg {
    flex: none;
}

/* Telefon */
@container (max-width: 900px) {
    .kasomax-auth__header { padding: 16px 16px 0; }
    .kasomax-auth__logo { height: 30px; }
    .kasomax-auth__deco { width: 260px; }
    .kasomax-auth__main { padding: 16px 16px 24px; }

    .kasomax-auth__card {
        padding: 20px 16px;
        border-radius: 12px;
    }

    .kasomax-auth .kasomax-auth__title { font-size: 30px; }
    .kasomax-auth__hl svg { bottom: -8px; height: 12px; }
    .kasomax-auth .kasomax-auth__lead { font-size: 16px; }
    .kasomax-auth .kasomax-auth__note { font-size: 13px; justify-content: flex-start; }
}

/* Telefon: pole PESEL 48px jak pola formularza wniosku */
@container (max-width: 640px) {
    .kasomax-auth .kasomax-auth__input { height: 48px; }
    .kasomax-auth .kasomax-auth__label { top: 24px; }
    .kasomax-auth .kasomax-auth__input:focus ~ .kasomax-auth__label,
    .kasomax-auth .kasomax-auth__input:not(:placeholder-shown) ~ .kasomax-auth__label { transform: translateY(calc(-50% - 24px)); }
}

/* ==========================================================================
   Strona "inne oferty" (offer-page/decline-offers.php, shortcode [alm_decline_page_offers])
   ========================================================================== */

.kasomax-decline {
    container-type: inline-size;
    font-family: 'SN Pro', 'SN pro', sans-serif;
    color: #131739;
}

.kasomax-decline *,
.kasomax-decline *::before,
.kasomax-decline *::after {
    box-sizing: border-box;
}

.kasomax-decline p,
.kasomax-decline h2 {
    margin: 0;
}



/* Tabela - ten sam styl co lista firm na stronie ofert (bez nagłówka - zaokrąglona z każdej strony) */
.kasomax-decline__list {
    overflow: hidden;
    border: 1px solid #D4DDF7;
    border-radius: 20px;
    background: #fff;
}





.kasomax-decline ul.kasomax-decline__rows {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* Wiersz: logo | 4 dane (równe kolumny) | przycisk */
.kasomax-decline .kasomax-decline__row {
    display: grid;
    grid-template-columns: 148px repeat(4, minmax(0, 1fr)) auto;
    align-items: center;
    column-gap: 24px;
    margin: 0;
    padding: 24px 32px 24px 16px;
    border-top: 1px solid #D4DDF7;
}

.kasomax-decline .kasomax-decline__row:first-child {
    border-top: 0;
}

.kasomax-decline__logo {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    width: 148px;
    height: 64px;
    padding: 8px 12px;
    border-radius: 8px;
    background: #F5F6F9;
}

.kasomax-decline__logo img {
    display: block;
    max-width: 100%;
    max-height: 100%;
    object-fit: contain;
}

.kasomax-decline__logo-name {
    font-size: 16px;
    font-weight: 700;
    text-align: center;
}

.kasomax-decline__badge {
    position: absolute;
    top: -11px;
    left: 10px;
    max-width: calc(100% - 20px);
    padding: 2px 10px;
    overflow: hidden;
    border-radius: 6px;
    background: #25DA67;
    color: #131739;
    font-size: 12px;
    line-height: 1.5;
    font-weight: 700;
    white-space: nowrap;
    text-overflow: ellipsis;
}

.kasomax-decline__stat {
    display: flex;
    flex-direction: column;
    min-width: 0;
}

.kasomax-decline__stat--first {
    padding-left: 24px;
    border-left: 1px solid #D4DDF7;
}

.kasomax-decline__label {
    display: flex;
    align-items: center;
    gap: 8px;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 500;
    color: #3F435A;
}

.kasomax-decline__label svg {
    flex: none;
    width: 24px;
    height: 24px;
    color: #2244AA;
}

.kasomax-decline__value {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 4px 6px;
    padding-left: 32px;
    font-size: 20px;
    line-height: 1.4;
    font-weight: 700;
    color: #131739;
}

/* Szczegółowe godziny: dymek po najechaniu / fokusie */
.kasomax-decline__info {
    position: relative;
    display: inline-flex;
}

.kasomax-decline .kasomax-decline__info-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 20px;
    height: 20px;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #E7F6F9;
    box-shadow: none;
    color: #2244AA;
    cursor: help;
}

.kasomax-decline__tooltip {
    position: absolute;
    right: -8px;
    bottom: calc(100% + 8px);
    z-index: 5;
    width: max-content;
    max-width: 240px;
    padding: 10px 12px;
    border-radius: 10px;
    background: #131739;
    color: #fff;
    font-size: 13px;
    line-height: 1.45;
    font-weight: 500;
    opacity: 0;
    visibility: hidden;
    transition: opacity 0.15s ease;
}

.kasomax-decline__info:hover .kasomax-decline__tooltip,
.kasomax-decline__info:focus-within .kasomax-decline__tooltip {
    opacity: 1;
    visibility: visible;
}

.kasomax-decline .kasomax-decline__button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 48px;
    padding: 12px 24px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 999px;
    background: #25DA67;
    box-shadow: none;
    color: #131739;
    font-family: inherit;
    font-size: 16px;
    line-height: 1.5;
    font-weight: 700;
    letter-spacing: normal;
    text-transform: none;
    text-decoration: none;
    white-space: nowrap;
    transition: background-color 0.2s ease;
}

.kasomax-decline .kasomax-decline__button:hover,
.kasomax-decline .kasomax-decline__button:focus-visible {
    background: #1FC75C;
    color: #131739;
}

.kasomax-decline .kasomax-decline__empty {
    padding: 32px;
    font-size: 18px;
    color: #3F435A;
}



/* Tablet: logo + 4 dane w rzędzie, przycisk pod spodem */
@container (max-width: 1100px) {
    .kasomax-decline .kasomax-decline__row { grid-template-columns: 132px repeat(4, minmax(0, 1fr)); row-gap: 16px; }
    .kasomax-decline__logo { width: 132px; }
    .kasomax-decline__value { font-size: 18px; }
    .kasomax-decline__cta { grid-column: 1 / -1; }
    .kasomax-decline .kasomax-decline__button { width: 100%; }
}

/* Telefon: logo, dane 2x2, przycisk na całą szerokość */
@container (max-width: 700px) {



    .kasomax-decline__list { border-radius: 16px; }




    .kasomax-decline .kasomax-decline__row { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px 12px; padding: 24px 16px 20px; }
    .kasomax-decline__logo { grid-column: 1 / -1; width: 140px; height: 56px; }
    .kasomax-decline__stat--first { padding-left: 0; border-left: 0; }
    .kasomax-decline__label { font-size: 14px; }
    .kasomax-decline__label svg { width: 20px; height: 20px; }
    .kasomax-decline__value { padding-left: 28px; font-size: 17px; }
    .kasomax-decline__tooltip { max-width: 200px; }

}

/* ==========================================================================
   Dokończ wniosek ([alm_complete_application], #almCompleteApplication) - kolory i akcenty Kasomax.
   Pola i zgody biorą wygląd z reguł formularza .alm-loan-application wyżej.
   ========================================================================== */

#almCompleteApplication {
    --kc-text: #131739;
    --kc-muted: #3F435A;
    --kc-blue: #2244AA;
    --kc-green: #25DA67;
    --kc-green-dark: #16833E;
    --kc-green-soft: #E9FBF0;
    --kc-line: #D4DDF7;
    --kc-light: #E7F6F9;
    container-type: inline-size;
    padding: 48px 24px 72px;
    font-family: 'SN Pro', 'SN pro', sans-serif;
    color: var(--kc-text);
    background: linear-gradient(180deg, #E7F6F9 0%, rgba(231, 246, 249, 0) 70%);
}

#almCompleteApplication #almCompleteForm {
    max-width: 800px;
    margin: 0 auto;
}

/* Nagłówek: imię i kwota pogrubione z zielonym podkreśleniem */
#almCompleteApplication .alm-cta-heading {
    margin: 0 0 12px;
    font-family: inherit;
    font-size: 40px;
    line-height: 1.15;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: var(--kc-text);
    text-align: center;
}

#almCompleteApplication .alm-name-highlight {
    white-space: nowrap;
    font-weight: 700;
    color: var(--kc-text);
    background: linear-gradient(transparent 72%, rgba(37, 218, 103, 0.55) 72%, rgba(37, 218, 103, 0.55) 92%, transparent 92%);
}

#almCompleteApplication .alm-cta-description {
    margin: 0 0 32px;
    font-size: 18px;
    line-height: 1.5;
    font-weight: 500;
    color: var(--kc-muted);
    text-align: center;
}

/* Sekcje (akordeon): białe karty z ramką Kasomax */
#almCompleteApplication .alm-accordion-section {
    margin: 0 0 16px;
    overflow: hidden;
    border: 1px solid var(--kc-line);
    border-radius: 16px;
    background: #fff;
    box-shadow: none;
}

#almCompleteApplication .alm-accordion-section.is-incomplete {
    border-color: var(--kc-line);
}

#almCompleteApplication .alm-accordion-header,
#almCompleteApplication .alm-accordion-section.is-incomplete .alm-accordion-header,
#almCompleteApplication .alm-accordion-section.is-open .alm-accordion-header,
#almCompleteApplication .alm-accordion-section.is-incomplete.is-open .alm-accordion-header {
    min-height: 64px;
    padding: 16px 24px;
    background: #fff;
    border-bottom: 1px solid transparent;
}

#almCompleteApplication .alm-accordion-section.is-incomplete .alm-accordion-header {
    background: var(--kc-light);
}

#almCompleteApplication .alm-accordion-header:hover,
#almCompleteApplication .alm-accordion-section.is-incomplete .alm-accordion-header:hover {
    background: #F4FBFC;
}

#almCompleteApplication .alm-accordion-section.is-open .alm-accordion-header {
    border-bottom-color: var(--kc-line);
}

#almCompleteApplication .alm-accordion-heading {
    gap: 12px;
}

#almCompleteApplication .alm-accordion-header h3.alm-step-title {
    margin: 0;
    font-family: inherit;
    font-size: 20px;
    line-height: 1.2;
    font-weight: 700;
    letter-spacing: -0.02em;
    color: var(--kc-text);
}

/* Status: gotowe - zielony, do uzupełnienia - niebieski Kasomax */
#almCompleteApplication .alm-accordion-status-icon {
    width: 28px;
    height: 28px;
    border-radius: 50%;
}

#almCompleteApplication .alm-accordion-section.is-complete .alm-accordion-status-icon {
    color: var(--kc-green);
}

#almCompleteApplication .alm-accordion-section.is-complete .alm-accordion-icon-complete path {
    stroke: var(--kc-text);
}

#almCompleteApplication .alm-accordion-section.is-incomplete .alm-accordion-status-icon {
    color: var(--kc-blue);
    background: #fff;
}

#almCompleteApplication .alm-accordion-status-text {
    font-size: 15px;
    line-height: 1.4;
    font-weight: 600;
}

#almCompleteApplication .alm-accordion-section.is-complete .alm-accordion-status-text,
#almCompleteApplication .alm-accordion-section.is-complete .alm-accordion-toggle {
    color: var(--kc-green-dark);
}

#almCompleteApplication .alm-accordion-section.is-incomplete .alm-accordion-status-text,
#almCompleteApplication .alm-accordion-section.is-incomplete .alm-accordion-toggle {
    color: var(--kc-blue);
}

#almCompleteApplication .alm-accordion-content {
    padding: 32px 24px 24px;
    background: rgba(255, 255, 255, 0.5);
}

/* Zgody: panel jak w formularzu wniosku */
#almCompleteApplication .alm-form-step.active:not(.alm-accordion-section) {
    margin-top: 32px;
    padding: 32px 40px;
    border-radius: 16px;
    background: rgba(255, 255, 255, 0.5);
}

#almCompleteApplication .alm-form-step.active:not(.alm-accordion-section) .alm-step-title {
    margin: 0 0 16px;
    font-family: inherit;
    font-size: 24px;
    line-height: 1.1;
    font-weight: 400;
    letter-spacing: -0.03em;
    color: var(--kc-muted);
}

#almCompleteApplication .alm-expand-all-consents a,
#almCompleteApplication #expand-all-consents {
    color: var(--kc-blue);
    font-weight: 600;
    text-decoration: none;
}

#almCompleteApplication .alm-expand-all-consents a:hover {
    text-decoration: underline;
}

#almCompleteApplication .alm-partners-consents {
    border-left-color: var(--kc-line);
}

#almCompleteApplication .alm-partner-name {
    color: var(--kc-text);
}

#almCompleteApplication .alm-partner-toggle {
    color: var(--kc-blue);
}

/* Przycisk "Złóż wniosek o pożyczkę" - zielona pigułka Kasomax */
#almCompleteApplication .alm-form-navigation {
    margin-top: 32px;
}

#almCompleteApplication .alm-form-navigation .alm-next-step {
    width: 100%;
    min-height: 60px;
    padding: 16px 32px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 999px;
    background: var(--kc-green);
    box-shadow: none;
    color: var(--kc-text);
    font-family: inherit;
    font-size: 18px;
    line-height: 1.2;
    font-weight: 700;
    text-transform: none;
}

#almCompleteApplication .alm-form-navigation .alm-next-step:hover {
    background: #1FC75C;
    color: var(--kc-text);
}

/* Popup powitalny (dane z wcześniejszego wniosku) */
#almCompleteApplication .alm-modal-overlay {
    background: rgba(19, 23, 57, 0.55);
}

#almCompleteApplication .alm-modal-content {
    border-radius: 20px;
    color: var(--kc-text);
    font-family: inherit;
}

#almCompleteApplication .alm-modal-content h3 {
    font-size: 24px !important;
    font-weight: 700 !important;
    color: var(--kc-text);
}

#almCompleteApplication #almPopupEdit,
#almCompleteApplication #popup-expand-all-consents {
    color: var(--kc-blue) !important;
}

#almCompleteApplication .alm-popup-consents-module {
    border-color: var(--kc-line) !important;
    border-radius: 12px !important;
}

#almCompleteApplication #almPopupOK {
    min-height: 52px;
    border: 1px solid rgba(255, 255, 255, 0.65);
    border-radius: 999px;
    background: var(--kc-green) !important;
    color: var(--kc-text) !important;
    font-size: 17px;
    font-weight: 700;
    letter-spacing: normal;
    text-transform: none;
}

#almCompleteApplication #almPopupOK:hover {
    background: #1FC75C !important;
}

/* Telefon */
@container (max-width: 640px) {
    #almCompleteApplication .alm-cta-heading { font-size: 28px; }
    #almCompleteApplication .alm-cta-description { margin-bottom: 24px; font-size: 16px; }
    #almCompleteApplication .alm-accordion-header,
    #almCompleteApplication .alm-accordion-section.is-incomplete .alm-accordion-header,
    #almCompleteApplication .alm-accordion-section.is-open .alm-accordion-header,
    #almCompleteApplication .alm-accordion-section.is-incomplete.is-open .alm-accordion-header { padding: 14px 16px; }
    #almCompleteApplication .alm-accordion-header h3.alm-step-title { font-size: 17px; }
    #almCompleteApplication .alm-accordion-status-text { font-size: 13px; }
    #almCompleteApplication .alm-accordion-content { padding: 28px 16px 20px; }
    #almCompleteApplication .alm-form-step.active:not(.alm-accordion-section) { padding: 20px 16px; border-radius: 12px; }
    #almCompleteApplication .alm-form-step.active:not(.alm-accordion-section) .alm-step-title { font-size: 20px; }
}

/* ==========================================================================
   Modale wtyczki w stylu Kasomax: potwierdzenie telefonu / e-maila / NIP (formularz), "To już wszystkie marki"
   i "Przechodzę do innych ofert" (strona ofert), edycja kwoty i okresu (formularz).
   Modale budowane w JS mają style w atrybucie style - stąd !important.
   ========================================================================== */

.alm-modal-overlay,
.alm-modal {
    background: rgba(19, 23, 57, 0.55) !important;
    -webkit-backdrop-filter: blur(4px);
    backdrop-filter: blur(4px);
    padding: 16px;
    box-sizing: border-box;
}

.alm-modal-overlay .alm-modal-content,
.alm-modal .alm-modal-content {
    box-sizing: border-box;
    width: 100% !important;
    max-width: 480px !important;
    padding: 32px !important;
    border: 0 !important;
    border-radius: 20px !important;
    background: #fff !important;
    box-shadow: 0 24px 60px rgba(19, 23, 57, 0.18) !important;
    font-family: 'SN Pro', 'SN pro', sans-serif;
    color: #131739;
    text-align: center;
}

/* Tytuł */
.alm-modal-overlay .alm-modal-content h3,
.alm-modal .alm-modal-title,
.alm-modal .alm-modal-subtitle {
    margin: 0 0 12px !important;
    font-family: inherit !important;
    font-size: 22px !important;
    line-height: 1.25 !important;
    font-weight: 700 !important;
    letter-spacing: -0.02em;
    color: #131739 !important;
}

/* Wpisane dane do potwierdzenia (telefon, e-mail, NIP) i pozostałe teksty */
.alm-modal-overlay .alm-modal-content p {
    font-family: inherit;
    font-size: 16px !important;
    line-height: 1.5 !important;
    color: #3F435A !important;
}

.alm-modal-overlay .alm-modal-content:not(.alm-modal-content--with-consents) h3 + p {
    margin: 0 0 24px !important;
    font-size: 20px !important;
    font-weight: 700 !important;
    color: #2244AA !important;
    word-break: break-word;
}

/* Telefon + e-mail razem: etykiety "Telefon:" / "Email:" */
.alm-modal-overlay .alm-modal-content h3 + div:not([class]) {
    margin-bottom: 24px !important;
    padding: 16px 20px;
    border-radius: 12px;
    background: #E7F6F9;
}

.alm-modal-overlay .alm-modal-content h3 + div:not([class]) > div {
    font-size: 14px;
    font-weight: 500 !important;
    color: #3F435A;
}

.alm-modal-overlay .alm-modal-content h3 + div:not([class]) > p {
    font-size: 18px !important;
    font-weight: 700;
    color: #2244AA !important;
    word-break: break-word;
}

/* Przyciski: zielona pigułka (główny) i biała z ramką (drugi) */
.alm-modal-overlay .alm-modal-content button.kt-button,
.alm-modal .alm-modal-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 52px;
    padding: 12px 24px !important;
    border-radius: 999px !important;
    box-shadow: none !important;
    font-family: inherit !important;
    font-size: 16px !important;
    line-height: 1.3 !important;
    font-weight: 700 !important;
    letter-spacing: normal !important;
    text-transform: none !important;
    cursor: pointer;
    transition: background-color 0.2s ease, border-color 0.2s ease;
}

.alm-modal-overlay .alm-modal-content button.alm-revoke-consent-button,
.alm-modal .alm-modal-button {
    border: 1px solid rgba(255, 255, 255, 0.65) !important;
    background: #25DA67 !important;
    color: #131739 !important;
}

.alm-modal-overlay .alm-modal-content button.alm-revoke-consent-button:hover,
.alm-modal .alm-modal-button:hover {
    background: #1FC75C !important;
}

.alm-modal-overlay .alm-modal-content button.alm-next-step-button {
    border: 1px solid #D4DDF7 !important;
    background: #fff !important;
    color: #131739 !important;
}

.alm-modal-overlay .alm-modal-content button.alm-next-step-button:hover {
    border-color: #2244AA !important;
    color: #2244AA !important;
}

/* "To już wszystkie marki…" - kółko z ptaszkiem i odliczanie */
.alm-modal-overlay .alm-modal-content > div:first-child:not([class]) {
    width: 64px !important;
    height: 64px !important;
    margin: 0 auto 16px !important;
    background: #E9FBF0 !important;
}

.alm-modal-overlay .alm-modal-content > div:first-child:not([class]) > div {
    color: #16833E !important;
}

.alm-modal-overlay #countdown {
    color: #16833E !important;
}

/* Edycja kwoty i okresu w formularzu */
.alm-modal .alm-modal-close {
    color: #3F435A;
}

.alm-modal .alm-modal-input-wrapper .alm-input {
    border: 1px solid #E1E2EA;
    border-radius: 12px;
    font-family: inherit;
    font-size: 20px;
    font-weight: 700;
    color: #131739;
}

.alm-modal .alm-modal-input-wrapper .alm-input:focus {
    border-color: #16833E;
    box-shadow: none;
}

.alm-modal .alm-modal-input-suffix {
    color: #3F435A;
}

.alm-modal .alm-modal-button {
    width: 100%;
    margin-top: 8px;
}

@media (max-width: 480px) {
    .alm-modal-overlay .alm-modal-content,
    .alm-modal .alm-modal-content {
        padding: 24px 20px !important;
    }

    .alm-modal-overlay .alm-modal-content h3,
    .alm-modal .alm-modal-title,
    .alm-modal .alm-modal-subtitle {
        font-size: 19px !important;
    }
}
