/* ========================================
   COLOR SYSTEM
   Apple-inspired color palette with glassmorphism support
   ======================================== */

:root {
    /* Primary Colors - Medical Blue & Innovation Cyan */
    --primary-blue: #00509D;        /* Deep Medical Blue - Primary */
    --primary-cyan: #00C2CB;        /* Innovation Cyan - Secondary/Accent */
    --primary-dark: #003d7a;        /* Darker Medical Blue for hover */
    --primary-light: #e6f2f8;      /* Light Medical Blue backgrounds */
    --accent-blue: #00509D;         /* Deep Medical Blue for gradients */
    --accent-cyan: #00C2CB;         /* Innovation Cyan for gradients */
    
    /* Text Colors - Professional Medical Report aesthetic */
    --text-primary: #333333;        /* Dark Slate - Primary text */
    --text-secondary: #666666;      /* Medium gray for secondary text */
    --text-tertiary: #999999;       /* Light gray for tertiary text */
    
    /* Legacy text colors for compatibility */
    --text-dark: var(--text-primary);
    --text-gray: var(--text-secondary);
    
    /* Background Colors */
    --bg-primary: #FFFFFF;
    --bg-secondary: #F5F5F7;
    --bg-tertiary: #E8E8ED;
    
    /* Legacy background colors */
    --bg-light: var(--bg-secondary);
    --bg-white: var(--bg-primary);
    
    /* Border Colors */
    --border-light: rgba(0, 0, 0, 0.06);
    --border-medium: rgba(0, 0, 0, 0.1);
    --border-strong: rgba(0, 0, 0, 0.15);
    
    /* Legacy border */
    --border-color: var(--border-light);
    
    /* Status Colors */
    --success: #30D158;
    --warning: #FF9F0A;
    --error: #FF453A;
    --info: #64D2FF;
    
    /* Glassmorphism Colors */
    --glass-white: rgba(255, 255, 255, 0.72);
    --glass-white-strong: rgba(255, 255, 255, 0.85);
    --glass-dark: rgba(0, 0, 0, 0.45);
    --glass-blue: rgba(0, 80, 157, 0.15);
    --glass-blue-strong: rgba(0, 80, 157, 0.25);
    
    /* Overlay Colors */
    --overlay-light: rgba(255, 255, 255, 0.15);
    --overlay-dark: rgba(0, 0, 0, 0.3);
    --overlay-dark-strong: rgba(0, 0, 0, 0.5);
    
    /* Shadow Colors - Apple's layered approach */
    --shadow-xs: 0 1px 3px rgba(0, 0, 0, 0.04);
    --shadow-sm: 0 2px 8px rgba(0, 0, 0, 0.08);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.12);
    --shadow-lg: 0 8px 32px rgba(0, 0, 0, 0.16);
    --shadow-xl: 0 16px 48px rgba(0, 0, 0, 0.2);
    --shadow-2xl: 0 24px 64px rgba(0, 0, 0, 0.24);
    
    /* Colored Shadows */
    --shadow-blue: 0 8px 32px rgba(0, 80, 157, 0.25);
    --shadow-blue-lg: 0 16px 48px rgba(0, 80, 157, 0.3);
    --shadow-cyan: 0 8px 32px rgba(0, 194, 203, 0.25);
}

/* Dark Mode Support - Disabled to maintain light theme on all devices */
/* The website is designed for light mode only */
/* @media (prefers-color-scheme: dark) {
    :root {
        --text-primary: #F5F5F7;
        --text-secondary: #A1A1A6;
        --text-tertiary: #86868B;
        
        --bg-primary: #000000;
        --bg-secondary: #1C1C1E;
        --bg-tertiary: #2C2C2E;
        
        --border-light: rgba(255, 255, 255, 0.06);
        --border-medium: rgba(255, 255, 255, 0.1);
        --border-strong: rgba(255, 255, 255, 0.15);
        
        --glass-white: rgba(255, 255, 255, 0.12);
        --glass-white-strong: rgba(255, 255, 255, 0.18);
    }
} */

/* Background Gradients - Apple-style subtle gradients */
.gradient-hero {
    background: linear-gradient(180deg, 
        var(--bg-secondary) 0%, 
        var(--bg-primary) 100%
    );
}

.gradient-primary {
    background: linear-gradient(135deg, 
        var(--primary-blue) 0%, 
        var(--primary-cyan) 100%
    );
}

/* Gradient for icons and graphics - Medical Blue to Innovation Cyan */
.gradient-medical {
    background: linear-gradient(135deg, 
        var(--primary-blue) 0%, 
        var(--primary-cyan) 100%
    );
}

.gradient-radial-primary {
    background: radial-gradient(
        circle at 50% 50%, 
        rgba(0, 80, 157, 0.1) 0%, 
        transparent 60%
    );
}

.gradient-radial-white {
    background: radial-gradient(
        circle at 50% 50%, 
        rgba(255, 255, 255, 0.15) 0%, 
        transparent 60%
    );
}

.gradient-mesh {
    background: 
        radial-gradient(at 0% 0%, rgba(0, 80, 157, 0.15) 0px, transparent 50%),
        radial-gradient(at 100% 0%, rgba(0, 194, 203, 0.1) 0px, transparent 50%),
        radial-gradient(at 100% 100%, rgba(0, 80, 157, 0.08) 0px, transparent 50%),
        radial-gradient(at 0% 100%, rgba(0, 194, 203, 0.12) 0px, transparent 50%);
}

/* Glassmorphism Utilities */
.glass {
    background: var(--glass-white);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.3);
}

.glass-strong {
    background: var(--glass-white-strong);
    backdrop-filter: blur(24px) saturate(200%);
    -webkit-backdrop-filter: blur(24px) saturate(200%);
    border: 1px solid rgba(255, 255, 255, 0.4);
}

.glass-dark {
    background: var(--glass-dark);
    backdrop-filter: blur(20px) saturate(180%);
    -webkit-backdrop-filter: blur(20px) saturate(180%);
    border: 1px solid rgba(255, 255, 255, 0.15);
}

.glass-blue {
    background: var(--glass-blue);
    backdrop-filter: blur(16px) saturate(180%);
    -webkit-backdrop-filter: blur(16px) saturate(180%);
    border: 1px solid rgba(0, 80, 157, 0.2);
}

/* Color Classes - Force light backgrounds to override system preferences */
.bg-white { background-color: #FFFFFF !important; }
.bg-light { background-color: #F5F5F7 !important; }
.bg-primary { background-color: var(--primary-blue); }
.bg-primary-dark { background-color: var(--primary-dark); }
.bg-secondary { background-color: #F5F5F7 !important; }
.bg-tertiary { background-color: #E8E8ED !important; }

.text-dark { color: #333333 !important; }
.text-gray { color: #666666 !important; }
.text-tertiary { color: #999999 !important; }
.text-white { color: white !important; }
.text-primary { color: var(--primary-blue); }
.text-cyan { color: var(--primary-cyan); }

.border-light { border-color: var(--border-light); }
.border-medium { border-color: var(--border-medium); }
.border-primary { border-color: var(--primary-blue); }

/* Scrollbar Colors - Glassmorphic style */
::-webkit-scrollbar {
    width: 12px;
}

::-webkit-scrollbar-track {
    background: var(--bg-secondary);
    border-radius: 6px;
}

::-webkit-scrollbar-thumb {
    background: rgba(0, 80, 157, 0.3);
    border-radius: 6px;
    border: 3px solid var(--bg-secondary);
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(0, 80, 157, 0.5);
}

/* Selection Colors */
::selection {
    background: var(--primary-light);
    color: var(--primary-blue);
}

::-moz-selection {
    background: var(--primary-light);
    color: var(--primary-blue);
}
