/* Versione blocco: 1.1.2 — Rifiniture accessibilità, mobile, stati, separatori */

/* Stati focus ben visibili (keyboard-friendly) */
.att-form input[type="text"],
.att-form input[type="email"],
.att-form input[type="date"],
.att-form select,
.att-form .att-btn {
  transition: box-shadow .15s ease, border-color .15s ease, filter .15s ease;
}
.att-form input[type="text"]:focus-visible,
.att-form input[type="email"]:focus-visible,
.att-form input[type="date"]:focus-visible,
.att-form select:focus-visible,
.att-form .att-btn:focus-visible {
  outline: 0;
  border-color: var(--att-color);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--att-color), #fff 75%);
}

/* Stati disabilitato/attesa */
.att-form .att-btn[disabled] {
  opacity: .6;
  cursor: not-allowed;
}

/* Stato errore campo (usabile via JS o markup server-side) */
.att-form .is-invalid,
.att-form [aria-invalid="true"] {
  border-color: #e53e3e !important;
  background: #fff5f5 !important;
}

/* Messaggi inline (se li vuoi in futuro) */
.att-form .help-text { font-size: .875rem; opacity: .8; }

/* Separazione visiva fra step 1 (picker corso) e step 2 (form) */
.att-form--course-picker {
  background: transparent;
  padding: 0;
  margin-bottom: 1rem;
}

/* Notifica: piccola animazione e hover del pulsante chiudi */
.att-notice { animation: attFadeIn .18s ease-out; }
.att-notice__close:hover { opacity: .8; }
@keyframes attFadeIn { from { opacity: 0; transform: translateY(-2px);} to { opacity: 1; transform: translateY(0);} }

/* Mobile fine-tuning */
@media (max-width: 480px){
  .att-form { padding: .8rem; }
  .att-form .att-btn { width: 100%; }
}

/* (Facoltativo) Preferenza riduzione animazioni */
@media (prefers-reduced-motion: reduce){
  .att-notice { animation: none; }
  .att-form input, .att-form select, .att-form .att-btn { transition: none; }
}
/* ─────────────────────────────────────────────────────────────
   Variabili e base form (fallback neutri, ereditano dal tema)
   ───────────────────────────────────────────────────────────── */
.att-form-wrapper { margin: 0 0 1rem; }
.att-form { --att-color: #2b6cb0; /* fallback se non definita altrove */ }

.att-form .att-row { margin: .75rem 0 1rem; }
.att-form label { display:block; font-weight:600; margin-bottom:.35rem; }

.att-form input[type="text"],
.att-form input[type="email"],
.att-form input[type="date"],
.att-form select {
  width: 100%;
  max-width: 520px;
  padding: .55rem .65rem;
  border: 1px solid #d1d5db;
  border-radius: 4px;
  background: #fff;
}

/* Pulsante: base neutra (Divi può sovrascrivere con .et_pb_button) */
.att-form .att-btn {
  display:inline-block;
  padding:.6rem 1.1rem;
  border:1px solid var(--att-color);
  background: var(--att-color);
  color:#fff;
  border-radius:4px;
  text-decoration:none;
  cursor:pointer;
}
.att-form .att-btn:hover { filter:brightness(.96); }

/* Se Divi è attivo e il bottone ha anche .et_pb_button, lascia governare Divi */
.att-form .et_pb_button.att-btn {
  background: transparent;
  border: none;
  color: inherit;
  padding: .6rem 1.1rem; /* mantiene dimensioni simili */
}

/* ─────────────────────────────────────────────────────────────
   Notifiche successo/errore (usate dallo shortcode)
   ───────────────────────────────────────────────────────────── */
.att-notice{
  position: relative;
  margin: 0 0 1rem;
  padding: .75rem 2.25rem .75rem .9rem;
  border: 1px solid transparent;
  border-radius: 6px;
}
.att-notice--success{
  background: #f0fff4;
  border-color: #38a169;
  color: #22543d;
}
.att-notice--error{
  background: #fff5f5;
  border-color: #e53e3e;
  color: #742a2a;
}
.att-notice__close{
  position:absolute;
  top: 8px;
  right: 10px;
  background: transparent;
  border: 0;
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
  color: inherit;
}

/* ─────────────────────────────────────────────────────────────
   Blocco introduttivo “Stai richiedendo…” + email readonly
   ───────────────────────────────────────────────────────────── */
.att-intro{
  background: #f9fafb;
  border: 1px solid #e5e7eb;
  border-radius: 6px;
  padding: .85rem 1rem;
}
.att-intro input[readonly]{
  background: #f3f4f6;
  border-color: #e5e7eb;
  cursor: default;
}

/* Fine-tuning mobile (integra quelli esistenti) */
@media (max-width: 480px){
  .att-intro{ padding: .7rem .75rem; }
  .att-form input[type="text"],
  .att-form input[type="email"],
  .att-form input[type="date"],
  .att-form select { max-width: 100%; }
}