/* =================================================================================================
   SEKCJA FORMULARZA cco.expert — czysty CSS, bez Kubio (31.07.2026)
   Wartości z pomiaru starej sekcji Kubio na ekranie 1440 px:
   karta x=202 szer.=1035, promień 10 px, cień 0 19px 38px rgba(0,0,0,.16), tło granat 35,32,57,
   wyściółka 20,7 / 41,4 / 41,4 px; nagłówek 32 px Lato waga 300 odstęp liter 1 px kolor 246,247,248;
   pola 952×44 px, obramowanie 1 px #ccc, wyściółka 10/25 px, tekst 14 px;
   przycisk 133×55 px, granat, biały tekst 12 px, odstęp liter 2 px, promień 10 px, WERSALIKI.
   ================================================================================================= */

.cco-form {
  /* Sekcja Kubio była pełnej szerokości. Nasz shortcode jest zwykłym blokiem w treści, więc
     WordPress narzuca mu szerokość kolumny tekstu (zmierzone: `max-width:840px` + wyśrodkowanie).
     `!important` jest konieczne — reguła układu WordPressa celuje w dzieci `.wp-block-post-content`
     i wygrywa ze zwykłym selektorem klasowym. */
  max-width: none !important;
  width: auto !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  padding: 61px 0 50px;          /* zmierzone: 61 px nad kartą, 50 px pod nią */
}
.cco-form__karta {
  width: 1035px;
  max-width: calc(100% - 48px);
  margin: 0 auto;
  background: rgb(35, 32, 57);
  border-radius: 10px;
  box-shadow: 0 19px 38px rgba(0, 0, 0, 0.16);
  overflow: hidden;              /* żeby białe wnętrze nie wychodziło poza zaokrąglenie */
}
.cco-form__tytul {
  margin: 0;
  padding: 21px 41px 20px;
  font-family: Lato, Helvetica, Arial, sans-serif;
  font-size: 32px;
  font-weight: 300;
  letter-spacing: 1px;
  line-height: 1.4;
  text-align: center;
  color: rgb(246, 247, 248);
}
.cco-form__tresc {
  background: #fff;
  padding: 30px 41px 41px;
}

/* --- pola Contact Form 7 -------------------------------------------------------------------- */
.cco-form__tresc .wpcf7-form p { margin: 0 0 16px; }
.cco-form__tresc label {
  display: block;
  font-family: Lato, Helvetica, Arial, sans-serif;
  font-size: 16px;
  font-weight: 300;
  color: rgb(18, 19, 21);
}
/* ⚠️ Wyliczamy typy pól, bo CF7 wystawia też `number` (NIP na formularzu szkolenia) i `date`.
   Bez `number` pole NIP-u wychodziło wąskie, na szerokość domyślną przeglądarki. */
.cco-form__tresc input[type="text"],
.cco-form__tresc input[type="email"],
.cco-form__tresc input[type="tel"],
.cco-form__tresc input[type="number"],
.cco-form__tresc input[type="url"],
.cco-form__tresc input[type="date"],
.cco-form__tresc textarea,
.cco-form__tresc select {
  box-sizing: border-box;
  width: 100%;
  height: 44px;
  margin-top: 4px;
  padding: 10px 25px;
  font-family: Lato, Helvetica, Arial, sans-serif;
  font-size: 14px;
  color: rgb(18, 19, 21);
  background: transparent;
  border: 1px solid #ccc;
  border-radius: 0;
}
.cco-form__tresc textarea { height: auto; min-height: 120px; }
.cco-form__tresc input:focus,
.cco-form__tresc textarea:focus { outline: none; border-color: rgb(35, 32, 57); }

/* zgoda RODO — pole wyboru w jednej linii z tekstem */
.cco-form__tresc .wpcf7-acceptance .wpcf7-list-item { margin: 0; }
.cco-form__tresc .wpcf7-acceptance label { display: flex; align-items: flex-start; gap: 10px; font-size: 14px; }
.cco-form__tresc .wpcf7-acceptance input[type="checkbox"] { width: 13px; height: 13px; margin-top: 4px; flex: 0 0 auto; }
/* Dwie zgody pod sobą stały 64 px od siebie i wyglądały jak dwie osobne sekcje.
   ⚠️ SKĄD TEN ODSTĘP: akapity zgód mają w formularzu CF7 wpisany w kod `padding: 23px`
   (23 na dole + 16 marginesu + 23 na górze). Formularza w bazie nie ruszamy — ściągamy odstęp
   tutaj i TYLKO MIĘDZY SĄSIADUJĄCYMI zgodami, żeby formularze z jedną kratką (konsultacje,
   newsletter) zostały dokładnie takie, jakie były. */
.cco-form__tresc .wpcf7-form p:has(.wpcf7-acceptance):has(+ p .wpcf7-acceptance) {
  padding-bottom: 4px !important;
  margin-bottom: 0 !important;
}
.cco-form__tresc .wpcf7-form p:has(.wpcf7-acceptance) + p:has(.wpcf7-acceptance) {
  padding-top: 4px !important;
}

/* --- przycisk ------------------------------------------------------------------------------- */
.cco-form__tresc input[type="submit"] {
  padding: 20px 40px;
  font-family: Lato, Helvetica, Arial, sans-serif;
  font-size: 12px;
  letter-spacing: 2px;
  text-transform: uppercase;
  color: #fff;
  background: rgb(35, 32, 57);
  border: 0;
  border-radius: 10px;
  cursor: pointer;
  transition: background .2s ease;
}
.cco-form__tresc input[type="submit"]:hover { background: rgb(87, 79, 141); }

/* --- opis pod formularzem (regulamin szkolenia) ----------------------------------------------
   Zmierzone na starej sekcji: 16 px Lato, interlinia 25,6 px, wyjustowany, kolor 10,14,20. */
.cco-form__opis {
  margin-top: 26px;
  font-family: Lato, Helvetica, Arial, sans-serif;
  font-size: 16px;
  line-height: 25.6px;
  text-align: justify;
  color: rgb(10, 14, 20);
}
.cco-form__opis strong { font-weight: 600; }
/* wariant newsletter: opis stoi NAD formularzem i jest wyrównany do lewej */
.cco-form__opis--nad { margin: 0 0 26px; text-align: left; }
/* Kotwica `#newsletter` zostaje (linki w serwisie), ale stara reguła `#newsletter h3`
   podnosiła nagłówek o 10 px pod ścięte tło Kubio — w naszej ramce jest zbędna. */
.cco-form--newsletter .cco-form__tytul { transform: none; }

/* --- komunikaty CF7 ------------------------------------------------------------------------- */
.cco-form__tresc .wpcf7-not-valid-tip { font-size: 13px; color: #c0392b; margin-top: 4px; }
.cco-form__tresc .wpcf7-response-output { margin: 16px 0 0; padding: 12px 16px; font-size: 14px; }

/* --- mniejsze ekrany ------------------------------------------------------------------------ */
/* ⚠️ Na węższych ekranach zdejmujemy STAŁĄ szerokość, nie `max-width` — karta ma zadane
   `width: 1035px`, więc samo `max-width:none` puszczało ją na 1035 px i robiło poziomy suwak. */
@media (max-width: 1100px) {
  .cco-form__karta { width: auto; max-width: none; margin: 0 24px; }
}
@media (max-width: 640px) {
  .cco-form__karta { width: auto; margin: 0 16px; }
  .cco-form__tytul { font-size: 24px; padding: 18px 20px 16px; }
  .cco-form__tresc { padding: 22px 20px 26px; }
  /* odstęp nagłówek → pierwsze pole, ten sam problem co w wersji Kubio (dziennik 28.07) */
  .cco-form__tresc .wpcf7-form > p:first-child { margin-top: 6px; }
}

/* --- bileciki z ceną szkolenia (skrypt `bileciki.js`) ----------------------------------------
   Pływające okienko `frozen-box` ma własny skrypt sterujący `visibility`, więc chowamy je
   z `!important` — inaczej tamten skrypt przywracałby je przy każdym przewinięciu. */
.frozen-box.cco-bilet-ukryty {
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transition: opacity .25s ease;
}