/*
 * Tema — unica fonte di verità per colori, spaziature, tipografia. Cambiare lo stile del CRM
 * significa toccare questo file (e app.css per i componenti), mai i singoli template PHP.
 * Font Manrope autoospitato (file locale in public/assets/fonts/, licenza OFL) — zero
 * richieste esterne, zero dipendenze: il file viaggia con il progetto, non con un servizio
 * di terzi. font-display:swap così il testo è leggibile subito coi font di sistema mentre
 * Manrope si carica, senza bloccare nulla.
 */

@font-face {
	font-family: 'Manrope';
	src: url('/assets/fonts/Manrope-VariableFont_wght.woff2') format('woff2-variations'),
	     url('/assets/fonts/Manrope-VariableFont_wght.woff2') format('woff2');
	font-weight: 200 800;
	font-style: normal;
	font-display: swap;
}

:root {
	/* Palette neutra quasi monocromatica + un solo accento — non la tavolozza arcobaleno
	   di un pannello anni 2000: un colore che parla forte (l'indaco), il resto è grigio. */
	--color-bg: #f6f6f9;
	--color-surface: #ffffff;
	--color-surface-muted: #f7f7fb;
	--color-border: #e6e6ee;
	--color-text: #111318;
	--color-text-muted: #6c6f7d;
	--color-text-faint: #9a9ca8;

	--color-primary: #4f46e5;
	--color-primary-hover: #4338ca;
	--color-primary-soft: #eeecfd;

	--color-success: #16a34a;
	--color-success-soft: #eafbf1;
	--color-warning: #d97706;
	--color-warning-soft: #fef3e2;
	--color-danger: #dc2626;
	--color-danger-soft: #fdecec;
	--color-info: #7c3aed;
	--color-info-soft: #f2ecfe;

	--radius-sm: 8px;
	--radius-md: 12px;
	--radius-lg: 18px;

	--shadow-sm: 0 1px 2px rgba(17, 19, 24, 0.05);
	--shadow-md: 0 8px 24px rgba(17, 19, 24, 0.07);
	--shadow-lg: 0 16px 40px rgba(17, 19, 24, 0.14);

	--space-1: 4px;
	--space-2: 8px;
	--space-3: 12px;
	--space-4: 16px;
	--space-5: 24px;
	--space-6: 32px;
	--space-7: 48px;

	--font-sans: 'Manrope', -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	--sidebar-width: 248px;
	--topbar-height: 60px;
}

@media (prefers-color-scheme: dark) {
	:root {
		--color-bg: #0d0e12;
		--color-surface: #17181f;
		--color-surface-muted: #1c1d26;
		--color-border: #2a2b36;
		--color-text: #eeeef2;
		--color-text-muted: #9c9ea9;
		--color-text-faint: #6a6c78;
		--color-primary: #6d63f5;
		--color-primary-hover: #7d74f7;
		--color-primary-soft: #24214a;
		--color-success-soft: #103322;
		--color-warning-soft: #3a2a10;
		--color-danger-soft: #3a1616;
		--color-info-soft: #29204a;
	}
}

* {
	box-sizing: border-box;
}

html, body {
	margin: 0;
	padding: 0;
	background: var(--color-bg);
	color: var(--color-text);
	font-family: var(--font-sans);
	font-size: 15px;
	line-height: 1.55;
	-webkit-font-smoothing: antialiased;
	-moz-osx-font-smoothing: grayscale;
	/* Garanzia strutturale: la pagina intera non scorre mai in orizzontale, qualunque cosa
	   ci sia dentro. Un contenuto troppo largo (tabella, riga di bottoni) deve gestirsi il
	   proprio scroll interno — vedi .table-scroll — mai far scorrere tutta la pagina di lato. */
	overflow-x: hidden;
}

a, button {
	/* Toglie il ritardo di ~300ms che i browser mobile mettono di default prima di un tap,
	   in attesa di capire se sta arrivando un doppio-tap per zoomare — qui non serve mai,
	   quindi il click/tap parte all'istante invece che con quella pausa. */
	touch-action: manipulation;
}

a {
	color: var(--color-primary);
	text-decoration: none;
}

a:hover {
	text-decoration: underline;
}

h1, h2, h3, h4 {
	font-weight: 700;
	letter-spacing: -0.01em;
	margin: 0 0 var(--space-3);
	line-height: 1.25;
}

h1 { font-size: 1.6rem; }
h2 { font-size: 1.2rem; }
h3 { font-size: 1rem; }

p { margin: 0 0 var(--space-3); }

input, select, textarea, button {
	font-family: inherit;
	font-size: 0.95rem;
}