/**
 * Design Tokens - Guarti Cuenta
 * Единый источник истины для всех CSS-переменных
 * 
 * Последнее обновление: 2026-01-26
 * Версия: 1.1
 * 
 * Использование: Подключать ПЕРВЫМ во всех файлах через <link> в HTML
 * (или через @import в начале CSS файлов)
 */

:root {
    /* ========================================
       Цвета (Colors)
       ======================================== */
    
    /* Основные цвета */
    --color-primary-dark: #0A284B;
    --color-primary: #0D3C74;
    --color-primary-light: #0E3A6B;
    
    /* Акцентный цвет (ссылки, фокус, кнопки) */
    --color-accent: #1F7CEC;
    
    /* Состояния акцента */
    --color-accent-hover: #1A6BD9;      /* Цвет при наведении */
    --color-accent-active: #1556C7;     /* Цвет при нажатии */
    
    /* Статусный синий (используется в dashboard для ссылок) */
    --color-status-blue: #0066cc;
    
    /* Текст */
    --color-text: #0A284B;
    --color-text-secondary: #64748B;
    --color-text-muted: #94a3b8;
    
    /* Рамки */
    --color-border: #e2e8f0;
    --color-border-strong: #d1d5db;
    
    /* Фон */
    --color-background: #ffffff;
    --color-background-subtle: #f8fafc;
    --color-background-light: #f1f5f9;
    
    /* Белый цвет для текста на цветном фоне */
    --color-white: #ffffff;
    
    /* Акцентные фоны (полупрозрачные) */
    --color-accent-bg-light: rgba(31, 124, 236, 0.1);
    --color-accent-bg-medium: rgba(31, 124, 236, 0.15);
    --color-accent-bg-border: rgba(31, 124, 236, 0.18);  /* Для границ с акцентным цветом */
    --color-accent-bg-strong: rgba(31, 124, 236, 0.22);  /* Для более сильных акцентов */
    --color-accent-bg-stronger: rgba(31, 124, 236, 0.35); /* Для очень сильных акцентов */
    
    /* Тени акцента */
    --color-accent-shadow: rgba(31, 124, 236, 0.25);      /* Тень для кнопок и элементов с акцентом */
    --color-accent-shadow-hover: rgba(31, 124, 236, 0.3); /* Тень при наведении */
    
    /* Состояния */
    --color-error: #dc2626;
    --color-error-bg-light: rgba(220, 38, 38, 0.1);   /* Легкий фон для ошибок */
    --color-error-bg-medium: rgba(220, 38, 38, 0.14);  /* Средний фон для ошибок */
    
    --color-success: #059669;
    --color-success-bright: #22c55e;  /* Яркий зеленый для индикаторов успеха */
    --color-success-bg-light: rgba(34, 197, 94, 0.14); /* Легкий фон для успеха */
    
    --color-warning: #b45309;                          /* Цвет предупреждения */
    --color-warning-bg-light: rgba(180, 83, 9, 0.1);   /* Легкий фон для предупреждений */
    
    /* Backdrop (для модальных окон) */
    --color-backdrop: rgba(10, 40, 75, 0.35);         /* Темный фон для модальных окон и overlay */
    
    /* Тени */
    --color-shadow: rgba(0, 0, 0, 0.08);        /* Легкая тень для карточек и элементов */
    --color-shadow-strong: rgba(0, 0, 0, 0.15); /* Сильная тень для модальных окон и выпадающих меню */
    
    /* ========================================
       Отступы (Spacing Scale)
       ======================================== */
    
    --spacing-xs: 4px;
    --spacing-sm: 8px;
    --spacing-md: 16px;
    --spacing-lg: 24px;
    --spacing-xl: 32px;
    --spacing-xxl: 48px;
    --spacing-xxxl: 64px;
    
    /* ========================================
       Скругления (Border Radius)
       ======================================== */
    
    --radius-input: 50px;      /* Поля ввода (pill shape) */
    --radius-button: 8px;       /* Кнопки */
    --radius-card: 12px;        /* Карточки */
    
    /* ========================================
       Типографика (Typography)
       ======================================== */
    
    --font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, sans-serif;
    
    /* Размеры шрифтов */
    --font-size-h1-desktop: 36px;
    --font-size-h1-mobile: 32px;
    --font-size-h2: 24px;
    --font-size-body: 16px;
    --font-size-link: 15px;
    
    /* Веса шрифтов */
    --font-weight-bold: 700;
    --font-weight-semibold: 600;
    --font-weight-medium: 500;
    --font-weight-normal: 400;
    
    /* Высота строк */
    --line-height-body: 1.5;
    --line-height-heading: 1.2;
    
    /* ========================================
       Переходы (Transitions)
       ======================================== */
    
    --transition-base: all 0.2s ease;
}
