/* ==========================================================================
   Design Tokens - Institute Brand
   Source of truth: Brand Guidelines v1 + Design System Companion Docs v1
   All component CSS in this theme references these variables. Never
   hardcode a color, spacing, or radius value elsewhere - update it here once.
   ========================================================================== */

:root {
	/* Color - Burgundy (primary) */
	--color-primary: #6B1F2A;
	--color-primary-dark: #4A141C;
	--color-primary-light: #8C3642;

	/* Color - Champagne gold (rare accent only, ~2% of visual weight) */
	--color-accent-gold: #C6A664;
	--color-accent-gold-dark: #B08D46;
	--color-accent-gold-light: #D8C48E;

	/* Color - Neutrals */
	--color-neutral-900: #2B2B2B; /* primary text */
	--color-neutral-600: #4A4A4A; /* secondary text */
	--color-neutral-400: #6E6E6E; /* muted text */
	--color-surface-page: #FAF8F5; /* default page background - never stark white */
	--color-surface-alt: #F2EEE7; /* alternating section tint */
	--color-border: #E7E1D6;
	--color-border-strong: #D8D0C0;

	/* Color - Semantic (status only, never brand emphasis) */
	--color-success-bg: #DCEBDF;
	--color-success-text: #255C38;
	--color-warning-bg: #F4E4BE;
	--color-warning-text: #7A5410;
	--color-danger-bg: #F4D6D6;
	--color-danger-text: #7A2B2B;
	--color-neutral-bg: #E6E3DA;
	--color-neutral-text: #5A5850;

	/* Typography */
	--font-family-base: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif;
	--font-family-arabic: "Segoe UI", Tahoma, Arial, sans-serif; /* replace with a licensed Arabic web font during build - see README */
	--font-weight-regular: 400;
	--font-weight-medium: 500;
	--line-height-body: 1.65;
	--line-height-arabic: 1.8;

	/* Spacing (8px base unit) */
	--space-1: 8px;
	--space-2: 16px;
	--space-3: 24px;
	--space-4: 32px;
	--space-6: 48px;
	--space-8: 64px;
	--space-12: 96px;

	/* Radius */
	--radius-control: 5px;
	--radius-card: 10px;

	/* Motion */
	--motion-duration: 180ms;
	--motion-ease: ease-out;

	/* Layout */
	--container-max-width: 1280px;
}

/* Respect prefers-reduced-motion globally - no essential information is ever
   conveyed by animation alone, so disabling motion is always safe. */
@media (prefers-reduced-motion: reduce) {
	:root {
		--motion-duration: 0ms;
	}
	*, *::before, *::after {
		animation-duration: 0.001ms !important;
		transition-duration: 0.001ms !important;
	}
}