/* ===================================
   THEME.CSS - Variables & Branding
   OrganizationALL Design System
   =================================== */

:root {
    /* Brand Colors - OrganizationALL Palette */
    --primary-main: #002742;
    --primary-dark: #032741;
    --secondary-main: #32587A;
    --accent-primary: #89A8C7;
    --accent-secondary: #FFFFFF;
    --accent-hover: #6F93B5;
    
    /* Background Colors */
    --bg-primary: #001829;
    --bg-secondary: #002742;
    --bg-tertiary: #032741;
    --bg-overlay: rgba(0, 39, 66, 0.95);
    
    /* Card & Surface Colors */
    --card-bg: rgba(50, 88, 122, 0.15);
    --card-hover: rgba(50, 88, 122, 0.25);
    --surface-elevated: rgba(137, 168, 199, 0.1);
    
    /* Text Colors */
    --text-primary: #FFFFFF;
    --text-secondary: #89A8C7;
    --text-tertiary: rgba(220, 204, 179, 0.6);
    --text-on-accent: #002742;
    --text-muted: rgba(137, 168, 199, 0.5);
    
    /* Border Colors */
    --border-color: rgba(137, 168, 199, 0.2);
    --border-light: rgba(137, 168, 199, 0.1);
    --border-dark: rgba(137, 168, 199, 0.3);
    --divider: rgba(220, 204, 179, 0.15);
    
    /* Input Colors */
    --input-bg: rgba(50, 88, 122, 0.1);
    --input-focus-bg: rgba(50, 88, 122, 0.2);
    --input-border: rgba(137, 168, 199, 0.3);
    --input-text: #FFFFFF;
    
    /* Shadows */
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.1);
    --shadow-md: 0 4px 8px rgba(0, 0, 0, 0.15);
    --shadow-lg: 0 8px 16px rgba(0, 0, 0, 0.2);
    --shadow-xl: 0 12px 24px rgba(0, 0, 0, 0.25);
    --shadow-accent: 0 4px 15px rgba(137, 168, 199, 0.3);
    
    /* Spacing */
    --space-xs: 0.25rem;
    --space-sm: 0.5rem;
    --space-md: 1rem;
    --space-lg: 1.5rem;
    --space-xl: 2rem;
    --space-2xl: 3rem;
    --space-3xl: 4rem;
    --space-4xl: 6rem;
    
    /* Border Radius */
    --radius-sm: 4px;
    --radius-md: 8px;
    --radius-lg: 12px;
    --radius-xl: 16px;
    --radius-full: 9999px;
    
    /* Typography Scale */
    --font-xs: 0.75rem;
    --font-sm: 0.875rem;
    --font-base: 1rem;
    --font-lg: 1.125rem;
    --font-xl: 1.25rem;
    --font-2xl: 1.5rem;
    --font-3xl: 1.875rem;
    --font-4xl: 2.25rem;
    --font-5xl: 3rem;
    --font-6xl: 4rem;
    
    /* Font Families */
    --font-primary: 'Dongle', sans-serif;
    --font-display: 'Dongle', sans-serif;
    --font-serif: 'Playfair Display', Georgia, serif;
    --font-mono: 'Fira Code', 'Courier New', monospace;
    
    /* Transition Timing */
    --transition-fast: 150ms;
    --transition-base: 300ms;
    --transition-slow: 500ms;
    
    /* Gradients */
    --gradient-primary: linear-gradient(135deg, var(--primary-dark) 0%, var(--primary-main) 50%, var(--secondary-main) 100%);
    --gradient-accent: linear-gradient(135deg, var(--accent-primary) 0%, var(--secondary-main) 100%);
    --gradient-overlay: linear-gradient(to bottom, transparent 0%, rgba(0, 39, 66, 0.7) 100%);
}

/* High Contrast Mode */
@media (prefers-contrast: high) {
    :root {
        --border-color: var(--accent-primary);
        --text-secondary: var(--text-primary);
    }
}

/* Accessibility: Forced Colors Mode */
@media (forced-colors: active) {
    :root {
        --accent-primary: CanvasText;
        --text-primary: CanvasText;
        --bg-primary: Canvas;
        --border-color: CanvasText;
    }
}