/* ============================================================
   Forminator na ciemnym (granatowym) tle — §10 handoffu.
   Prefiks „html body" + !important przebija specyficzność
   #forminator-module-<id>. Kolory wyłącznie z tokenów.
   ============================================================ */

/* Etykiety pól */
html body .forminator-ui.forminator-custom-form .forminator-label {
  color: var(--brand-base) !important;
  font-family: var(--wp--preset--font-family--brand-text) !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
}

/* Pola: przezroczyste, podkreślenie jak na wzorcu */
html body .forminator-ui.forminator-custom-form .forminator-input,
html body .forminator-ui.forminator-custom-form textarea.forminator-textarea {
  background: transparent !important;
  border: 0 !important;
  border-bottom: 1px solid rgba(255, 255, 255, 0.5) !important;
  border-radius: 0 !important;
  color: var(--brand-base) !important;
  padding: 8px 0 !important;
  font-size: 1rem !important;
  box-shadow: none !important;
}
html body .forminator-ui.forminator-custom-form .forminator-input:focus,
html body .forminator-ui.forminator-custom-form textarea.forminator-textarea:focus {
  border-bottom-color: var(--brand-base) !important;
  outline: none !important;
}
html body .forminator-ui.forminator-custom-form .forminator-input::placeholder,
html body .forminator-ui.forminator-custom-form textarea.forminator-textarea::placeholder {
  color: rgba(255, 255, 255, 0.55) !important;
}

/* Checkboxy zgód — tekst na granacie (drobny druk, ciasna interlinia jak na makuratserwis.pl) */
html body .forminator-ui.forminator-custom-form .forminator-checkbox .forminator-checkbox-label,
html body .forminator-ui.forminator-custom-form .forminator-checkbox__label,
html body .forminator-ui.forminator-custom-form .forminator-consent__label {
  color: var(--brand-silver) !important;
  font-size: 0.75rem !important;
  line-height: 1.35 !important;
}

/* Etykieta pola checkbox (np. „i wyrażam zgodę na kontakt…") — drobna, nie jak label inputu */
html body .forminator-ui.forminator-custom-form .forminator-field--checkbox .forminator-label {
  color: var(--brand-silver) !important;
  font-size: 0.75rem !important;
  line-height: 1.45 !important;
  font-weight: 400 !important;
  margin-bottom: 6px !important;
}

/* Ciaśniejsze odstępy między checkboxami zgód */
html body .forminator-ui.forminator-custom-form .forminator-field--checkbox .forminator-checkbox {
  margin: 0 0 6px !important;
}
html body .forminator-ui.forminator-custom-form .forminator-checkbox input + span[aria-hidden] {
  width: 16px !important;
  height: 16px !important;
  /* Forminator daje flex-basis:20px, które w flexie wygrywa z width → prostokąt 20×16.
     flex-basis 16px przywraca kwadrat. */
  flex: 0 0 16px !important;
}
html body .forminator-ui.forminator-custom-form .forminator-checkbox input + span[aria-hidden] {
  background: transparent !important;
  border: 1px solid rgba(255, 255, 255, 0.6) !important;
}
html body .forminator-ui.forminator-custom-form .forminator-checkbox input:checked + span[aria-hidden] {
  background: var(--brand-base) !important;
  border-color: var(--brand-base) !important;
}
html body .forminator-ui.forminator-custom-form .forminator-checkbox input:checked + span[aria-hidden] svg path {
  fill: var(--brand-primary) !important;
}

/* Treści HTML w formularzu (info RODO nad zgodami).
   UWAGA: w tej wersji Forminatora pole HTML renderuje się jako goły <p>
   bezpośrednio w .forminator-row (bez .forminator-html/.forminator-field). */
html body .forminator-ui.forminator-custom-form .forminator-html,
html body .forminator-ui.forminator-custom-form .forminator-field-html p,
html body .forminator-ui.forminator-custom-form .forminator-row > p {
  color: var(--brand-base) !important;
  font-size: 0.6875rem !important;
  line-height: 1.4 !important;
  margin: 0 !important;
}
html body .forminator-ui.forminator-custom-form .forminator-html a,
html body .forminator-ui.forminator-custom-form .forminator-field-html p a,
html body .forminator-ui.forminator-custom-form .forminator-row > p a {
  color: var(--brand-base) !important;
  text-decoration: underline !important;
}

/* Ciaśniejsze odstępy pionowe bloku zgód: rząd z tekstem RODO podciągnięty
   do pola VIN i przyklejony do checkboxów; rzędy checkboxów blisko siebie. */
html body .forminator-ui.forminator-custom-form .forminator-row:has(> p),
html body .forminator-ui.forminator-custom-form .forminator-row:has(.forminator-field-html) {
  margin-top: -12px !important;
  margin-bottom: 10px !important;
}
html body .forminator-ui.forminator-custom-form .forminator-row:has(.forminator-checkbox) {
  margin-bottom: 8px !important;
}

/* Etykieta pola checkbox („i wyrażam zgodę…") — bez klasy modyfikatora
   w tej wersji, stąd :has() na strukturze pola. */
html body .forminator-ui.forminator-custom-form .forminator-field:has(> .forminator-checkbox) > .forminator-label {
  color: var(--brand-base) !important;
  font-size: 0.6875rem !important;
  line-height: 1.4 !important;
  font-weight: 400 !important;
  margin: 0 0 6px !important;
}

/* Przycisk „Wyślij" — biała pigułka jak na wzorcu; odsunięty od bloku zgód */
html body .forminator-ui.forminator-custom-form .forminator-button-submit {
  margin-top: 32px !important;
  background: var(--brand-base) !important;
  color: var(--brand-primary) !important;
  border: 2px solid var(--brand-base) !important;
  border-radius: var(--brand-radius-pill) !important;
  padding: 0 32px !important;
  min-height: 44px !important;
  font-family: var(--wp--preset--font-family--brand-text) !important;
  font-size: 1rem !important;
  font-weight: 400 !important;
  transition: background 0.15s ease, color 0.15s ease;
}
html body .forminator-ui.forminator-custom-form .forminator-button-submit:hover {
  background: transparent !important;
  color: var(--brand-base) !important;
}

/* Walidacja — czerwień VW (jak wzorzec: komunikat + ramka pola) */
html body .forminator-ui.forminator-custom-form .forminator-error-message {
  color: #fff !important;
  background: var(--brand-error) !important;
  padding: 2px 8px !important;
  font-size: 0.75rem !important;
}
html body .forminator-ui.forminator-custom-form .forminator-field--error .forminator-input {
  border-bottom-color: var(--brand-error) !important;
}

/* Komunikat sukcesu */
html body .forminator-ui .forminator-response-message.forminator-success {
  color: var(--brand-base) !important;
  background: rgba(255, 255, 255, 0.12) !important;
  border: 0 !important;
}
