/* ============================================================
   NTRA - Primitive di interfaccia condivise
   (moduli, area utente, liste viaggio, login)
   Colori, bordi e dimensioni dei testi vengono dalle variabili di style.css.
   ============================================================ */

/* Titoletto piccolo maiuscolo sopra un titolo */
.ntra-eyebrow {margin: 0 0 6px; color: var(--nta-coral-dark); font-size: var(--nta-fs-xs); font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;}

/* Etichetta di un campo */
.ntra-field-label {display: block; margin: 10px 0 3px; color: var(--nta-black); font-size: var(--nta-fs-small); font-weight: 700;}

/* Campo di testo / numero / data / email / password / textarea / select */
.ntra-field-input {box-sizing: border-box; width: 100%; min-height: 35px; padding: 8px 10px; color: var(--nta-black); background: var(--nta-white); border: var(--nta-border); border-radius: var(--nta-field-radius); font-size: var(--nta-fs-body); transition: background-color 0.2s ease;}
.ntra-field-input:focus {outline: 2.4px solid var(--nta-gold); outline-offset: 0; background: #fffbe8;}
textarea.ntra-field-input {resize: vertical;}

/* Testo di aiuto sotto un campo */
.ntra-field-help {margin: 3px 0 0; color: var(--nta-text-muted); font-size: var(--nta-fs-xs);}

/* Riquadro bianco (form e schede dentro un contenitore) */
.ntra-surface-card {padding: 22px; background: var(--nta-white); border: var(--nta-border); border-radius: var(--nta-block-radius); box-shadow: var(--nta-card-shadow);}

@media (max-width: 640px) {
    .ntra-surface-card {padding: 16px;}
}