/* Formularze kontakt (1001157), naprawa (1001158), reklamacja (1001163):
   telefon z krajem, tagi kontaktu, wyrównanie zgód, komunikaty walidacji.
   Wersja: 2026-11-04.4 — bez zmian reguł: bramka kroku 1 naprawy (kategoria)
   i czyszczenia (pakiet, marka, model) używa istniejącego `.us-field-error`. */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) {
    --us-primary: #6169D6;
    --us-primary-soft: #EDEFFB;
    --us-primary-hover: #9AA0E8;
    --us-border: #D9D9D9;
    --us-separator: #E2E2E2;
    --us-ink: #1C1C1C;
    --us-muted: #5A5A5A;
    --us-error: #B42318;
}

/* ---------- 1. Telefon: stały +48 w obramowaniu pola ---------- */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-field {
    min-width: 0;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-frame {
    display: flex;
    align-items: center;
    box-sizing: border-box;
    width: 100%;
    height: 48px;
    min-height: 48px;
    margin: 0;
    padding: 0;
    border: 1px solid var(--us-separator);
    border-radius: 35.2px;
    background: #eee;
    overflow: hidden;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-frame:focus-within {
    outline: 2px solid var(--us-primary);
    outline-offset: 2px;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-prefix {
    display: flex;
    align-items: center;
    align-self: stretch;
    flex: 0 0 auto;
    box-sizing: border-box;
    padding: 0 12px 0 16px;
    border-right: 1px solid var(--us-separator);
    background: transparent;
    color: var(--us-ink);
    font-family: inherit;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 25.6px;
    user-select: none;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-input {
    flex: 1 1 auto;
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 16px !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: var(--us-ink);
    font-family: inherit;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 25.6px;
    outline: 0;
    appearance: none;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-input::placeholder {
    color: #767676;
    opacity: 1;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-frame .wpcf7-form-control-wrap {
    display: contents;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-hint {
    margin: 8px 0 0;
    color: var(--us-muted);
    font-family: inherit;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-code-wrap {
    display: flex;
    align-items: stretch;
    flex: 0 0 auto;
    align-self: stretch;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-frame .wpcf7-form-control-wrap {
    display: contents;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) select.us-phone-code {
    box-sizing: border-box;
    height: 46px !important;
    margin: 0 !important;
    padding: 0 26px 0 14px !important;
    border: 0 !important;
    border-right: 1px solid var(--us-separator) !important;
    border-radius: 0 !important;
    background-color: transparent !important;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath d='M1 1l4 4 4-4' fill='none' stroke='%231C1C1C' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E");
    background-position: right 10px center;
    background-repeat: no-repeat;
    color: var(--us-ink);
    font-family: inherit;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 25.6px;
    outline: 0;
    appearance: none;
    -webkit-appearance: none;
    cursor: pointer;
}

/* ---------- 2. Tagi kontaktu: prawdziwe checkboxy w fieldset ---------- */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-field {
    min-width: 0;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags {
    min-width: 0;
    margin: 0;
    padding: 0;
    border: 0;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-legend {
    display: block;
    margin: 0 0 4px;
    padding: 0;
    color: var(--us-ink);
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: left;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-hint {
    margin: 0 0 12px;
    color: var(--us-muted);
    font-family: inherit;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list {
    display: block;
    min-width: 0;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list .wpcf7-form-control-wrap {
    display: contents;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list .wpcf7-checkbox {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    min-width: 0;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list .wpcf7-list-item {
    display: flex;
    margin: 0;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list label {
    position: relative;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 40px !important;
    min-height: 40px;
    margin: 0;
    padding: 10px 14px !important;
    border: 1px solid var(--us-border) !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: var(--us-ink);
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 20px;
    text-align: center;
    cursor: pointer;
    transition: border-color 120ms ease, background-color 120ms ease;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list .wpcf7-list-item-label {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list label:has(input:checked) .wpcf7-list-item-label {
    font-weight: 600 !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list label:hover {
    border-color: var(--us-primary-hover);
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list label:has(input:checked) {
    border: 1.5px solid var(--us-primary) !important;
    background: var(--us-primary-soft) !important;
    color: var(--us-ink);
    font-weight: 600;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list label:has(input:focus-visible) {
    outline: 2px solid var(--us-primary);
    outline-offset: 2px;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list input[type="checkbox"] {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list label:has(input:checked) .wpcf7-list-item-label::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 6px;
    vertical-align: -3px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3.2L13 5' fill='none' stroke='%236169D6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

/* 2 na rząd od 390 px w dół */
@media (max-width: 390px) {
    html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list .wpcf7-checkbox {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list .wpcf7-list-item,
    html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list label {
        width: 100%;
    }

    html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list label {
        height: 44px;
        min-height: 44px;
        padding: 12px 14px;
    }
}

/* ---------- 3. Zgody: siatka 20 px + tekst ---------- */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-consents {
    display: grid;
    gap: 0;
    min-width: 0;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-consent {
    min-width: 0;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) {
    display: block !important;
    width: 100%;
    min-width: 0;
    margin: 0;
}

/* Obszar kliknięcia zgody = checkbox + jego napis. `fit-content` zawęża etykietę
   do treści, więc klik obok napisu (np. w prawej części wiersza) nie zaznacza zgody.
   Wysokość 44 px zostaje bez zmian — to nadal jeden, wygodny cel dotykowy. */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) label,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-checkbox, .us-cl-checkbox) label {
    width: fit-content;
    max-width: 100%;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) .wpcf7-form-control-wrap,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) :is(.wpcf7-acceptance, .wpcf7-checkbox),
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) .wpcf7-list-item {
    display: contents;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) label:has(.w-form-label) .wpcf7-list-item-label {
    display: none;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) label {
    display: grid;
    grid-template-columns: 20px 1fr;
    column-gap: 12px;
    align-items: start;
    box-sizing: border-box;
    min-height: 44px;
    margin: 0;
    padding: 10px 0;
    color: var(--us-ink);
    font-family: inherit;
    font-size: 16px;
    font-weight: 400;
    line-height: 24px;
    text-align: left;
    cursor: pointer;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) label > input[type="checkbox"] {
    grid-column: 1;
    grid-row: 1;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) :is(.w-form-label, .wpcf7-list-item-label) {
    grid-column: 2 !important;
    grid-row: 1;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) input[type="checkbox"] {
    flex: none;
    box-sizing: border-box;
    grid-column: 1;
    grid-row: 1;
    width: 20px;
    height: 20px;
    margin: 2px 0 0;
    accent-color: var(--us-primary);
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) .w-form-label,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) > span.wpcf7-list-item-label {
    display: block;
    grid-column: 2;
    margin: 0;
    color: var(--us-ink);
    font-family: inherit;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 24px !important;
    text-align: left;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-consent-hint {
    grid-column: 2;
    margin: 2px 0 0;
    color: var(--us-muted);
    font-family: inherit;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) a,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-consent .us-consent-link {
    color: inherit;
    text-decoration: underline;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) input[type="checkbox"]:focus-visible {
    outline: 2px solid var(--us-primary);
    outline-offset: 2px;
}

/* ---------- 4. Komunikaty walidacji ---------- */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-field-error {
    margin: 6px 0 0;
    color: var(--us-error);
    font-family: inherit;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    text-align: left;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-field-error:empty {
    display: none;
}

/* Bramka kroku 1 (naprawa, czyszczenie): odstepy komunikatu przy grupie pol.
   Naprawa — ostatnie dziecko `fieldset.us-rf-symptoms`, 24 px do „Opis usterki"
   daje `margin-bottom` fieldsetu. Czyszczenie — za siatka `f5`/`f6`; bez dolnego
   marginesu komunikat dotyka etykiety „Dodatkowa informacja (opcjonalnie)". */
html body #us-cf7-usluga .us-gate-error {
    margin: 6px 0 0;
}

html body #us-cf7-czyszczenie .us-cl-grid + .us-gate-error {
    margin: 6px 0 12px;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-consent, .us-rf-consent, .us-form-consent) .us-field-error {
    margin: 0 0 4px;
    padding-left: 32px;
}

/* Własne komunikaty zastępują dymki CF7 (bez duplikatów i bez tooltipów). */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .wpcf7-not-valid-tip {
    display: none !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .wpcf7-response-output {
    margin: 16px 0 0;
    font-family: inherit;
    font-size: 16px;
    line-height: 24px;
}

/* Pusty kontener komunikatów CF7 nie zajmuje miejsca (10 px paska z samego obramowania).
   Obramowanie, padding i promień zostają — komunikat po wysłaniu ma wyglądać jak dotąd. */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .wpcf7-response-output:empty {
    display: none !important;
}

/* ---------- 5. Tagi kontaktu w reklamacji (radio jednokrotnego wyboru) ---------- */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags .wpcf7-list-item {
    display: flex;
    margin: 0;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags label {
    position: relative;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 40px;
    margin: 0;
    padding: 10px 14px;
    border: 1px solid var(--us-border);
    border-radius: 999px;
    background: #fff;
    color: var(--us-ink);
    font-family: inherit;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 20px;
    text-align: center;
    cursor: pointer;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags .wpcf7-list-item-label {
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags label:hover {
    border-color: var(--us-primary-hover);
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags label:has(input:checked) {
    border: 1.5px solid var(--us-primary);
    background: var(--us-primary-soft);
    color: var(--us-ink);
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags label:has(input:checked) .wpcf7-list-item-label {
    font-weight: 600 !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags label:has(input:focus-visible) {
    outline: 2px solid var(--us-primary);
    outline-offset: 2px;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags input {
    position: absolute;
    width: 1px;
    height: 1px;
    margin: -1px;
    padding: 0;
    border: 0;
    overflow: hidden;
    clip: rect(0 0 0 0);
    clip-path: inset(50%);
    white-space: nowrap;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags label:has(input:checked) .wpcf7-list-item-label::before {
    content: "";
    display: inline-block;
    width: 16px;
    height: 16px;
    margin-right: 6px;
    vertical-align: -3px;
    background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 16 16'%3E%3Cpath d='M3 8.5l3.2 3.2L13 5' fill='none' stroke='%236169D6' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center / 16px 16px no-repeat;
}

@media (max-width: 390px) {
    html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags {
        display: grid;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 8px;
    }

    html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags .wpcf7-list-item,
    html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags label {
        width: 100%;
    }

    html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-contact-tags label {
        height: 44px;
        padding: 12px 14px;
    }
}

/* Naprawa: repair.css maluje samą etykietę pigułki — zdejmujemy to, stan niesie pastylka. */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-list .wpcf7-list-item-label {
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: inherit !important;
}

/* ---------- 6. Naprawa i czyszczenie: pigułka jest w `.wpcf7-list-item-label` (dziedziczone z repair.css / cleaning.css) ---------- */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-tags, .us-cl-tags) .us-tags-list label {
    display: inline-flex !important;
    height: auto !important;
    min-height: 0;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    font-weight: 400 !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-tags, .us-cl-tags) .us-tags-list .wpcf7-list-item-label {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 40px;
    padding: 10px 14px !important;
    border: 1px solid var(--us-border) !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: var(--us-ink) !important;
    font-family: inherit;
    font-size: 16px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    text-align: center;
    cursor: pointer;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-tags, .us-cl-tags) .us-tags-list .wpcf7-list-item-label:hover {
    border-color: var(--us-primary-hover) !important;
}

/* Zaznaczenie NIE zmienia rozmiaru pastylki (2026-11-05, skoki strony):
   pogrubienie 600 i ramka 1,5 px rozszerzały etykietę, tekst przeskakiwał do
   następnego wiersza i cały blok rósł w trakcie klikania. Stan czytamy kolorem
   ramki, tłem i znacznikiem ✓ (sekcja 8/13) — bez zmiany metryki pudełka. */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-tags, .us-cl-tags) .us-tags-list input:checked + .wpcf7-list-item-label {
    border: 1px solid var(--us-primary) !important;
    background: var(--us-primary-soft) !important;
    color: var(--us-ink) !important;
    font-weight: 400 !important;
    box-shadow: inset 0 0 0 1px var(--us-primary);
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-tags, .us-cl-tags) .us-tags-list input:focus-visible + .wpcf7-list-item-label {
    outline: 2px solid var(--us-primary) !important;
    outline-offset: 2px;
}

@media (max-width: 390px) {
    html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-tags, .us-cl-tags) .us-tags-list .wpcf7-list-item-label {
        height: 44px;
        padding: 12px 14px !important;
    }
}

/* ---------- 7. Podsumowanie kroku 3 (naprawa): telefon w jednej linii ---------- */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-summary {
    display: inline-flex !important;
    align-items: baseline;
    flex-wrap: nowrap;
    gap: .35em;
    white-space: nowrap;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-summary > output {
    display: inline-block !important;
    margin: 0;
    white-space: nowrap;
}

/* ---------- 8. Naprawa: znacznik „✓" w zaznaczonej pastylce objawu ----------
   Tylko CSS (pseudo-element). Wartość checkboxa i treść etykiety zostają czyste —
   „Inny problem" / nazwa objawu idą do opisu zgłoszenia bez dodatkowych znaków.
   2026-11-05 (skoki strony, 8862181): rezerwę miejsca na znak trzyma teraz
   `us-tags.css` (sekcja S) — jeden arkusz dla wszystkich pastylek, więc tutaj
   zostaje wyłącznie definicja znaku sprzed zmiany. */
html body #us-cf7-usluga .us-rf-symptoms .wpcf7-list-item-label::before {
    content: "" !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    margin-right: 0 !important;
    background: none !important;
    vertical-align: baseline !important;
}

html body #us-cf7-usluga .us-rf-symptoms input:checked + .wpcf7-list-item-label::before {
    content: "✓" !important;
    margin-right: 6px !important;
    font: inherit !important;
    color: inherit !important;
    font-weight: inherit !important;
    line-height: inherit !important;
}

/* ---------- 9. Kosmetyka (zatwierdzone przez Luca, msg 8670978) ----------
   C1) Pusty akapit stojący w wierszu przycisków dokładał 16 px (jego margin-bottom)
   tuż pod „Dalej". W definicji CF7 1001158 go nie ma — `<p></p>` w `_form` i `post_content`
   = 0 wystąpień; akapit powstaje w wpautopie przy renderze (zostaje po podmianie
   [cf7mls_step] na przyciski). Dlatego ukrywamy go dokładnie tam, gdzie stoi: jako
   bezpośrednie rodzeństwo po wierszu przycisków, tylko w formularzu naprawy.
   Krok 1 i 2 mają ten akapit na końcu fieldsetu (sam margines), krok 3 nie ma go wcale —
   nic poza tym marginesem nie znika. Efekt: od dołu przycisku do dołu karty 24 px
   = samo padding-bottom karty (wcześniej 16 px akapitu + 24 px = 40 px).
   Celowo nie obejmuje /czyszczenie-ekspresow-do-kawy/ — tam ten margines jest jedynym
   odstępem pod przyciskiem (formularz kończy się na przycisku), więc zostaje bez zmian. */
html body #us-cf7-usluga .cf7mls-btns + p:empty {
    display: none !important;
}

/* C2) Treść komunikatu błędu: #FF0000 → #D32F2F (kontrast 4,0:1 → 5,0:1, WCAG AA).
   Czerwień pochodzi z cf7mls: `.fieldset-cf7mls-wrapper div.wpcf7-validation-errors{color:#f00}`,
   a cf7mls dokłada klasę .wpcf7-validation-errors naszemu kontenerowi w stanie błędu.
   Zakres: wyłącznie komunikat błędu (klasa błędu cf7mls + stan .invalid/[data-status="invalid"]
   formularza). Stany „wysłano" (.wpcf7-mail-sent-ok) i „spam" (.wpcf7-spam-blocked) mają własne
   kolory i zostają bez zmian. Ramka, promień i padding komunikatu nietknięte.
   Bez !important — specyficzność (1,2,2) bije regułę cf7mls (0,2,1), a kolor nie jest nadpisywany inline. */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .wpcf7-response-output.wpcf7-validation-errors,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.wpcf7-form.invalid, .wpcf7-form[data-status="invalid"]) .wpcf7-response-output {
    color: #D32F2F;
}

/* ---------- 10. Kontrast zaznaczonej pastylki objawu (Luca 8688206, D2) ----------
   Biały tekst 14 px na fioletcie zaznaczenia dawał 4,19:1 — poniżej AA (4,5:1 dla 14 px).
   Nowe wypełnienie #6169D6 daje 4,66:1 (4,7:1). Zmieniamy WYŁĄCZNIE tło zaznaczonej
   pastylki w bloku objawów (`.us-rf-symptoms`). Bez zmian: obwódka (#726BEA — nadal
   nośnik koloru marki w pozostałych polach), „✓" (::before z sekcji 8), padding, promień,
   rozmiar tekstu oraz stany hover i focus.
   Sprawdzone w `repair.css`: w bloku objawów #726BEA stoi tylko w regule
   `input:checked + .wpcf7-list-item-label` (hover nie ma fioletu, focus to outline #222),
   więc zakres `:checked` jest dokładny — nie łapie żadnego innego stanu tej pastylki.
   Selektor bez !important — (1,3,3) bije regułę arkusza designu (1,3,1). */
html body #us-cf7-usluga .us-rf-symptoms input:checked + .wpcf7-list-item-label {
    background: #6169D6;
}

/* UPSELL — czyszczenie ekspresu w kroku 3 naprawy. Makieta 2026-11-04.
   UWAGA: teksty w bloku stoją w <div>, nie w <span> — motyw ma
   `.us-supported-form span{font-size:14px!important}`, które zbija każdy span
   do 14 px. Divów ta reguła nie łapie (sprawdzone na żywej stronie).
   Blok jedzie w całości na tokenach formularza (--us-primary itd.), żeby nie
   wprowadzać nowej palety. Nowe są tylko: promień karty 20 px (jak panel
   podsumowania) i rozmiary tekstu 13/14 px (jak .us-rf-help). */

#us-cf7-usluga .us-up {
    margin: 0 0 28px;
    padding: 0;
    border: 0;
    min-width: 0;
}

/* --- nagłówek bloku --- */
#us-cf7-usluga .us-up-legend {
    display: flex;
    align-items: baseline;
    gap: 8px;
    margin: 0 0 4px;
    padding: 0;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #1C1C1C;
}
#us-cf7-usluga .us-up-opt {
    font-size: 13px;
    line-height: 20px;
    font-weight: 400;
    color: #5A5A5A;
}
#us-cf7-usluga .us-up-lead {
    margin: 0 0 16px;
    max-width: 68ch;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #5A5A5A;
}

/* --- siatka opcji --- */
#us-cf7-usluga .us-up-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    /* trzy wspólne rzędy: karta / przycisk / rozwinięcie — patrz .us-up-item */
    grid-template-rows: auto auto auto;
    column-gap: 16px;
    row-gap: 0;
    align-items: stretch;
}

#us-cf7-usluga .us-up-card {
    position: relative;
    display: grid;
    grid-template-columns: 20px minmax(0, 1fr);
    grid-template-areas:
        "mark name"
        ".    price"
        ".    desc";
    grid-template-rows: auto auto 1fr;
    column-gap: 8px;
    row-gap: 8px;
    box-sizing: border-box;
    margin: 0;
    padding: 16px;
    border: 1.5px solid #D9D9D9;
    border-radius: 20px;
    background: #FFFFFF;
    color: #1C1C1C;
    font-family: inherit;
    font-size: 16px;
    font-weight: 300;
    line-height: 26.4px;
    cursor: pointer;
    transition: border-color 120ms ease, background-color 120ms ease;
}
#us-cf7-usluga .us-up-card:hover {
    border-color: #9AA0E8;
}
#us-cf7-usluga .us-up-card:has(input:checked) {
    border-color: #6169D6;
    background: #EDEFFB;
}
#us-cf7-usluga .us-up-card:has(input:focus-visible) {
    outline: 2px solid #6169D6;
    outline-offset: 2px;
}
/* Pierścień fokusu rysuje KARTA (2 px, offset 2 px), a nie samo 20-px radio —
   inaczej widać dwa pierścienie naraz. Wskaźnik fokusu zostaje, tylko większy
   niż kontrolka. */
#us-cf7-usluga .us-up-card input[type="radio"]:focus-visible {
    outline: none;
}

/* Trzy pakiety to trzy identyczne kontrolki: <label> + radio + .us-up-mark.
   COMFORT nie ma już osobnego stylu „w cenie" ani znaczka ✓ — zaznacza się
   tak samo jak SELECT i PREMIUM (obwódka + tło z reguły :has(input:checked)). */

/* --- znacznik: radio (wybór) --- */
#us-cf7-usluga .us-up-mark {
    grid-area: mark;
    align-self: start;
    width: 20px;
    height: 20px;
    margin-top: 2px;
}
#us-cf7-usluga .us-up-card input[type="radio"] {
    grid-area: mark;
    align-self: start;
    width: 20px;
    height: 20px;
    margin: 2px 0 0;
    accent-color: #6169D6;
    cursor: pointer;
}
/* --- nazwa, cena, opis --- */
#us-cf7-usluga .us-up-name {
    grid-area: name;
    font-size: 16px;
    line-height: 24px;
    font-weight: 600;
    color: #1C1C1C;
}
#us-cf7-usluga .us-up-price {
    grid-area: price;
    display: flex;
    flex-direction: column;
    gap: 2px;
    min-height: 44px;
}
#us-cf7-usluga .us-up-amount {
    font-size: 20px;
    line-height: 26px;
    font-weight: 600;
    color: #1C1C1C;
}
#us-cf7-usluga .us-up-qual {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    color: #5A5A5A;
}
/* COMFORT: duża linia to cena wyjściowa pakietu — bez bolda, przekreślona.
   Samo <s> rysuje linię tylko pod tekstem (rozpięta na całą szerokość
   elementu flex kreska wychodziłaby poza „99 zł"). */
#us-cf7-usluga .us-up-amount--was {
    font-weight: 400;
}
#us-cf7-usluga .us-up-amount--was s {
    text-decoration-thickness: 2px;
    text-decoration-color: currentColor;
}
/* COMFORT: „w cenie naprawy" przeniesione do małej linii i wyróżnione boldem
   (to teraz informacja o zerowej dopłacie). Rozmiar bez zmian; kolor o stopień
   ciemniejszy niż #5A5A5A, bo w tym samym szarym zlewało się z opisem pod
   spodem (kontrast #5A5A5A na #EDEFFB to 6,0:1 — wystarczał, ale hierarchia
   tekstu ginęła; #3D3D3D daje 9,5:1). */
#us-cf7-usluga .us-up-qual--included {
    font-weight: 600;
    color: #3D3D3D;
}
#us-cf7-usluga .us-up-desc {
    grid-area: desc;
    align-self: start;
    margin: 0;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #5A5A5A;
}

/* --- wiersz „Czyszczenie” w liście podsumowania (krok 3) ---
   Wiersz zajmuje całą szerokość panelu i stoi na końcu listy, więc pary
   istniejących pól zostają nietknięte (16 pól = 8 par), a lista nie kończy się
   pustą prawą komórką. Etykieta i wartość stoją w jednej linii — to jedyny
   wiersz, który pokazuje kwotę, więc ma być czytany jednym spojrzeniem. */
#us-cf7-usluga .us-rf-summary .us-up-summary {
    grid-column: 1 / -1;
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    gap: 2px 8px;
    padding-top: 12px;
    border-top: 1px solid #E2E2E2;
}
#us-cf7-usluga .us-rf-summary .us-up-summary dt {
    margin: 0;
    font-size: 13px;
    line-height: 21.45px;
    font-weight: 300;
    color: #59616B;
}
#us-cf7-usluga .us-rf-summary .us-up-summary dd {
    margin: 0;
    font-size: 16px;
    line-height: 26.4px;
    font-weight: 300;
    color: #1C1C1C;
}
#us-cf7-usluga .us-rf-summary .us-up-summary dd strong {
    font-weight: 600;
}
#us-cf7-usluga .us-rf-summary .us-up-summary .us-up-val {
    display: block;
    font: inherit;
}

/* --- pasek dopłaty (tylko przy wybranym pakiecie) --- */
#us-cf7-usluga .us-up-total {
    display: none;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    margin: 12px 0 0;
    padding: 12px 16px;
    border-radius: 12px;
    background: #F7F7FA;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #1C1C1C;
}
#us-cf7-usluga .us-up[data-wybor="select"] .us-up-total,
#us-cf7-usluga .us-up[data-wybor="premium"] .us-up-total {
    display: flex;
}
#us-cf7-usluga .us-up-total-text {
    min-width: 0;
}
#us-cf7-usluga .us-up-total strong {
    font-weight: 600;
}
#us-cf7-usluga .us-up-reset {
    flex: 0 0 auto;
    width: auto !important;
    min-height: 24px;
    margin: 0;
    padding: 0;
    border: 0;
    background: none;
    text-align: left;
    color: #1C1C1C;
    font-family: inherit;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    text-decoration: underline;
    text-underline-offset: 3px;
    cursor: pointer;
}
#us-cf7-usluga .us-up-reset:focus-visible {
    outline: 2px solid #6169D6;
    outline-offset: 2px;
    border-radius: 4px;
}

/* --- 390: karty w stos, cena w prawo od nazwy --- */
@media (max-width: 600px) {
    #us-cf7-usluga .us-up {
        margin-bottom: 24px;
    }
    #us-cf7-usluga .us-up-grid {
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;
    }
    #us-cf7-usluga .us-up-card {
        grid-template-columns: 20px minmax(0, 1fr) auto;
        grid-template-areas:
            "mark name price"
            "desc desc desc";
        grid-template-rows: auto 1fr;
        padding: 14px 16px;
        row-gap: 6px;
    }
    #us-cf7-usluga .us-up-price {
        min-height: 0;
        align-items: flex-end;
        text-align: right;
        gap: 0;
    }
    #us-cf7-usluga .us-up-amount {
        font-size: 18px;
        line-height: 24px;
    }
    #us-cf7-usluga .us-up-desc {
        align-self: start;
        margin-top: 2px;
    }
    #us-cf7-usluga .us-up-total {
        flex-direction: column;
        align-items: flex-start;
        gap: 4px;
        padding: 12px 16px;
    }
    #us-cf7-usluga .us-up-reset {
        min-height: 44px;
        margin-top: 4px;
    }
}

/* =====================================================================
   ROZWINIĘCIE „Poznaj szczegóły” — dodane 2026-11-04 (rewizja 2 makiety).
   Układ: każdy pakiet to .us-up-item = trzy wspólne rzędy siatki
   (karta / przycisk / panel) przez `grid-template-rows: subgrid`.
   Dzięki wspólnym rzędom: karty mają równą wysokość i przyciski stoją
   w jednej linii, a rozwinięcie panelu rosnie TYLKO w trzecim rzędzie —
   karty ani przyciski nie drgają, gdy otwiera się inny pakiet.
   Przycisk MUSI stać poza <label> karty: klik w button wewnątrz label
   przełącza radio i zmienia wybór pakietu.
   ===================================================================== */

#us-cf7-usluga .us-up-item {
    display: grid;
    grid-row: span 3;
    grid-template-rows: subgrid;
    min-width: 0;
}

/* --- przycisk „Poznaj szczegóły” --- */
#us-cf7-usluga .us-up-more-btn {
    display: flex;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    align-self: stretch;
    width: 100% !important;
    min-height: 40px;
    margin: 6px 0 0;
    padding: 8px 0;
    border: 0;
    border-radius: 8px;
    background: none;
    color: #1C1C1C;
    font-family: inherit;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    text-align: left;
    text-decoration: underline;
    text-decoration-thickness: 1px;
    text-decoration-color: #B9BCE4;
    text-underline-offset: 3px;
    cursor: pointer;
    transition: text-decoration-color 120ms ease, color 120ms ease;
}
#us-cf7-usluga .us-up-more-btn:hover {
    color: #3F47B8;
    text-decoration-color: #6169D6;
}
#us-cf7-usluga .us-up-more-btn:focus-visible {
    outline: 2px solid #6169D6;
    outline-offset: 2px;
}
#us-cf7-usluga .us-up-more-btn::after {
    content: "";
    flex: 0 0 auto;
    width: 7px;
    height: 7px;
    margin: -4px 0 0 6px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg);
    transition: transform 200ms cubic-bezier(.2,.6,.2,1);
}
#us-cf7-usluga .us-up-more-btn[aria-expanded="true"]::after {
    margin-top: 3px;
    transform: rotate(-135deg);
}

/* --- panel: 0fr → 1fr, bez skoku wysokości --- */
#us-cf7-usluga .us-up-more {
    display: grid;
    align-self: start;
    grid-template-rows: 0fr;
    transition: grid-template-rows 240ms cubic-bezier(.2,.6,.2,1);
}
#us-cf7-usluga .us-up-more-btn[aria-expanded="true"] + .us-up-more {
    grid-template-rows: 1fr;
}
#us-cf7-usluga .us-up-more-in {
    overflow: hidden;
    min-height: 0;
    visibility: hidden;
    transition: visibility 0s linear 240ms;
}
#us-cf7-usluga .us-up-more-btn[aria-expanded="true"] + .us-up-more .us-up-more-in {
    visibility: visible;
    transition-delay: 0s;
}
#us-cf7-usluga .us-up-more-body {
    margin: 8px 0 6px;
    padding: 14px 16px 16px;
    border: 1px solid #E4E4F0;
    border-radius: 16px;
    background: #FAFAFD;
}

/* --- grupy pozycji --- */
#us-cf7-usluga .us-up-grp {
    margin: 0 0 6px;
    font-size: 12px;
    line-height: 16px;
    font-weight: 600;
    letter-spacing: .04em;
    text-transform: uppercase;
    color: #5A5A5A;
}
#us-cf7-usluga .us-up-grp + .us-up-list + .us-up-grp {
    margin-top: 14px;
}
#us-cf7-usluga .us-up-list {
    margin: 0;
    padding: 0;
    list-style: none;
}
#us-cf7-usluga .us-up-list li {
    position: relative;
    margin: 0;
    padding: 0 0 0 18px;
    font-size: 14px;
    line-height: 20px;
    font-weight: 400;
    color: #1C1C1C;
}
#us-cf7-usluga .us-up-list li + li {
    margin-top: 4px;
}
/* znacznik ✓ jest glifem, nie kolorem — czyta się też bez barwy */
#us-cf7-usluga .us-up-list li::before {
    content: "\2713";
    position: absolute;
    top: 0;
    left: 0;
    width: 12px;
    font-size: 12px;
    line-height: 20px;
    font-weight: 700;
    color: #4F57C9;
}
#us-cf7-usluga .us-up-it {
    min-width: 0;
    overflow-wrap: break-word;
}
#us-cf7-usluga .us-up-cost {
    font-size: 13px;
    line-height: 18px;
    font-weight: 400;
    color: #5A5A5A;
    white-space: nowrap;
}
#us-cf7-usluga .us-up-note {
    margin: 12px 0 0;
    padding-top: 12px;
    border-top: 1px solid #E4E4F0;
    font-size: 13px;
    line-height: 19px;
    font-weight: 400;
    color: #3D3D3D;
}

@media (prefers-reduced-motion: reduce) {
    #us-cf7-usluga .us-up-more,
    #us-cf7-usluga .us-up-more-in,
    #us-cf7-usluga .us-up-more-btn::after {
        transition: none;
    }
}

/* --- 390: jeden stos, panel pod własną kartą --- */
@media (max-width: 600px) {
    #us-cf7-usluga .us-up-grid {
        grid-template-rows: none;
        grid-auto-rows: auto;
        row-gap: 12px;
    }
    #us-cf7-usluga .us-up-item {
        grid-row: auto;
        grid-template-rows: auto auto auto;
    }
    #us-cf7-usluga .us-up-more-btn {
        min-height: 44px;
        margin-top: 2px;
        padding: 10px 0;
        font-size: 15px;
        line-height: 22px;
    }
    #us-cf7-usluga .us-up-more-body {
        padding: 12px 14px 14px;
        border-radius: 14px;
    }
    #us-cf7-usluga .us-up-list li {
        font-size: 14px;
        line-height: 21px;
    }
    #us-cf7-usluga .us-up-list li::before {
        line-height: 21px;
    }
}

/* Blok ukryty dla kategorii innej niż ekspres (JS ustawia hidden) — atrybut musi
   wygrać z display:flex/grid reguł wyżej. */
#us-cf7-usluga .us-up[hidden],
#us-cf7-usluga .us-rf-summary .us-up-summary[hidden] {
    display: none !important;
}

/* =====================================================================
   10. Reklamacja 1001163 — układ trzyetapowy (partia 1, 2026-11-05)
   Zakres: wyłącznie #us-cf7-reklamacja. Wzorzec: cleaning.css (.us-cl-*),
   te same nazwy klas, żeby partia 3 mogła scalić oba arkusze bez zmiany
   markupu. Wycofanie: usunięcie tego bloku (kopia: backups/form-1001163-
   20261105-1930/us-contact-form.css.bak).
   ===================================================================== */

html body #us-cf7-reklamacja .us-cl-step {
    display: block;
    font: 500 14px/1.5 Outfit, sans-serif;
    color: #726bea;
    margin: 0 0 8px;
}

html body #us-cf7-reklamacja h2 {
    font: 700 48px/1.2 Outfit, sans-serif;
    margin: 0 0 24px;
    color: #1c1c1c;
}

html body #us-cf7-reklamacja .us-cl-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 24px;
}

html body #us-cf7-reklamacja .us-cl-field {
    margin: 0 0 24px;
    padding: 0;
    border: 0;
    min-width: 0;
}

html body #us-cf7-reklamacja .us-cl-field.us-cl-full,
html body #us-cf7-reklamacja .us-cl-field.us-cl-full .wpcf7-form-control-wrap,
html body #us-cf7-reklamacja .us-cl-field.us-cl-full input {
    grid-column: 1 / -1;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
}

html body #us-cf7-reklamacja .us-cl-field > label,
html body #us-cf7-reklamacja .us-tags-legend {
    font: 400 16px/1.5 Outfit, sans-serif;
    display: block;
    margin: 0 0 8px;
    color: #222;
}

html body #us-cf7-reklamacja .us-cl-field > label,
html body #us-cf7-reklamacja .us-tags-legend,
html body #us-cf7-reklamacja .us-cl-consent label,
html body #us-cf7-reklamacja .us-cl-summary,
html body #us-cf7-reklamacja .us-cl-summary div,
html body #us-cf7-reklamacja .us-cl-summary dt,
html body #us-cf7-reklamacja .us-cl-summary dd {
    text-align: left;
}

html body #us-cf7-reklamacja .us-cl-field input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="hidden"]),
html body #us-cf7-reklamacja .us-cl-field select,
html body #us-cf7-reklamacja .us-cl-field textarea,
html body #us-cf7-reklamacja .us-cl-field .us-phone-frame,
html body #us-cf7-reklamacja .us-cl-field .wpcf7-form-control-wrap {
    width: 100%;
    max-width: 100%;
    margin-left: 0;
    margin-right: 0;
}

html body #us-cf7-reklamacja .us-cl-tags .wpcf7-list-item-label,
html body #us-cf7-reklamacja .us-cl-packages .wpcf7-list-item-label {
    text-align: left;
}

html body #us-cf7-reklamacja .us-cl-help {
    font-size: 14px;
    color: #52606d;
    margin: 0 0 8px;
}

/* „Inna marka" pokazuje pole na nazwę producenta — jak w czyszczeniu. */
html body #us-cf7-reklamacja .us-cl-other-brand {
    display: none;
}

html body #us-cf7-reklamacja:has(select[name="marka"] option[value="Inna marka"]:checked) .us-cl-other-brand {
    display: block;
}

/* Podsumowanie kroku 3 — ten sam układ co w czyszczeniu. */
html body #us-cf7-reklamacja .us-cl-summary {
    margin: 0 0 28px;
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 16px 24px;
    padding: 20px;
    background: #f7f7fa;
    border-radius: 20px;
}

html body #us-cf7-reklamacja .us-cl-summary dt {
    font-size: 13px;
    color: #59616b;
}

html body #us-cf7-reklamacja .us-cl-summary dd {
    margin: 0;
    overflow-wrap: anywhere;
    white-space: pre-wrap;
}

html body #us-cf7-reklamacja .us-cl-summary fieldset {
    padding: 0;
    border: 0;
    margin: 0;
    min-width: 0;
}

html body #us-cf7-reklamacja .us-cl-summary output {
    display: block;
}

html body #us-cf7-reklamacja .us-cl-summary dd .wpcf7-output {
    display: inline;
}

html body #us-cf7-reklamacja .us-cl-summary output[hidden] {
    display: none !important;
}

/* Zgody w kroku 3 — ten sam układ co w czyszczeniu i naprawie. */
html body #us-cf7-reklamacja .us-cl-consent {
    margin: 24px 0;
}

html body #us-cf7-reklamacja .us-cl-consent label {
    display: flex;
    align-items: flex-start;
    gap: 12px;
}

html body #us-cf7-reklamacja .us-cl-consent .wpcf7-list-item-label,
html body #us-cf7-reklamacja .us-cl-consent > span.wpcf7-list-item-label {
    font-size: 15px;
    line-height: 1.5;
}

html body #us-cf7-reklamacja .us-cl-checkbox input[type="checkbox"] {
    appearance: auto;
    position: static;
    opacity: 1;
    flex-shrink: 0;
    width: 20px;
    height: 20px;
    accent-color: #726bea;
    margin-top: 4px;
}

/* Przyciski kroków — ten sam komponent co w naprawie i czyszczeniu. */
html body #us-cf7-reklamacja button,
html body #us-cf7-reklamacja input[type="submit"] {
    font: 500 16px/1.5 Outfit, sans-serif;
    border-radius: 48px;
    padding: 12px 24px;
    background: #000;
    color: #f8f8f8;
    border: 1px solid #000;
    min-height: 48px;
    cursor: pointer;
}

html body #us-cf7-reklamacja .cf7mls_back {
    background: #fff;
    color: #000;
    float: none !important;
    margin: 0 !important;
}

html body #us-cf7-reklamacja .cf7mls_next {
    float: none !important;
    margin: 0 !important;
}

@media (min-width: 601px) {
    html body #us-cf7-reklamacja .cf7mls_next,
    html body #us-cf7-reklamacja .cf7mls_back {
        height: 72px;
        min-height: 72px;
        padding: 0 24px;
        line-height: 1;
    }
    html body #us-cf7-reklamacja .cf7mls-btns-last-step .cf7mls_back,
    html body #us-cf7-reklamacja .cf7mls-btns-last-step input[type="submit"] {
        height: 50px;
        min-height: 50px;
        width: auto;
        padding: 0 24px;
        float: none;
        margin: 0;
    }
}

/* Nawigacja kroków: puste kontenery nie zostawiają pustki. */
html body #us-cf7-reklamacja .cf7mls-btns {
    display: flex;
    justify-content: space-between;
    gap: 16px;
    padding: 8px 0 0;
    margin: 0;
}

html body #us-cf7-reklamacja .cf7mls-btns:empty,
html body #us-cf7-reklamacja .cf7mls-btns:not(:has(button, input[type="submit"])) {
    display: none !important;
}

html body #us-cf7-reklamacja .cf7mls-btns-last-step {
    justify-content: flex-start;
    margin: 16px 0;
}

html body #us-cf7-reklamacja .fieldset-cf7mls {
    padding: 0 !important;
    margin: 0 !important;
    border: 0;
    min-width: 0;
}

html body #us-cf7-reklamacja .us-cl-step-focus {
    scroll-margin-top: 128px;
}

@media (max-width: 600px) {
    html body #us-cf7-reklamacja .us-cl-grid,
    html body #us-cf7-reklamacja .us-cl-summary {
        grid-template-columns: 1fr;
    }
    html body #us-cf7-reklamacja h2 {
        font-size: 32px !important;
        line-height: 1.2;
    }
    html body #us-cf7-reklamacja .cf7mls_next,
    html body #us-cf7-reklamacja .cf7mls_back,
    html body #us-cf7-reklamacja .cf7mls-btns-last-step input[type="submit"] {
        height: 50px;
        min-height: 50px;
        width: 100%;
        padding: 0 24px;
    }
    html body #us-cf7-reklamacja .cf7mls-btns {
        flex-wrap: wrap;
    }
    html body #us-cf7-reklamacja .cf7mls-btns-last-step input[type="submit"] {
        width: 100%;
    }
}

/* =====================================================================
   11. Zdanie „zdjęcia wyślij na …" — wspólne dla naprawy i reklamacji
   (partia 2, 2026-11-05). Zastępuje pole plikowe; 15 px / 24 px wg miary R-10.
   ===================================================================== */
html body :is(#us-cf7-usluga, #us-cf7-reklamacja) .us-photo-note {
    font-family: Outfit, sans-serif;
    font-weight: 400;
    /* 15 px wg miary R-10 — nadpisuje .us-supported-form p (14 px !important) */
    font-size: 15px !important;
    line-height: 1.6 !important;
    color: #222;
    margin: 0 0 24px;
    max-width: 100%;
}

html body :is(#us-cf7-usluga, #us-cf7-reklamacja) .us-photo-note a {
    color: inherit;
    text-decoration: underline;
}

html body #us-cf7-reklamacja .us-cl-nr-off {
    opacity: .55;
}

/* Kolumna bloku adresu w naprawie — Adres 464, pod nim kod 220 + miejscowość 220
   (miara R-04). Wycofanie: usunięcie tej reguły i klasy .us-rf-col z _form. */
html body #us-cf7-usluga .us-rf-col {
    min-width: 0;
}

html body #us-cf7-usluga .us-rf-col > .us-rf-grid {
    margin: 0;
}

/* =====================================================================
   12. Wspólna warstwa trzech formularzy — partia 3 (2026-11-05)
   R-02: jedna szerokość treści (952 px) i jedno pismo (Outfit, 16 px),
   R-13: jedna wysokość pól (44 px), rytm wiersza 24 px, placeholder
   #666 (4,95:1 na #EEE — powyżej AA), nagłówek kroku nad sekcją.
   Zakres: #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja.
   Wycofanie: usunięcie całego bloku (kopia .bak arkusza na serwerze).
   ===================================================================== */

/* --- szerokości BEZ ZMIAN (makieta): naprawa 952, czyszczenie 768,
   reklamacja 1184 z kolumnami 582. Zwężenie reklamacji przebudowałoby jej
   dwukolumnowy układ, a klient nie widzi tych formularzy obok siebie.
   Wycofanie tej decyzji nie jest potrzebne — nic tu nie ustawiamy. --- */
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) {
    box-sizing: border-box;
}

/* --- jedno pismo: etykiety --- */
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-field, .us-cl-field) > label,
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-tags-legend {
    display: block;
    margin: 0 0 8px;
    color: #222;
    font-family: Outfit, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
}

/* --- jedno pismo i jedna wysokość pól (poza polem telefonu: ramka niżej) --- */
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-field, .us-cl-field) input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]):not([type="hidden"]):not(.us-phone-input):not(.us-phone-code),
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-field, .us-cl-field) select:not(.us-phone-code) {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    height: 44px;
    margin: 0;
    padding: 8px 16px;
    border: 1px solid #CCCCCC;
    border-radius: 35.2px;
    background: #EEE;
    color: #111;
    font-family: Outfit, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
}

html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-field, .us-cl-field) textarea {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    height: 180px;
    min-height: 180px;
    margin: 0;
    padding: 12px 16px;
    border: 1px solid #CCCCCC;
    border-radius: 35.2px;
    background: #EEE;
    color: #111;
    font-family: Outfit, sans-serif;
    font-size: 16px;
    font-weight: 400;
    line-height: 1.6;
}

html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-field, .us-cl-field) input::placeholder,
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-field, .us-cl-field) textarea::placeholder {
    color: #666666;
    opacity: 1;
}

/* ten sam rytm wiersza: 24 px pod każdym polem */
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-field, .us-cl-field) {
    margin: 0 0 24px;
    min-width: 0;
}

/* ramka telefonu na tę samą wysokość co pozostałe pola */
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-frame {
    height: 44px;
    min-height: 44px;
}

html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-phone-input {
    font-family: Outfit, sans-serif;
    font-size: 16px;
    font-weight: 400;
}

/* kod kraju musi zmieścić się w ramce 44 px (42 + 2 × 1 px obramowania) —
   wcześniej 46 px wystawało 1 px poza ramkę i było przycinane */
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) select.us-phone-code {
    height: 42px !important;
    min-height: 42px !important;
    line-height: 40px !important;
}

/* --- nagłówek kroku nad sekcją, pełną szerokością --- */
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-step, .us-cl-step) {
    display: block;
    width: 100%;
    margin: 0 0 8px;
    /* #655DDC = 5,06:1 na białym i 4,76:1 na #F8F8F8 (było #726BEA: 4,19:1) */
    color: #655DDC;
    font-family: Outfit, sans-serif;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.5;
    scroll-margin-top: 120px;
}

html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) h2 {
    margin: 32px 0 24px;
    color: #1C1C1C;
    font-family: Outfit, sans-serif;
    font-size: 48px;
    font-weight: 700;
    line-height: 1.2;
}

html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-step, .us-cl-step) + h2 {
    margin-top: 0;
}

@media screen and (max-width: 600px) {
    html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) h2 {
        font-size: 32px;
    }
}

/* ---------- 13. Stabilność układu — bez skoków strony przy zaznaczaniu i walidacji ----------
   Zgłoszenie Luca (8862181), pomiar: work/formy-jumps-2026-11-05/baseline/.
   Zasada: to, co robi użytkownik (zaznaczenie pastylki, wybór w polu, fokus), nie może
   zmieniać wysokości formularza ani przewijać strony. Komunikaty bramki kroku 1 mają
   miejsce zarezerwowane od pierwszego renderu (pusty kontener `.us-gate-error` siedzi
   w DOM od startu — patrz `gatePrepareBoxes()` w us-contact-form.js), więc pojawienie
   się i zniknięcie tekstu nie przesuwa pól. */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-field-error.us-gate-error {
    display: block;
    min-height: 20px;          /* 1 linia: font-size 14 px / line-height 20 px */
    margin: 6px 0 0;
}

/* Pusty, ale nadal zajmuje swoje miejsce — inaczej `:empty { display:none }` (sekcja 4)
   chowa go i komunikat wsuwa się w układ dopiero w chwili błędu. */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) .us-field-error.us-gate-error:empty {
    display: block !important;
    visibility: hidden;
}

/* Przy 390 px dwa komunikaty bramki łamią się na 2 linie — rezerwujemy dla nich
   dwie (blok objawów w naprawie, siatka marka/model w czyszczeniu). Krótkie
   komunikaty (kategoria, telefon) zostają na jednej linii — mniej pustki. */
@media screen and (max-width: 480px) {
    html body #us-cf7-usluga .us-rf-symptoms .us-field-error.us-gate-error,
    html body #us-cf7-czyszczenie #us-err-brand-model.us-gate-error {
        min-height: 40px;
    }
}

/* Przewijanie nie może "przeskakiwać" przy zmianie wysokości treści wewnątrz tych
   kontenerów — Chrome nie dopasowuje wtedy pozycji strony w tle. */
html body :is(#us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-cl-packages, .us-rf-symptoms, .us-cl-tags) {
    overflow-anchor: none;
}

/* Zaznaczony kafel pakietu (czyszczenie) — ta sama zasada co pastylki objawów:
   bez pogrubienia i bez grubszej ramki, żeby kafel nie zmieniał rozmiaru. */
html body #us-cf7-czyszczenie fieldset.us-cl-packages input:checked + .wpcf7-list-item-label {
    border: 1px solid #6169D6 !important;
    font-weight: 400 !important;
    box-shadow: inset 0 0 0 1px #6169D6;
}

/* Kafle pakietu: „✓" jest pozycjonowany w lewym paddingu kafla, więc zaznaczenie
   nie zmienia jego rozmiaru. Treść znaku zostaje w `us-clean-pakiet.css`
   (pusty / „✓") — tutaj tylko pozycja, bez nadpisywania `content`. */
html body #us-cf7-czyszczenie .us-cl-packages .wpcf7-list-item-label {
    position: relative;
}

html body #us-cf7-czyszczenie .us-cl-packages .wpcf7-list-item-label::before {
    position: absolute !important;
    left: auto !important;
    right: 12px !important;
    top: 12px !important;
    transform: none !important;
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    font-family: inherit !important;
    font-size: 13px !important;
    line-height: 1 !important;
}

/* Rezerwacja miejsca nie może zwiększać odstępów: gospodarz komunikatu oddaje
   własny margines dolny (24 px), a jego rolę przejmuje pusta linia komunikatu
   (6 px + 20 px). Bez tego między polami robi się 50 px pustki. */
html body #us-cf7-usluga fieldset.us-rf-symptoms:has(#us-err-repair-symptoms),
html body #us-cf7-usluga .us-rf-field:has(> #us-err-repair-category),
html body #us-cf7-usluga .us-phone-field:has(#us-err-repair-phone),
html body #us-cf7-czyszczenie .us-cl-grid:has(+ #us-err-brand-model),
html body #us-cf7-czyszczenie .us-phone-field:has(#us-err-f4) {
    margin-bottom: 0 !important;
}