/* ============================================ ТЁМНАЯ ТЕМА — Кухни на Панина Premium Dark Mode: Linear / Vercel уровень Активируется классом .dark на ============================================ */ /* ========== ПЕРЕМЕННЫЕ ========== */ .dark { --bg-body: #0B0F17; --bg-surface: #111827; --bg-surface-hover: #1a1f2e; --bg-sidebar: rgba(15, 23, 42, 0.75); --bg-elevated: #111827; --bg-floating: rgba(17, 24, 39, 0.9); --text-primary: #E5E7EB; --text-secondary: #9CA3AF; --text-muted: #6B7280; --border-color: #1F2937; --border-light: #1a1f2e; --shadow-sm: 0 1px 2px rgba(0,0,0,0.3); --shadow-md: 0 2px 8px rgba(0,0,0,0.3), 0 8px 20px rgba(0,0,0,0.4); --shadow-lg: 0 10px 25px rgba(0,0,0,0.5); --shadow-card: 0 0 0 1px rgba(255,255,255,0.02), 0 1px 3px rgba(0,0,0,0.2), 0 4px 12px rgba(0,0,0,0.3); } /* ========== БАЗОВЫЕ ========== */ .dark body { background: linear-gradient(180deg, #0B0F17 0%, #0f1724 100%); color: #E5E7EB; } /* ========== САЙДБАР ========== */ .dark .app-sidebar { background: rgba(15, 23, 42, 0.75); backdrop-filter: blur(12px); border-right-color: #1F2937; box-shadow: 0 0 0 1px #1F2937, 0 10px 30px rgba(0,0,0,0.3); } .dark .nav-link { color: #9CA3AF; } .dark .nav-link:hover { background: #1a1f2e; color: #E5E7EB; } .dark .nav-link.active { background: rgba(59, 130, 246, 0.12); color: #60a5fa; } .dark .nav-link.active::before { background: #60a5fa; } /* ========== ТОПБАР ========== */ .dark .app-topbar { background: rgba(17, 24, 39, 0.8); backdrop-filter: blur(8px); border-bottom-color: #1F2937; box-shadow: 0 1px 3px rgba(0,0,0,0.2); } /* ========== КАРТОЧКИ ========== */ .dark .card, .dark .kpi-card, .dark .table-container { background: #111827; border-color: #1F2937; } .dark .card-hover:hover, .dark .kpi-card:hover { box-shadow: 0 10px 25px rgba(0,0,0,0.5); } .dark .kpi-value { color: #E5E7EB; } /* ========== ТАБЛИЦЫ ========== */ .dark .data-table thead { background: #1a1f2e; border-bottom-color: #1F2937; } .dark .data-table th { color: #9CA3AF; } .dark .data-table td { border-bottom-color: #1a1f2e; color: #E5E7EB; } .dark .data-table tbody tr:hover { background: #1a1f2e; } .dark .data-table .amount { color: #E5E7EB; } /* ========== КНОПКИ ========== */ .dark .btn-secondary { background: #1F2937; color: #E5E7EB; border-color: #374151; } .dark .btn-secondary:hover { background: #374151; } .dark .btn-icon { color: #9CA3AF; } .dark .btn-icon:hover { background: #1a1f2e; color: #E5E7EB; } /* ========== ФОРМЫ ========== */ .dark .form-input, .dark .form-select { background: #1F2937; border-color: #374151; color: #E5E7EB; } .dark .form-input:focus, .dark .form-select:focus { border-color: #3B82F6; box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15); } .dark .form-input::placeholder { color: #6B7280; } /* ========== ФИЛЬТРЫ ========== */ .dark .filter-bar { background: #111827; border-color: #1F2937; } .dark .filter-bar select { background: #1F2937; border-color: #374151; color: #E5E7EB; } /* ========== БЕЙДЖИ ========== */ .dark .badge-green { background: #052e16; color: #22c55e; } .dark .badge-red { background: #450a0a; color: #ef4444; } .dark .badge-orange { background: #451a03; color: #f59e0b; } .dark .badge-blue { background: #1e3a5f; color: #3b82f6; } .dark .badge-gray { background: #1F2937; color: #9CA3AF; } /* ========== АЛЕРТЫ ========== */ .dark .alert-success { background: #052e16; color: #22c55e; border-color: #166534; } .dark .alert-danger { background: #450a0a; color: #ef4444; border-color: #991b1b; } .dark .alert-warning { background: #451a03; color: #f59e0b; border-color: #92400e; } .dark .alert-info { background: #1e3a5f; color: #3b82f6; border-color: #1e40af; } /* ========== ПРОГРЕСС-БАР ========== */ .dark .progress-bar { background: #1F2937; } /* ========== МОДАЛКА ========== */ .dark .modal-overlay { background: rgba(0, 0, 0, 0.7); } .dark .modal-content { background: #111827; border: 1px solid #1F2937; } /* ========== ПУСТОЕ СОСТОЯНИЕ ========== */ .dark .empty-state { color: #6B7280; } /* ========== LOGOUT ========== */ .dark .sidebar-logout:hover { background: rgba(239, 68, 68, 0.1); color: #fca5a5; } /* ========== ССЫЛКИ ========== */ .dark a { color: #60a5fa; } .dark a:hover { color: #93bbfd; } /* ========== ПРОЧЕЕ ========== */ .dark .divider { border-color: #1F2937; } .dark .text-positive { color: #22c55e; } .dark .text-negative { color: #ef4444; }