:root {
    /* Logix Color Palette */
    --clr-primary: #234071;       /* Logix Blue */
    --clr-primary-glow: rgba(35, 64, 113, 0.4);
    
    --clr-secondary: #A6AEB5;     /* Logix Silver */
    --clr-secondary-dark: #8B939C;
    
    --clr-bg-deep: #090F1B;       /* Deep Space Blue Background */
    --clr-surface: #111A2C;       /* Dark Blue Surface */
    --clr-surface-glass: rgba(17, 26, 44, 0.7);
    --clr-surface-border: rgba(35, 64, 113, 0.5);
    
    --clr-text-main: #FFFFFF;     /* White for Headings */
    --clr-text-muted: #B4BBC2;    /* Light Silver for Body */
    
    /* Typography */
    --font-ar: 'Cairo', sans-serif;
    --font-en-head: 'Outfit', sans-serif;
    --font-en-body: 'Inter', sans-serif;
    
    /* Global Font Assignments (Fallback to AR based on dir) */
    --font-heading: var(--font-ar);
    --font-body: var(--font-ar);
    
    /* Spacing System (8pt Grid) */
    --space-1: 0.5rem;   /* 8px */
    --space-2: 1rem;     /* 16px */
    --space-3: 1.5rem;   /* 24px */
    --space-4: 2rem;     /* 32px */
    --space-6: 3rem;     /* 48px */
    --space-8: 4rem;     /* 64px */
    --space-16: 8rem;    /* 128px */
    
    /* Border Radius (Chamfered edge feel) */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    
    /* Transitions */
    --transition-fast: 0.2s cubic-bezier(0.16, 1, 0.3, 1);
    --transition-slow: 0.5s cubic-bezier(0.16, 1, 0.3, 1);
}

/* Override variables for LTR */
[dir="ltr"] {
    --font-heading: var(--font-en-head);
    --font-body: var(--font-en-body);
}
