/* ==========================================================================
   US — spójność tagów w całym serwisie (F-01…F-04, F-06, F-07, F-08)
   Decyzja Luca: 8824339 (wdrożenie zatwierdzone, tylko podgląd).

   WZORZEC (jeden, niezmienny):
     spoczynek   — tło białe/przezroczyste, ramka 1px #D1D1D1, tekst #222 14/400,
                   promień 999, wysokość 43 px;
     zaznaczenie — tło #6169D6, ramka #6169D6, tekst biały, „✓" przed etykietą;
     fokus       — tylko :focus-visible, 2px #6169D6, outline-offset: 2px.

   Tag jest ZAWSZE pastylką na etykiecie wewnętrznej `.wpcf7-list-item-label`.
   Formularze mają dwa różne szablony markupu — raz pastylka stoi na zewnętrznym
   `label` (kontakt, reklamacje), raz na etykiecie wewnętrznej (naprawa,
   czyszczenie). Ten arkusz sprowadza oba do jednego: zewnętrzny `label` jest
   przezroczysty, pastylkę maluje etykieta wewnętrzna. Bez tego chipy kontaktu
   w naprawie i czyszczeniu miałyby dwie ramki.

   Powierzchnie objęte:
     A. „Rodzaj zgłoszenia" (.us-rf-kind) i tagi objawów (.us-rf-symptoms);
     B. chipy kontaktu: .us-tags-list (/kontakt/, /reklamacje/, naprawa krok 2,
        czyszczenie) oraz .us-contact-tags (/reklamacje/ — radia, logika bez zmian);
     C. tagi-linki na stronach marek (a.button.is-tag).

   Poza zakresem (świadomie): przyciski i linki CTA (#6A74E7), filtry marek
   (F-05), logika wyboru (checkboxy/radia bez zmian), `.us-coffee-symptom`
   (martwy arkusz — 0 wystąpień w HTML).

   Wczytywany na całym froncie po arkuszach formularzy
   (us-contact-form.css — prio 1004, ten — 1005); selektory powtarzają kształt
   reguł z tamtych arkuszy, żeby wygrywać kolejnością przy równej specyficzności.
   ========================================================================== */

/* --------------------------------------------------------------------------
   A. Pastylka — etykieta wewnętrzna, wszystkie powierzchnie formularzy
   S1: „Rodzaj zgłoszenia" i objawy (brak .us-tags-list)
   S2: chipy kontaktu w naprawie i czyszczeniu (.us-rf-tags / .us-cl-tags)
   S3: chipy kontaktu na /kontakt/ i /reklamacje/
   -------------------------------------------------------------------------- */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-kind, .us-rf-symptoms) .wpcf7-list-item-label,
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,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) .wpcf7-list-item-label {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 43px !important;
    min-height: 43px;
    padding: 0 16px !important;
    border: 1px solid #D1D1D1 !important;
    border-radius: 999px !important;
    background: #fff !important;
    color: #222 !important;
    font-family: inherit;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    text-align: center;
    cursor: pointer;
}

/* B. Zewnętrzny `label` (chipy kontaktu) — bez własnej oprawy, sam nośnik kliknięcia */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) .wpcf7-list-item > label {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: auto !important;
    min-height: 0;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    color: #222 !important;
    font-family: inherit;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    cursor: pointer;
}

/* --------------------------------------------------------------------------
   C. Zaznaczenie — #6169D6 tło i ramka, biały tekst, waga 400
   C1: „Rodzaj zgłoszenia" i objawy      — `input + etykieta`
   C2: chipy w naprawie/czyszczeniu      — `input + etykieta` wewnątrz .us-tags-list
   C3: chipy na /kontakt/ i /reklamacjach — `label:has(input)` → etykieta
   -------------------------------------------------------------------------- */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-kind, .us-rf-symptoms) input:checked + .wpcf7-list-item-label,
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,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) label:has(input:checked) .wpcf7-list-item-label {
    background: #6169D6 !important;
    border-color: #6169D6 !important;
    color: #fff !important;
    font-weight: 400 !important;
}

/* zewnętrzny `label` zaznaczonego chipa też bez oprawy — inaczej stary arkusz
   dorysowuje mu 1,5 px fioletu (druga ramka i +3 px wysokości) */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) .wpcf7-list-item > label:has(input:checked) {
    border: 0 !important;
    background: transparent !important;
    color: #222 !important;
}

/* hover — jedna reguła dla wszystkich tagów: ramka i tekst w kolorze marki,
   ZERO wypełnienia (żeby nie wyglądał jak zaznaczony). Zaznaczony bez zmian:
   fioletowe tło, biały tekst, „✓". */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) label:not(:has(input:checked)):hover .wpcf7-list-item-label {
    border-color: #6169D6 !important;
    color: #6169D6 !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) label:has(input:checked):hover .wpcf7-list-item-label {
    border-color: #6169D6 !important;
    color: #fff !important;
}

/* ten sam hover dla „Rodzaju zgłoszenia" i tagów objawów */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-kind, .us-rf-symptoms) input:not(:checked) + .wpcf7-list-item-label:hover {
    border-color: #6169D6 !important;
    color: #6169D6 !important;
}

/* --------------------------------------------------------------------------
   D. „✓" przed etykietą — ten sam znak, rozmiar i pozycja na każdej powierzchni
   (chipy kontaktu miały dotąd SVG w kolorze marki, „Rodzaj zgłoszenia" — nic)
   -------------------------------------------------------------------------- */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-kind, .us-rf-symptoms) .wpcf7-list-item-label::before,
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::before,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) .wpcf7-list-item-label::before {
    content: "" !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    background: none !important;
    font: inherit !important;
    color: inherit !important;
    line-height: inherit !important;
    vertical-align: baseline !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-kind, .us-rf-symptoms) input:checked + .wpcf7-list-item-label::before,
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::before,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) label:has(input:checked) .wpcf7-list-item-label::before {
    content: "✓" !important;
    margin-right: 6px !important;
    font: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    line-height: inherit !important;
}

/* --------------------------------------------------------------------------
   E. Fokus — wyłącznie :focus-visible (klawiatura), 2px #6169D6, offset 2 px.
   Zdejmuje czarną obwódkę 2px #222 z repair.css/cleaning.css oraz
   :focus-within z arkusza inline `/reklamacje/` (obwódka po kliknięciu myszą).
   -------------------------------------------------------------------------- */

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) .wpcf7-list-item > label:focus-within {
    outline: none !important;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-kind, .us-rf-symptoms) input:focus-visible + .wpcf7-list-item-label,
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,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) label:has(input:focus-visible) .wpcf7-list-item-label {
    outline: 2px solid #6169D6 !important;
    outline-offset: 2px !important;
}

/* --------------------------------------------------------------------------
   F. Strony marek — tagi-linki „objawów" (a.button.is-tag, 844 szt. / 68 stron).
   Link nie ma stanu „zaznaczony" — tylko ramka, typografia i hover.
   -------------------------------------------------------------------------- */

html body a.button.is-tag {
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    box-sizing: border-box;
    height: 43px !important;
    min-height: 43px;
    padding: 0 16px !important;
    border: 1px solid #D1D1D1 !important;
    border-radius: 999px !important;
    background: transparent !important;
    color: #222 !important;
    font-family: inherit;
    font-size: 14px !important;
    font-weight: 400 !important;
    line-height: 20px !important;
    text-align: center;
    text-decoration: none;
    transition: background-color 120ms ease, border-color 120ms ease, color 120ms ease;
}

/* hover — tylko ramka i tekst w kolorze marki, bez wypełnienia: na stronach bez
   stanu zaznaczenia tag nie może wyglądać jak zaznaczony. */
html body a.button.is-tag:hover {
    background: transparent !important;
    border-color: #6169D6 !important;
    color: #6169D6 !important;
}

/* zaznaczony przy hoverze zostaje fioletowy (tło niesie reguła stanu) */
html body a.button.is-tag[aria-pressed="true"]:hover {
    background: #6169D6 !important;
    border-color: #6169D6 !important;
    color: #fff !important;
}

/* Stan zaznaczenia istnieje w JS (coffee-prefill.js ustawia aria-pressed i dopisuje
   `repair-symptoms[]` do adresu). Decyzja Luca (8826247): stan zostaje w PEŁNYM
   wzorcu — fiolet #6169D6, biały tekst, ramka w kolorze wypełnienia i „✓" przed
   etykietą. „✓" jest pseudo-elementem, więc `value` i `textContent` linku zostają
   czyste, a adres budowany przez JS nie zmienia się. */
html body a.button.is-tag[aria-pressed="true"] {
    background: #6169D6 !important;
    border-color: #6169D6 !important;
    color: #fff !important;
}

html body a.button.is-tag::before {
    content: "" !important;
    display: inline-block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    background: none !important;
    font: inherit !important;
    color: inherit !important;
    line-height: inherit !important;
    vertical-align: baseline !important;
}

html body a.button.is-tag[aria-pressed="true"]::before {
    content: "✓" !important;
    margin-right: 6px !important;
    font: inherit !important;
    font-weight: inherit !important;
    color: inherit !important;
    line-height: inherit !important;
}

html body a.button.is-tag:focus:not(:focus-visible) {
    outline: none !important;
}

/* fokus klawiatury — wyłącznie obwódka; tło i tekst bez zmian
   (na tagu zaznaczonym fiolet niesie reguła stanu) */
html body a.button.is-tag:focus-visible {
    outline: 2px solid #6169D6 !important;
    outline-offset: 2px !important;
}

/* --------------------------------------------------------------------------
   S. Stabilność układu — zaznaczenie NIE zmienia rozmiaru pastylki (8862181)
   Znacznik „✓" (sekcja D) dochodził do tekstu w chwili zaznaczenia i poszerzał
   pastylkę; przy zawijaniu lista rosła o wiersz, a strona pod nią skakała.
   Teraz znak jest pozycjonowany w LEWYM paddingu pastylki (16 px), więc nie
   zajmuje miejsca w żadnym stanie — pastylka ma tę samą szerokość przed i po
   zaznaczeniu, a znak dalej stoi przed etykietą.
   -------------------------------------------------------------------------- */
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-kind, .us-rf-symptoms) .wpcf7-list-item-label,
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,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) .wpcf7-list-item-label {
    position: relative;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-kind, .us-rf-symptoms) .wpcf7-list-item-label::before,
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::before,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) .wpcf7-list-item-label::before {
    content: "" !important;
    position: absolute !important;
    left: 3px !important;
    top: 50% !important;
    transform: translateY(-50%);
    display: block !important;
    width: auto !important;
    height: auto !important;
    margin: 0 !important;
    background: none !important;
    font-family: inherit !important;
    font-size: 12px !important;
    font-weight: 400 !important;
    color: inherit !important;
    line-height: 1 !important;
    opacity: 0;
    pointer-events: none;
}

html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-rf-kind, .us-rf-symptoms) input:checked + .wpcf7-list-item-label::before,
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::before,
html body :is(#us-cf7-kontakt, #us-cf7-usluga, #us-cf7-czyszczenie, #us-cf7-reklamacja) :is(.us-tags-list, .us-contact-tags) label:has(input:checked) .wpcf7-list-item-label::before {
    content: "✓" !important;
    opacity: 1;
}