/**
 * Design tokens — source de vérité (aligné Elementor default-kit).
 * Primary = #0A0A0A · Accent = #F9A01B (orange marque).
 */

@layer tokens {
	:root {
		/* —— Couleurs marque —— */
		--color-primary: #0A0A0A;
		--color-secondary: #5A5A5A;
		--color-accent: #F9A01B;
		--color-accent-hover: #E08F12;
		--color-accent-rgb: 249, 160, 27;
		--color-urgence: #EE2934;
		--color-success: #34C759;

		/* —— Surfaces / texte —— */
		--color-inverse: #FFFFFF;
		--color-muted: #A0A0A0;
		--color-surface: #F6F6F4;
		--color-border: #E5E5E3;
		--color-border-dark: #2A2A2A;
		--color-bg-dark: #000000;

		/* —— Typo —— */
		--font-display: "Work Sans", sans-serif;
		--font-body: "Poppins", sans-serif;
		--font-mono: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo, Consolas, "Liberation Mono", monospace;

		/* —— Rayons —— */
		--radius-sm: 4px;
		--radius-md: 8px;
		--radius-full: 999px;

		/* —— Composants —— */
		--size-status-dot: 10px;

		/* —— Espacements (échelle type Tailwind) —— */
		--space-1: 0.25rem;
		--space-2: 0.5rem;
		--space-3: 0.75rem;
		--space-4: 1rem;
		--space-5: 1.25rem;
		--space-6: 1.5rem;
		--space-8: 2rem;
	}
}