/* ============================================================
   APEXBRIDGEHUB.EU – CSS ПРОМЕНЛИВИ (VARIABLES)
   Версия: 1.0
   Описание: Дефинира всички цветове, шрифтове, размери и 
             анимации, използвани в платформата.
   ============================================================ */

:root {
    /* ============================================
       1. ЦВЕТОВА ПАЛИТРА (COLORS)
       ============================================ */
    
    /* Основни цветове */
    --primary: #0a1628;              /* Тъмно синьо – header, footer, акценти */
    --primary-light: #1a2a4a;        /* По-светло синьо – hover, вторични */
    --primary-dark: #050b14;         /* По-тъмно синьо – дълбоки секции */
    
    /* Злато (акцент) */
    --gold: #d4a843;                 /* Основно злато – CTA, акценти */
    --gold-hover: #c49a35;           /* Злато при hover */
    --gold-light: #e8c76a;           /* Светло злато – графики */
    --gold-transparent: rgba(212, 168, 67, 0.15); /* Прозрачно злато */
    
    /* Неутрални цветове */
    --white: #ffffff;                /* Бяло – основен фон */
    --off-white: #faf9f7;            /* Почти бяло – фон на секции */
    --light-gray: #f4f6f9;           /* Светло сиво – карти, секции */
    --medium-gray: #e5e7eb;          /* Средно сиво – бордюри */
    --border-gray: #d1d5db;          /* Сиво за бордюри на форми */
    
    /* Текст */
    --text-dark: #1a1a2e;            /* Основен текст */
    --text-medium: #4b5563;          /* Среден текст */
    --text-gray: #6b7280;            /* Вторичен текст, описания */
    --text-light: #9ca3af;           /* Светъл текст */
    --text-white: #ffffff;           /* Бял текст (на тъмно) */
    --text-white-muted: rgba(255, 255, 255, 0.75); /* Полупрозрачен бял */
    
    /* Статусни цветове */
    --success: #10b981;              /* Зелено – успех */
    --success-light: #d1fae5;        /* Светло зелено – фон */
    --error: #ef4444;                /* Червено – грешка */
    --error-light: #fee2e2;          /* Светло червено – фон */
    --warning: #f59e0b;              /* Оранжево – внимание */
    --warning-light: #fef3c7;        /* Светло оранжево – фон */
    --info: #3b82f6;                 /* Синьо – информация */
    --info-light: #dbeafe;           /* Светло синьо – фон */
    
    /* ============================================
       2. ШРИФТОВЕ (TYPOGRAPHY)
       ============================================ */
    
    /* Семейства шрифтове */
    --font-heading: 'Playfair Display', Georgia, serif;
    --font-body: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif;
    --font-mono: 'Courier New', Courier, monospace;
    
    /* Размери на шрифтове */
    --font-size-xs: 12px;
    --font-size-sm: 14px;
    --font-size-base: 16px;
    --font-size-md: 18px;
    --font-size-lg: 20px;
    --font-size-xl: 24px;
    --font-size-2xl: 28px;
    --font-size-3xl: 36px;
    --font-size-4xl: 40px;
    --font-size-5xl: 54px;
    
    /* Тегло на шрифтове */
    --font-weight-normal: 400;
    --font-weight-medium: 500;
    --font-weight-semibold: 600;
    --font-weight-bold: 700;
    
    /* Височина на редове */
    --line-height-tight: 1.2;
    --line-height-normal: 1.5;
    --line-height-relaxed: 1.7;
    --line-height-loose: 2.0;
    
    /* Разстояние между букви */
    --letter-spacing-tight: -0.02em;
    --letter-spacing-normal: 0;
    --letter-spacing-wide: 0.02em;
    --letter-spacing-wider: 0.05em;
    
    /* ============================================
       3. РАЗМЕРИ (SPACING)
       ============================================ */
    
    --space-xs: 4px;                 /* Минимални разстояния */
    --space-sm: 8px;                 /* Малки разстояния */
    --space-md: 16px;                /* Стандартни разстояния */
    --space-lg: 24px;                /* Средни разстояния */
    --space-xl: 40px;                /* Големи разстояния */
    --space-2xl: 60px;               /* Много големи разстояния */
    --space-3xl: 80px;               /* Секционни разстояния */
    --space-4xl: 120px;              /* Херо секции */
    
    /* ============================================
       4. ЪГЛИ (BORDER RADIUS)
       ============================================ */
    
    --radius-xs: 4px;                /* Много малки елементи */
    --radius-sm: 8px;                /* Малки бутони, тагове */
    --radius-md: 12px;               /* Форми, полета */
    --radius-lg: 16px;               /* Карти, панели */
    --radius-xl: 24px;               /* Големи контейнери */
    --radius-2xl: 32px;              /* Модални прозорци */
    --radius-full: 50px;             /* Бутони, тагове (pill) */
    --radius-circle: 50%;            /* Кръгли елементи */
    
    /* ============================================
       5. СЕНКИ (SHADOWS)
       ============================================ */
    
    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.04);
    --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.06);
    --shadow-md: 0 4px 12px rgba(0, 0, 0, 0.08);
    --shadow-lg: 0 20px 60px rgba(0, 0, 0, 0.12);
    --shadow-xl: 0 25px 80px rgba(0, 0, 0, 0.15);
    --shadow-gold: 0 8px 24px rgba(212, 168, 67, 0.3);
    --shadow-inner: inset 0 2px 4px rgba(0, 0, 0, 0.06);
    
    /* ============================================
       6. ГРАНИЦИ (BORDERS)
       ============================================ */
    
    --border-width-thin: 1px;
    --border-width-base: 2px;
    --border-width-thick: 3px;
    
    --border-light: 1px solid var(--medium-gray);
    --border-gold: 1px solid var(--gold);
    --border-primary: 1px solid var(--primary);
    
    /* ============================================
       7. АНИМАЦИИ (TRANSITIONS)
       ============================================ */
    
    --transition-fast: 0.15s ease;
    --transition-base: 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    --transition-slow: 0.5s ease;
    --transition-bounce: 0.4s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    
    /* ============================================
       8. Z-INDEX (СЛОЕВЕ)
       ============================================ */
    
    --z-dropdown: 100;
    --z-sticky: 200;
    --z-header: 500;
    --z-modal-backdrop: 900;
    --z-modal: 1000;
    --z-popover: 1100;
    --z-tooltip: 1200;
    --z-toast: 1300;
    
    /* ============================================
       9. РАЗМЕРИ НА КОНТЕЙНЕРИ
       ============================================ */
    
    --container-sm: 640px;
    --container-md: 768px;
    --container-lg: 1024px;
    --container-xl: 1240px;
    --container-2xl: 1440px;
    
    /* ============================================
       10. ВИСОЧИНИ (HEIGHTS)
       ============================================ */
    
    --header-height: 80px;
    --header-height-mobile: 64px;
    --input-height: 48px;
    --button-height-sm: 36px;
    --button-height-base: 44px;
    --button-height-lg: 56px;
    
    /* ============================================
       11. GRADIENTS
       ============================================ */
    
    --gradient-hero: linear-gradient(135deg, #faf9f7 0%, #f0eee9 100%);
    --gradient-primary: linear-gradient(135deg, var(--primary) 0%, var(--primary-light) 100%);
    --gradient-gold: linear-gradient(135deg, var(--gold) 0%, var(--gold-hover) 100%);
    --gradient-overlay: linear-gradient(180deg, rgba(10, 22, 40, 0) 0%, rgba(10, 22, 40, 0.8) 100%);
    
    /* ============================================
       12. OPACITY
       ============================================ */
    
    --opacity-disabled: 0.5;
    --opacity-muted: 0.7;
    --opacity-hover: 0.9;
    
    /* ============================================
       13. BREAKPOINTS (за справка – използват се в media queries)
       ============================================ */
    
    /* 
    --breakpoint-xs: 480px;
    --breakpoint-sm: 640px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 1024px;
    --breakpoint-xl: 1280px;
    --breakpoint-2xl: 1440px;
    */
}

/* ============================================================
   КРАЙ НА ФАЙЛА
   ============================================================ */