/* ==========================================================================
   Netcomm Academy — Design System: TOKEN (L0)
   Solo variabili CSS, NESSUNA regola che imponga stili globali: header, footer
   e chrome del sito restano gestiti da OceanWP/WordPress (Customizer).
   I token sono disponibili site-wide così le viste Academy (e in futuro l'area
   utente) possono usarli; di per sé non applicano nulla finché non referenziati.

   NB: fonte canonica dei token. Tenere allineato il fallback nel plugin
   (assets/css/na-frontend.css).
   ========================================================================== */

:root {
	/* Superfici (tema scuro). */
	--na-bg: #0d0f13;          /* sfondo pagina */
	--na-bg2: #15181f;         /* sfondo rialzato / fine gradiente hero */
	--na-card: #1b1f28;        /* card */
	--na-card2: #222734;       /* superficie elevata (panel, popover) */

	/* Testo e linee. */
	--na-text: #f2f4f8;
	--na-muted: #9aa3b2;
	--na-line: #2a2f3a;

	/* Brand. */
	--na-accent: #1a7d3c;      /* verde Netcomm */
	--na-accent2: #37b85f;     /* verde chiaro (hover/accent) */
	--na-accent-ink: #ffffff;  /* testo su accent */
	--na-danger: #ff6b81;      /* cuore preferiti / errori */

	/* Raggi. */
	--na-radius: 12px;
	--na-radius-sm: 8px;
	--na-radius-pill: 999px;

	/* Ombre. */
	--na-shadow-card: 0 18px 40px rgba(0,0,0,.55);
	--na-shadow-pop: 0 16px 40px rgba(0,0,0,.6);

	/* Movimento. */
	--na-transition: .15s ease;

	/* Tipografia (applicata SOLO ai componenti Academy dal plugin). */
	--na-font: 'Inter', system-ui, -apple-system, 'Segoe UI', Roboto, Helvetica, Arial, sans-serif;

	/* Focus accessibile (usato dal plugin, scopizzato alle viste Academy). */
	--na-focus: 0 0 0 3px rgba(55,184,95,.55);
}

/* ==========================================================================
   Ultimate Member — coerenza col brand (scopato a .um).
   Baseline: i selettori UM variano per versione; rifinire sul sito live.
   ========================================================================== */
.um, .um-form, .um input, .um textarea, .um select, .um .um-button { font-family: var(--na-font) !important; }

/* Auth (login / registrazione / reset): card scura centrata. */
.um-login .um-form,
.um-register .um-form,
.um-password .um-form {
	background: var(--na-card2) !important;
	border: 1px solid var(--na-line);
	border-radius: var(--na-radius);
	padding: 28px !important;
	max-width: 520px;
	margin: 0 auto;
	box-shadow: var(--na-shadow-card);
}
.um-login .um-form input, .um-login .um-form textarea, .um-login .um-form select,
.um-register .um-form input, .um-register .um-form textarea, .um-register .um-form select,
.um-password .um-form input {
	background: var(--na-card) !important;
	color: var(--na-text) !important;
	border: 1px solid var(--na-line) !important;
	border-radius: var(--na-radius-sm) !important;
	box-shadow: none !important;
}
.um-login .um-form ::placeholder,
.um-register .um-form ::placeholder,
.um-password .um-form ::placeholder { color: var(--na-muted) !important; }
.um-login .um-field-label label,
.um-register .um-field-label label,
.um-password .um-field-label label { color: var(--na-text) !important; }

/* Pulsanti e link brand (tutta l'area UM). */
.um .um-button,
.um-form input[type="submit"] {
	background: var(--na-accent) !important;
	border-color: var(--na-accent) !important;
	color: #fff !important;
	border-radius: var(--na-radius-sm) !important;
	box-shadow: none !important;
}
.um .um-button:hover,
.um-form input[type="submit"]:hover { background: var(--na-accent2) !important; }
.um a, .um .um-link { color: var(--na-accent2); }

/* Account / Profilo: larghezza leggibile + voce attiva brand. */
.um-account, .um-profile { max-width: 1040px; margin: 30px auto; }
.um-account-side li a.current { color: var(--na-accent2) !important; border-color: var(--na-accent) !important; }
