/* ==========================================================================
   Файл: assets/css/variables.css
   Назначение: Дизайн-система (Graphite & Violet Accent)
   ========================================================================== */

:root {
    /* 1. Цветовая палитра: Dark Mode (Графитовая база) */
    --bg-primary: #0f1115;          /* Глубокий графит (основной фон) */
    --bg-secondary: #181a1f;        /* Темно-серый (карточки, меню, шторки) */
    --bg-hover: #22252b;            /* Акцентный серый для ховеров */
    
    --accent-color: #8b5cf6;        /* Чистый фиолетовый (только экшены) */
    --accent-hover: #a78bfa;
    
    --text-main: #f3f4f6;           /* Почти белый (читаемость 100%) */
    --text-muted: #9ca3af;          /* Серый (второстепенная инфа) */
    
    --border-color: #2e323a;        /* Графитовые границы (не "светятся") */
    
    --overlay-color: rgba(0, 0, 0, 0.75); 
    --skeleton-bg: #1f2937;

    /* 2. Типографика */
    --font-family: 'Open Sans', system-ui, -apple-system, sans-serif;
    --text-xs: 12px;
    --text-sm: 14px;
    --text-base: 16px;
    --text-lg: 18px;
    --text-xl: 20px;

    /* 3. Геометрия и Отступы */
    --space-xs: 4px;
    --space-sm: 8px;
    --space-md: 16px;
    --space-lg: 24px;
    --space-xl: 32px;

    --radius-sm: 8px;
    --radius-md: 12px;
    --radius-lg: 20px;

    /* Высота нижнего меню + сейф-зона iOS */
    --nav-height: calc(64px + env(safe-area-inset-bottom, 0px));

    /* 4. Анимации и Тайминги */
    --time-fast: 0.15s;
    --time-normal: 0.3s;
    --ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1); 
    --ease-in-out: cubic-bezier(0.4, 0, 0.2, 1);
}

/* ==========================================================================
   Light Mode (Оставляем как был, он и так чистый)
   ========================================================================== */
[data-theme="light"] {
    --bg-primary: #f1f5f9;
    --bg-secondary: #ffffff;
    --bg-hover: #e2e8f0;
    
    --accent-color: #2563eb;
    --accent-hover: #1d4ed8;
    
    --text-main: #0f172a;
    --text-muted: #64748b;
    
    --border-color: #cbd5e1;
    
    --overlay-color: rgba(15, 23, 42, 0.4);
    --skeleton-bg: #e2e8f0;
}