/* ============================================
   MAIN.CSS - Central Authority
   ============================================ */

/* Fonts first (must load before anything else) */
@import url('fonts.css');

/* Import all section stylesheets */
@import url('header.css');
@import url('hero.css');
@import url('about.css');
@import url('services.css');
@import url('sectors.css');
@import url('clients.css');
@import url('testimonials.css');
@import url('VendorsPartners.css');
@import url('contact-icon.css');
@import url('contactus.css');
@import url('online-main.css');
@import url('portal.css');
@import url('solutions.css');

/* ============================================
   GLOBAL VARIABLES
   ============================================ */
:root {
    --primary-red: #BF2626;
    --primary-blue: #1a8dea;
    --transition: 0.3s ease;
    
    /* Light Mode */
    --bg-main: #ffffff;
    --bg-alt: #f8f9fa;
    --card-bg: #ffffff;
    --text-main: #232323;
    --text-muted: #6c757d;
    --border-color: rgba(0,0,0,0.08);
    --shadow-sm: 0 2px 4px rgba(0,0,0,0.05);
    --shadow-md: 0 4px 6px rgba(0,0,0,0.1);
}

@media (prefers-color-scheme: dark) {
    :root {
        --bg-main: #121212;
        --bg-alt: #1a1a1a;
        --card-bg: #1e1e1e;
        --text-main: #f8f9fa;
        --text-muted: #a0a0a0;
        --border-color: rgba(255,255,255,0.12);
    }
}

/* ============================================
   GLOBAL UTILITIES
   ============================================ */
html {
    scroll-behavior: smooth;
    font-size: 16px;
}

body {
    font-family: 'Cairo', 'Rubik', -apple-system, BlinkMacSystemFont, sans-serif;
    background-color: var(--bg-main);
    color: var(--text-main);
    line-height: 1.6;
    overflow-x: hidden;
}

[dir="rtl"] { 
    text-align: right; 
    font-family: 'Cairo', sans-serif; 
}

[dir="ltr"] { 
    text-align: left; 
    font-family: 'Rubik', sans-serif; 
}

.text-primary-red { color: var(--primary-red) !important; }
.bg-primary-red { background-color: var(--primary-red) !important; }

/* Smooth image loading */
img { 
    max-width: 100%; 
    height: auto; 
    display: block; 
}

/* Focus visible for accessibility */
:focus-visible { 
    outline: 3px solid var(--primary-red); 
    outline-offset: 2px; 
}

::selection { 
    background-color: var(--primary-red); 
    color: white; 
}

/* ============================================
   RESPONSIVE
   ============================================ */
@media (max-width: 768px) {
    html { font-size: 14px; }
}