@import url('https://fonts.googleapis.com/css2?family=Cairo:wght@300;400;500;600;700;800&display=swap');

:root {
    /* Brand Colors */
    --brand-primary: #0B2363;     /* Deep Blue */
    --brand-secondary: #F49D37;   /* Orange */
    --brand-accent: #2D82B7;      /* Middle Blue */
    --brand-bg-mint: #D6FFF6;     /* Light Mint */
    --brand-bg-soft: #EDFFEC;     /* Pale Green */
    
    /* Typography */
    --brand-font: 'shippingeyes', 'Cairo', sans-serif;
    
    /* Shadows - Premium Elevation */
    --brand-shadow-sm: 0 2px 8px rgba(11, 35, 99, 0.05);
    --brand-shadow-md: 0 10px 30px rgba(11, 35, 99, 0.08);
    --brand-shadow-lg: 0 20px 50px rgba(11, 35, 99, 0.12);
    
    /* Glassmorphism */
    --brand-glass-bg: rgba(255, 255, 255, 0.85);
    --brand-glass-border: rgba(255, 255, 255, 0.2);
    
    /* Functional Overrides for existing theme system */
    --theme-color1: var(--brand-primary);
    --theme-color2: var(--brand-accent);
    --theme-color3: var(--brand-secondary);
    
    /* Gradients */
    --brand-gradient-primary: linear-gradient(51deg, var(--brand-accent) 0%, var(--brand-primary) 100%);
    --brand-gradient-secondary: linear-gradient(51deg, var(--brand-primary) 0%, var(--brand-accent) 100%);
}

/* Helper Utilities */
.bg-brand-primary { background-color: var(--brand-primary) !important; }
.bg-brand-secondary { background-color: var(--brand-secondary) !important; }
.bg-brand-mint { background-color: var(--brand-bg-mint) !important; }
.bg-brand-soft { background-color: var(--brand-bg-soft) !important; }

.text-brand-primary { color: var(--brand-primary) !important; }
.text-brand-secondary { color: var(--brand-secondary) !important; }
.text-brand-accent { color: var(--brand-accent) !important; }

/* Modern UI Effects */
.brand-shadow { box-shadow: var(--brand-shadow-md) !important; transition: all 0.4s cubic-bezier(0.165, 0.84, 0.44, 1) !important; }
.brand-shadow:hover { box-shadow: var(--brand-shadow-lg) !important; transform: translateY(-8px); }

.brand-glass { background: var(--brand-glass-bg) !important; backdrop-filter: blur(12px) !important; -webkit-backdrop-filter: blur(12px) !important; border: 1px solid var(--brand-glass-border) !important; }
.brand-rounded { border-radius: 18px !important; overflow: hidden !important; }

/* Iconography refinement */
.brand-icon-box {
    width: 80px;
    height: 80px;
    line-height: 80px;
    text-align: center;
    background: var(--brand-bg-soft);
    color: var(--brand-primary);
    border-radius: 50%;
    font-size: 32px;
    margin-bottom: 20px;
    display: inline-block;
    transition: all 0.3s ease;
}
.brand-icon-box:hover {
    background: var(--brand-primary);
    color: #fff;
    transform: rotate(360deg);
}

/* Typography Overrides */
h1, h2, h3, h4, h5, h6 { font-family: var(--brand-font) !important; font-weight: 700 !important; }
body { font-family: var(--brand-font) !important; }