/* =============================================================
   Zgoda RODO w Contact Form 7 — globalnie, wszystkie formularze
   -------------------------------------------------------------
   Treść zgody wpinamy w kokpicie CF7 zawsze tak samo:

       <div class="non-consent">
       [acceptance rodo] …treść… [/acceptance]
       </div>

   Ten plik ładuje inc/non-cf7-consent.php z zależnością od `main-style`,
   więc zawsze wchodzi PO assets/css/style.css i wygrywa kolejnością.

   Zakres: `.non-consent` (wrapper z kokpitu) plus goły `.wpcf7-acceptance`
   jako awaryjna ścieżka, gdyby ktoś w nowym formularzu zapomniał <div>-a.
   Świadomie NIE łapiemy `.cf-newsletter` — tam pole zgody na newsletter ma
   własny widoczny tekst obok checkboxa, a etykieta CF7 jest ukryta celowo
   (page-contact.php:249, author-profile.css:766). Odkrycie jej pokazałoby
   tę samą treść dwa razy.
   ============================================================= */

/* 1. ODKRYCIE TREŚCI ZGODY — bez tego nie widać nic.
   assets/css/style.css:8123 ma `.wpcf7-list-item-label { display: none !important }`
   — pozostałość po Webflow, gdzie etykiety checkboxów rysowano osobno.
   Treść zgody jest w HTML, ale niewidoczna na każdym formularzu w serwisie.
   `!important` jest tu konieczne, żeby pobić tamto `!important`. */
.non-consent .wpcf7-list-item-label,
.wpcf7-acceptance .wpcf7-list-item-label {
  display: inline !important;
}

/* Przywrócenie celowego ukrycia dla checkboxa newsletterowego — reguły
   w motywie nie mają `!important`, więc bez tego przegrałyby z regułą 1. */
.cf-newsletter .wpcf7-list-item-label {
  display: none !important;
}

/* 2. PRZEZROCZYSTE TŁO — to naprawia /seo-ecommerce/ i 9 podstron single.
   Tamte szablony mają w <style> w body regułę
     .lp-wc-form-card .wpcf7-form-control:not([type=submit]):not([type=checkbox]):not([type=radio])
   (np. single-seo-ecommerce.php:394, archive-seo-ecommerce.php:423 dla
   `.lp-ec-form-card`). `.wpcf7-acceptance` to <span> z klasą
   `wpcf7-form-control` i BEZ atrybutu `type`, więc łapie się w tę regułę
   i dostaje białe tło pola input. Specyficzność (0,5,0) plus <style>
   w body — dlatego `!important`. */
.non-consent,
.non-consent .wpcf7-acceptance,
.non-consent .wpcf7-list-item,
.wpcf7-acceptance,
.wpcf7-acceptance .wpcf7-list-item {
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  padding: 0 !important;
  min-height: 0 !important;
}

/* 3. UKŁAD. `width: 100%` zamiast grid-column — kontenery formularzy to flex
   (`.contact-form-inputs-grid` ma flex-flow: column), a w flex-row blok bez
   tego się ściska.

   Blok/marginesy TYLKO pod `.non-consent`. Goły `.wpcf7-acceptance` może być
   też checkboxem newslettera w `.cf-newsletter` — tam wrapper ma `flex: none`
   i własny układ w rzędzie, więc narzucanie mu `display:block; width:100%`
   rozjechałoby ten wiersz. Zgoda RODO zawsze ma wrapper, więc nic nie traci. */
.non-consent {
  display: block;
  width: 100%;
  margin: 16px 0;
}

.non-consent .wpcf7-acceptance {
  display: block;
  width: 100%;
  margin: 0;
}

.non-consent .wpcf7-list-item,
.wpcf7-acceptance .wpcf7-list-item {
  margin: 0 !important;
}

/* Webflow daje `.w-checkbox { position: relative; margin-bottom: 20px }`
   (style.css:8086) i `padding-left: 20px` w webflow.css — gdyby zgoda
   wylądowała w takim opakowaniu, tekst byłby wcięty bez powodu. */
.w-checkbox:has(.wpcf7-acceptance) {
  padding-left: 0;
  margin-bottom: 0;
}

.non-consent label {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  margin: 0;
  cursor: pointer;
}

/* 4. CHECKBOX. `flex: 0 0 auto` jest istotne — bez tego długi tekst zgody
   ściska kwadracik do zera szerokości. `width`/`height` z !important, bo
   szablony potrafią ustawiać `width: auto` na inputach w formularzu. */
.non-consent input[type="checkbox"] {
  flex: 0 0 auto;
  width: 18px !important;
  height: 18px !important;
  min-width: 18px;
  margin: 2px 0 0;
  padding: 0 !important;
  accent-color: #5716f7;
  cursor: pointer;
}

.non-consent input[type="checkbox"]:focus-visible {
  outline: 2px solid #5716f7;
  outline-offset: 2px;
}

/* 5. TEKST. Świadomie BEZ ustawiania koloru na jasnych tłach: formularze
   stoją na białym, jasnoszarym i ciemnym tle, więc `color: inherit` bierze
   kolor z otoczenia i jedno CSS działa wszędzie. Tekst odsuwa się na drugi
   plan rozmiarem, a nie barwą. `overflow-wrap` chroni długi adres przed
   wyjściem za krawędź wąskiego formularza. */
.non-consent .wpcf7-list-item-label,
.wpcf7-acceptance .wpcf7-list-item-label {
  max-width: 70ch;
  font-size: 12.5px;
  line-height: 1.55;
  font-weight: 400;
  letter-spacing: 0;
  text-transform: none;
  text-align: left;
  color: inherit;
  overflow-wrap: anywhere;
}

/* 6. LINK — wyróżniony podkreśleniem i grubością, nie kolorem, żeby był
   widoczny i na jasnym, i na ciemnym tle. */
.non-consent .wpcf7-list-item-label a,
.wpcf7-acceptance .wpcf7-list-item-label a {
  color: inherit;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 2px;
}

.non-consent .wpcf7-list-item-label a:hover,
.non-consent .wpcf7-list-item-label a:focus-visible,
.wpcf7-acceptance .wpcf7-list-item-label a:hover,
.wpcf7-acceptance .wpcf7-list-item-label a:focus-visible {
  text-decoration-thickness: 2px;
}

/* 7. KOMUNIKAT „pole wymagane".
   CF7 wstawia .wpcf7-not-valid-tip jako ostatnie dziecko
   .wpcf7-form-control-wrap, czyli za `.wpcf7-acceptance`. Motyw daje mu
   `color: #f00` (style.css:8081) — nieczytelne na ciemnym i fioletowym tle.

   Uwaga: `:has()` trzyma osobną regułę. W liście rozdzielonej przecinkami
   jeden nieobsługiwany selektor unieważnia CAŁĄ regułę, więc mieszanie go
   z `~` odebrałoby komunikat starszym przeglądarkom. */
.wpcf7-acceptance ~ .wpcf7-not-valid-tip,
.non-consent .wpcf7-not-valid-tip {
  display: block;
  margin-top: 8px;
  font-size: 12.5px;
  line-height: 1.4;
  font-weight: 600;
  color: #ff5a5a;
}

.wpcf7-form-control-wrap:has(.wpcf7-acceptance) .wpcf7-not-valid-tip {
  display: block;
  margin-top: 8px;
  font-size: 12.5px;
  line-height: 1.4;
  font-weight: 600;
  color: #ff5a5a;
}

/* 8. CIEMNE TŁA. Na produkcji ciemny jest formularz kariery (.kar-form-card)
   i sekcje z .section-bg-color. Jeśli gdzieś tekst zgody wyjdzie ciemny na
   ciemnym, dopisz tu klasę tej sekcji. */
.kar-form-card .wpcf7-list-item-label,
.section-bg-color .wpcf7-list-item-label {
  color: rgba(255, 255, 255, 0.78);
}

.kar-form-card .wpcf7-acceptance input[type="checkbox"],
.section-bg-color .wpcf7-acceptance input[type="checkbox"] {
  accent-color: #1fff79;
}