/* ==============================================
   0_VARIABLES.CSS - ÚNICA FUENTE DE VERDAD
   Creado: 2025
   ============================================== */

:root {
    /* ===================================
       COLORES PRINCIPALES
    =================================== */
    --primary: #170585;
    --hov-primary: #2647ff;
    --dark-blue: #03133a;
    
    /* Colores secundarios */
    --secondary: #0dcaf0;
    --hov-secondary: #00a1ff;
    --secondary-base: #6c757d;
    --hov-secondary-base: #5a6268;
    
    /* Colores de estado */
    --success: #4EA72E;
    --info: #722ed1;
    --warning: #FFC519;
    --danger: #EF486A;
    
    /* Colores base */
    --dark: #03133a;
    --light: #d9d9ff;
    --white: #FFFFFF;
    --black: #000000;
    --blue: #007BFF;
    --hov-blue: #0056b3;
    --gray: #A8A8A8;
    --gray-dark: #6c757d;
    
    /* ===================================
       COLORES SOFT (10% opacidad)
    =================================== */
    --soft-primary: rgba(23, 5, 133, 0.1);
    --soft-secondary: rgba(13, 202, 240, 0.1);
    --soft-success: rgba(78, 167, 46, 0.1);
    --soft-danger: rgba(239, 72, 106, 0.1);
    --soft-warning: rgba(255, 197, 25, 0.1);
    --soft-info: rgba(114, 46, 209, 0.1);
    --soft-dark: rgba(3, 19, 58, 0.1);
    --soft-light: rgba(217, 217, 255, 0.1);
    --soft-secondary-base: rgba(108, 117, 125, 0.1);
    --soft-white: rgba(255, 255, 255, 0.1);
    --soft-blue: rgba(0, 123, 255, 0.1);
    
    /* ===================================
       COLORES PORTALDOC PLATFORM
    =================================== */
    --primary-blue: #1e40af;
    --cyan: #0ea5e9;
    --purple: #7c3aed;
    --orange: #ea580c;
    --dark-bg: #0a1628;
    --light-bg: #f8fafc;
    
    /* ===================================
       TIPOGRAFÍA
    =================================== */
    --font-family-sans-serif: 'Poppins', sans-serif;
    --font-base: 'Poppins', sans-serif;
    --font-display: 'Orbitron', sans-serif;
    
    /* Tamaños de fuente */
    --fs-xs: 0.75rem;      /* 12px */
    --fs-sm: 0.875rem;     /* 14px */
    --fs-base: 1rem;       /* 16px */
    --fs-lg: 1.125rem;     /* 18px */
    --fs-xl: 1.25rem;      /* 20px */
    --fs-2xl: 1.5rem;      /* 24px */
    --fs-3xl: 2rem;        /* 32px */
    
    /* ===================================
       ESPACIADO
    =================================== */
    --spacing-xs: 0.25rem;  /* 4px */
    --spacing-sm: 0.5rem;   /* 8px */
    --spacing-md: 1rem;     /* 16px */
    --spacing-lg: 2rem;     /* 32px */
    --spacing-xl: 4rem;     /* 64px */
    
    /* ===================================
       BORDES Y SOMBRAS
    =================================== */
    --border-radius-sm: 0.25rem;
    --border-radius-md: 0.5rem;
    --border-radius-lg: 1rem;
    --border-radius-full: 50rem;
    
    --shadow-sm: 0 1px 2px 0 rgba(0, 0, 0, 0.05);
    --shadow-md: 0 4px 6px -1px rgba(0, 0, 0, 0.1);
    --shadow-lg: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
    --shadow-xl: 0 20px 25px -5px rgba(0, 0, 0, 0.1);
    
    /* ===================================
       BREAKPOINTS
    =================================== */
    --breakpoint-xs: 0;
    --breakpoint-sm: 576px;
    --breakpoint-md: 768px;
    --breakpoint-lg: 992px;
    --breakpoint-xl: 1200px;
    --breakpoint-xxl: 1500px;
    
    /* ===================================
       TRANSICIONES
    =================================== */
    --transition-fast: 0.15s ease;
    --transition-base: 0.3s ease;
    --transition-slow: 0.5s ease;
    
    /* ===================================
       Z-INDEX LAYERS
    =================================== */
    --z-dropdown: 1000;
    --z-sticky: 1020;
    --z-fixed: 1030;
    --z-modal-backdrop: 1040;
    --z-modal: 1050;
    --z-popover: 1060;
    --z-tooltip: 1070;
    
    /* ===================================
   4. HEADER GRADIENTS
    =================================== */
.bg-grad-1 {
    background: linear-gradient(135deg, rgba(74, 138, 230, 0.4) 0%, rgba(74, 138, 230, 0.8) 100%);
}

.bg-grad-2 {
    background-image: linear-gradient(135deg, #0000ff 0%, #170585 74%);
}

.bg-grad-3 {
    background: linear-gradient(to bottom, #abcae9 0%, #ffffff 100%);
}

.bg-grad-4 {
    background: linear-gradient(to bottom, #03133a 0%, #170585 100%);
}

.bg-grad-5 {
    background: linear-gradient(to bottom, #abcae9 0%, #170585 100%);
}