/* =====================================================================
   Contact Form 7 — stile
   Richiede il markup con .cf7-grid / .cf7-field / .cf7-full / .cf7-actions
   ===================================================================== */

/* ---------- Palette e misure (unico punto da ritoccare) ---------- */
.wpcf7-form {
  --cf7-ink:          #483112;               /* testi scuri                */
  --cf7-label:        #a87b4f;               /* etichette                  */
  --cf7-accent:       #a87b4f;               /* bordi attivi e bottone     */
  --cf7-btn-hover-ink: rgba(255, 255, 255, .85); /* hover bottone, come il tema */
  --cf7-line:         rgba(72, 49, 18, .18); /* bordi a riposo             */
  --cf7-field-bg:     rgba(255, 255, 255, .5);
  --cf7-error:        #b3412e;
  --cf7-radius:       5px;
  --cf7-gap:          24px;

  --cf7-font-label:   "Cormorant", "Cormorant Garamond", Georgia, serif;
  --cf7-font-field:   "Source Serif 4", Georgia, serif;
}

/* ---------- Neutralizzo il markup di default (p + br) ---------- */
.wpcf7-form p { margin: 0; }

.wpcf7-form .cf7-field br,
.wpcf7-form .cf7-actions br { display: none; }

.wpcf7-form .hidden-fields-container {
  margin: 0;
  padding: 0;
  border: 0;
}

.wpcf7-form .wpcf7-form-control-wrap { display: block; }

/* ---------- Griglia dei campi ---------- */
/* 2 colonne: nome/email e pronomi/telefono in un 2×2 ordinato */
.wpcf7-form .cf7-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: var(--cf7-gap);
  align-items: start;
}

/* Checkbox e messaggio occupano tutta la larghezza */
.wpcf7-form .cf7-full { grid-column: 1 / -1; }

/* ---------- Campo: etichetta sopra, controllo sotto ---------- */
.wpcf7-form .cf7-field {
  display: flex;
  flex-direction: column;
  gap: 9px;
  min-width: 0;          /* i fieldset in griglia non si stringono da soli */
  margin: 0;
  padding: 0;
  border: 0;
}

.wpcf7-form .cf7-field > label,
.wpcf7-form .cf7-field > legend {
  display: block;
  padding: 0;
  font-family: var(--cf7-font-label);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: .14em;
  text-transform: uppercase;
  color: var(--cf7-label);
  line-height: 1.4;
}

/* La legend non partecipa al flex del fieldset: spazio a mano */
.wpcf7-form .cf7-field > legend { margin-bottom: 9px; }

.wpcf7-form .cf7-req,
.wpcf7-form .cf7-opt {
  letter-spacing: normal;
  text-transform: none;
  font-size: .82em;
}

/* ---------- Campi di testo ---------- */
.wpcf7-form input[type="text"],
.wpcf7-form input[type="email"],
.wpcf7-form input[type="tel"],
.wpcf7-form input[type="url"],
.wpcf7-form input[type="number"],
.wpcf7-form input[type="date"],
.wpcf7-form select,
.wpcf7-form textarea {
  width: 100%;
  box-sizing: border-box;
  padding: 13px 16px;
  font-family: var(--cf7-font-field);
  font-size: 16px;
  line-height: 1.5;
  letter-spacing: normal;
  text-transform: none;
  color: var(--cf7-ink);
  background: var(--cf7-field-bg);
  border: 1px solid var(--cf7-line);
  border-radius: var(--cf7-radius);
  box-shadow: none;
  transition: border-color .2s ease, box-shadow .2s ease, background-color .2s ease;
}

.wpcf7-form input::placeholder,
.wpcf7-form textarea::placeholder {
  font-family: var(--cf7-font-field);
  color: rgba(72, 49, 18, .45);
}

.wpcf7-form textarea {
  min-height: 170px;
  resize: vertical;
}

.wpcf7-form input:focus,
.wpcf7-form select:focus,
.wpcf7-form textarea:focus {
  outline: 2px solid transparent;           /* segnaposto per l'alto contrasto */
  outline-offset: 2px;
  background: #fff;
  border-color: var(--cf7-accent);
  box-shadow: 0 0 0 3px rgba(168, 123, 79, .16);
}

/* Via le frecce dal campo numerico (se ne usi uno altrove) */
.wpcf7-form input[type="number"] { -moz-appearance: textfield; appearance: textfield; }
.wpcf7-form input[type="number"]::-webkit-outer-spin-button,
.wpcf7-form input[type="number"]::-webkit-inner-spin-button {
  -webkit-appearance: none;
  margin: 0;
}

/* Autofill del browser: evita il fondo azzurro */
.wpcf7-form input:-webkit-autofill,
.wpcf7-form input:-webkit-autofill:focus {
  -webkit-box-shadow: 0 0 0 1000px #fffdf9 inset;
  -webkit-text-fill-color: var(--cf7-ink);
}

/* ---------- Checkbox ---------- */
.wpcf7-form .wpcf7-checkbox,
.wpcf7-form .wpcf7-radio {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 30px;
  margin-top: 2px;
}

.wpcf7-form .wpcf7-list-item { margin: 0; }

/* flex-start: se l'opzione va a capo, la casella resta sulla prima riga */
.wpcf7-form .wpcf7-list-item > label {
  display: inline-flex;
  align-items: flex-start;
  gap: 11px;
  cursor: pointer;
}

.wpcf7-form .wpcf7-list-item-label {
  font-family: var(--cf7-font-field);
  font-size: 16px;
  letter-spacing: normal;
  text-transform: none;
  color: var(--cf7-ink);
  line-height: 1.3;
}

.wpcf7-form input[type="checkbox"],
.wpcf7-form input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  flex: 0 0 auto;
  width: 20px;
  height: 20px;
  margin: 0;               /* allinea la casella alla prima riga di testo */
  display: grid;
  place-content: center;
  background: var(--cf7-field-bg);
  border: 1px solid var(--cf7-line);
  border-radius: 4px;
  cursor: pointer;
  transition: background-color .18s ease, border-color .18s ease;
}

.wpcf7-form input[type="radio"] { border-radius: 50%; }

.wpcf7-form input[type="checkbox"]::before,
.wpcf7-form input[type="radio"]::before {
  content: "";
  width: 11px;
  height: 11px;
  background: #fff;
  transform: scale(0);
  transition: transform .15s ease;
  clip-path: polygon(14% 44%, 0 65%, 50% 100%, 100% 16%, 80% 0%, 43% 62%);
}

.wpcf7-form input[type="radio"]::before {
  clip-path: none;
  border-radius: 50%;
  width: 8px;
  height: 8px;
}

.wpcf7-form input[type="checkbox"]:checked,
.wpcf7-form input[type="radio"]:checked {
  background: var(--cf7-accent);
  border-color: var(--cf7-accent);
}

.wpcf7-form input[type="checkbox"]:checked::before,
.wpcf7-form input[type="radio"]:checked::before { transform: scale(1); }

.wpcf7-form input[type="checkbox"]:focus-visible,
.wpcf7-form input[type="radio"]:focus-visible {
  outline: 2px solid var(--cf7-accent);
  outline-offset: 2px;
}

.wpcf7-form .wpcf7-list-item > label:hover input[type="checkbox"]:not(:checked),
.wpcf7-form .wpcf7-list-item > label:hover input[type="radio"]:not(:checked) {
  border-color: var(--cf7-accent);
}

/* ---------- Bottone di invio ---------- */
.wpcf7-form .cf7-actions {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-top: 34px;
}

/* Stesso aspetto di .uk-button.uk-button-secondary di YOOtheme */
.wpcf7-form input[type="submit"] {
  appearance: none;
  -webkit-appearance: none;
  display: inline-block;
  box-sizing: border-box;
  margin: 0;
  padding: 0 30px;
  overflow: visible;
  vertical-align: middle;
  font-family: var(--cf7-font-label);
  font-size: 14px;
  font-weight: 400;
  line-height: 40px;
  letter-spacing: 1px;
  text-transform: uppercase;
  text-align: center;
  text-decoration: none;
  color: #fff;
  background-color: var(--cf7-accent);
  background-origin: border-box;
  border: 1px solid transparent;
  border-radius: 20px;
  cursor: pointer;
  transition: .1s ease-in-out;
  transition-property: color, background-color, border-color, box-shadow, transform;
}

.wpcf7-form input[type="submit"]:hover {
  background-color: var(--cf7-accent);
  color: var(--cf7-btn-hover-ink);
}
.wpcf7-form input[type="submit"]:active { transform: translateY(1px); }
.wpcf7-form input[type="submit"]:focus-visible {
  outline: 2px solid var(--cf7-accent);
  outline-offset: 3px;
}

.wpcf7-form .wpcf7-spinner { margin: 0; }

/* ---------- Errori e messaggi di risposta ---------- */
.wpcf7-form .wpcf7-not-valid {
  border-color: var(--cf7-error);
  background: rgba(179, 65, 46, .04);
}

.wpcf7-form .wpcf7-not-valid-tip {
  margin-top: 7px;
  font-size: .8rem;
  letter-spacing: normal;
  text-transform: none;
  color: var(--cf7-error);
}

.wpcf7 form .wpcf7-response-output {
  margin: 26px 0 0;
  padding: 14px 18px;
  font-size: 16px;
  line-height: 1.5;
  color: var(--cf7-ink);
  border: 1px solid var(--cf7-line);
  border-radius: var(--cf7-radius);
}

.wpcf7 form.sent .wpcf7-response-output {
  border-color: var(--cf7-accent);
  background: rgba(168, 123, 79, .08);
}

.wpcf7 form.invalid .wpcf7-response-output,
.wpcf7 form.unaccepted .wpcf7-response-output,
.wpcf7 form.payment-required .wpcf7-response-output,
.wpcf7 form.failed .wpcf7-response-output,
.wpcf7 form.aborted .wpcf7-response-output,
.wpcf7 form.spam .wpcf7-response-output {
  border-color: var(--cf7-error);
  background: rgba(179, 65, 46, .06);
  color: var(--cf7-error);
}

/* ---------- Mobile ---------- */
@media (max-width: 959px) {
  .wpcf7-form .cf7-grid {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .wpcf7-form .wpcf7-checkbox,
  .wpcf7-form .wpcf7-radio {
    flex-direction: column;
    gap: 12px;
  }

  .wpcf7-form input[type="submit"] { width: 100%; }
  .wpcf7-form .cf7-actions { flex-wrap: wrap; }
}

/* ---------- Accessibilità ---------- */
@media (prefers-reduced-motion: reduce) {
  .wpcf7-form * { transition: none !important; }
}

/* Richiesta di più contrasto (macOS, iOS, Windows, Android).
   Stesse tinte della palette, portate a piena opacità. */
@media (prefers-contrast: more) {
  .wpcf7-form { --cf7-line: rgba(72, 49, 18, .85); }

  .wpcf7-form input[type="text"],
  .wpcf7-form input[type="email"],
  .wpcf7-form input[type="tel"],
  .wpcf7-form input[type="url"],
  .wpcf7-form input[type="number"],
  .wpcf7-form input[type="date"],
  .wpcf7-form select,
  .wpcf7-form textarea,
  .wpcf7-form input[type="checkbox"],
  .wpcf7-form input[type="radio"] {
    border-width: 2px;
    background: #fff;
  }

  .wpcf7-form .wpcf7-not-valid {
    border-width: 2px;
    border-style: dashed;
  }
}

/* Windows alto contrasto.
   I colori con alfa (--cf7-line) qui non vengono sostituiti dal browser e
   diventano invisibili: bordi e fondi vanno ridichiarati con i colori
   di sistema, che seguono il tema scelto dall'utente. */
@media (forced-colors: active) {

  /* Bordi dei campi: senza questo il contorno sparisce */
  .wpcf7-form input[type="text"],
  .wpcf7-form input[type="email"],
  .wpcf7-form input[type="tel"],
  .wpcf7-form input[type="url"],
  .wpcf7-form input[type="number"],
  .wpcf7-form input[type="date"],
  .wpcf7-form select,
  .wpcf7-form textarea {
    background: Field;
    color: FieldText;
    border: 1px solid FieldText;
  }

  /* Il fondo bianco del focus non deve mangiarsi il campo */
  .wpcf7-form input:focus,
  .wpcf7-form select:focus,
  .wpcf7-form textarea:focus {
    background: Field;
    border-color: Highlight;
    outline: 2px solid Highlight;
    outline-offset: 2px;
  }

  /* Errore: in alto contrasto il rosso non arriva, serve una differenza di forma */
  .wpcf7-form .wpcf7-not-valid {
    border-width: 2px;
    border-style: dashed;
  }

  /* Torno alle checkbox native: quelle disegnate a mano qui scompaiono */
  .wpcf7-form input[type="checkbox"],
  .wpcf7-form input[type="radio"] {
    appearance: auto;
    -webkit-appearance: auto;
    width: auto;
    height: auto;
    border: 0;
    background: none;
  }

  .wpcf7-form input[type="checkbox"]::before,
  .wpcf7-form input[type="radio"]::before { content: none; }

  .wpcf7-form input[type="submit"] {
    background: ButtonFace;
    color: ButtonText;
    border: 1px solid ButtonText;
  }

  .wpcf7-form input[type="submit"]:hover,
  .wpcf7-form input[type="submit"]:focus-visible {
    background: Highlight;
    color: HighlightText;
  }

  /* Riquadro dei messaggi di risposta */
  .wpcf7 form .wpcf7-response-output { border: 1px solid CanvasText; }
}

/* =====================================================================
   WP Accessibility — pulsante "Alto contrasto"
   Il plugin aggiunge la classe .contrast al <body> e inietta
   a11y-contrast.css, che forza fondo nero e testo chiaro con !important.
   Quel foglio però dà un bordo solo a input[type=text|password|search]:
   email, tel e textarea restano col bordo della palette e spariscono.
   Le regole qui sotto valgono SOLO a contrasto attivo e non toccano
   in alcun modo i colori del sito in condizioni normali.
   La specificità (body.contrast .wpcf7-form …) serve a vincere sul
   foglio del plugin, che viene iniettato dopo questo.
   ===================================================================== */

body.contrast .wpcf7-form input[type="text"],
body.contrast .wpcf7-form input[type="email"],
body.contrast .wpcf7-form input[type="tel"],
body.contrast .wpcf7-form input[type="url"],
body.contrast .wpcf7-form input[type="number"],
body.contrast .wpcf7-form input[type="date"],
body.contrast .wpcf7-form select,
body.contrast .wpcf7-form textarea {
  border: 1px solid #fff !important;
}

/* Checkbox e radio: senza questo, selezionata e non selezionata
   sono entrambe un quadrato nero. */
body.contrast .wpcf7-form input[type="checkbox"],
body.contrast .wpcf7-form input[type="radio"] {
  border: 2px solid #fff !important;
  background: #000 !important;
}

body.contrast .wpcf7-form input[type="checkbox"]:checked,
body.contrast .wpcf7-form input[type="radio"]:checked {
  background: #fff !important;
}

/* La spunta: scura dentro il quadrato bianco */
body.contrast .wpcf7-form input[type="checkbox"]::before,
body.contrast .wpcf7-form input[type="radio"]::before {
  background: #000 !important;
}

/* Errori: il rosso viene sostituito dal foglio del plugin,
   serve una differenza di forma */
body.contrast .wpcf7-form .wpcf7-not-valid {
  border: 2px dashed #fff !important;
}

/* Bottone e riquadro dei messaggi: il plugin dà al submit un fondo
   #600040 che su nero si distingue appena. */
body.contrast .wpcf7-form input[type="submit"],
body.contrast .wpcf7 form .wpcf7-response-output {
  border: 1px solid #fff !important;
}