/* KPI_Cards.html */

/* ==========================================================================
       1. ОБЩИЕ СИСТЕМНЫЕ СТИЛИ (Шрифты, сетка, анимации)
       ========================================================================== */
       .dynamic-font { font-size: 1.875rem !important; line-height: 1; white-space: nowrap; display: inline-block; max-width: 100%; overflow: hidden; padding-top: 1.5rem; }
       .kpi-card > i.kpi-icon { opacity: 0.15; transition: all 0.4s ease-in-out; z-index: 1; }
       .kpi-card:hover > i.kpi-icon { opacity: 0.4; transform: scale(1.2) rotate(-10deg); }
       
       /* Стили анимации логотипа ДТЭК */
       .dtek-logo-container { transition: all 0.4s ease-in-out; }
       .dtek-logo-svg { width: 100%; height: 100%; display: block; }
   
       /* ==========================================================================
          2. СВЕТЛАЯ ТЕМА — ЦЕНТРАЛЬНОЕ УПРАВЛЕНИЕ ВСЕМИ ЦВЕТАМИ
          ========================================================================== */
   
       /* --- Крупные главные значения (Светлая тема) --- */
       #val-total-gen  { color: #2563eb !important; } /* Электроэнергия: Балансовый синий */
       #val-profit     { color: #059669 !important; } /* Прибыль: Доходный зелёный */
       #val-avg-margin { color: #d97706 !important; } /* Средние: Янтарный */
       #val-gas-usage  { color: #60a5fa !important; } /* Газ: Расходный красный #dc2626*/
       #val-dtek-saldo { color: #bca100 !important; } /* ДТЭК: Глубокий золотой */
   
       /* --- Карточка 1: Электроэнергия (Мелкие цифры, Светлая тема) --- */
       #sub-gen  { color: #dc2626 !important; } /* Генерация (Красный) */
       #sub-up   { color: #d97706 !important; } /* Загрузка (Янтарный) */
       #sub-down { color: #059669 !important; } /* Разгрузка (Зеленый) */
   
       /* --- Карточка 2: Прибыль (Мелкие цифры, Светлая тема) --- */
       #sub-fin-gen  { color: #dc2626 !important; } /* Финансовая генерация */
       #sub-fin-up   { color: #d97706 !important; } /* Финансовая загрузка */
       #sub-fin-down { color: #059669 !important; } /* Финансовая разгрузка */
   
       /* --- Карточка 3: Средние (Мелкие цифры, Светлая тема) --- */
       #val-sell-price { color: #d97706 !important; } /* Цена продажи (Зеленый) */
       #val-avg-cost   { color: #059669 !important; } /* Себестоимость (Стальной) */
   
       /* --- Карточка 4: Газ (Мелкие цифры, Светлая тема) --- */
       #val-gas-remain { color: #d97706 !important; } /* Остаток (Синий) */
       #val-gas-norm   { color: #059669 !important; } /* Норма (Серый) */
   
       /* --- Карточка 5: ДТЭК (Мелкие цифры, Светлая тема) --- */
       #val-dtek-reserve     { color: #dc2626 !important; } /* Резерв (Красный) */
       #val-dtek-limit-value { color: #d97706 !important; } /* Лимит (Янтарный) */
       #val-dtek-payment     { color: #059669 !important; } /* Платёж (Зеленый) */
   
       /* --- Стили логотипа ДТЭК на свету --- */
       .dtek-icon-square { fill: #ffe500 !important; } 
       .dtek-text-letters { fill: #000000 !important; transition: fill 0.3s ease; } 
       .dtek-logo-container { opacity: 0.35; }
       .kpi-card:hover .dtek-logo-container { opacity: 0.85; transform: scale(1.2) rotate(-10deg); }
   
   
       /* ==========================================================================
          3. ТЁМНАЯ ТЕМА — ЦЕНТРАЛЬНОЕ УПРАВЛЕНИЕ ВСЕМИ ЦВЕТАМИ (.dark)
          ========================================================================== */
   
       /* --- Крупные главные значения (Тёмная тема) --- */
       .dark #val-total-gen, [data-theme="dark"] #val-total-gen, .dark-theme #val-total-gen   { color: #3b82f6 !important; } /* Неоново-синий */
       .dark #val-profit,    [data-theme="dark"] #val-profit,    .dark-theme #val-profit      { color: #10b981 !important; } /* Изумрудный */
       .dark #val-avg-margin,[data-theme="dark"] #val-avg-margin, .dark-theme #val-avg-margin  { color: #f59e0b !important; } /* Янтарный */
       .dark #val-gas-usage, [data-theme="dark"] #val-gas-usage, .dark-theme #val-gas-usage   { color: #60a5fa !important; } /* Красный #ef4444*/
       .dark #val-dtek-saldo,[data-theme="dark"] #val-dtek-saldo, .dark-theme #val-dtek-saldo  { color: #fff500 !important; } /* Яркий желтый */
   
       /* --- Карточка 1: Электроэнергия (Мелкие цифры, Тёмная тема) --- */
       .dark #sub-gen,  [data-theme="dark"] #sub-gen,  .dark-theme #sub-gen  { color: #f87171 !important; } 
       .dark #sub-up,   [data-theme="dark"] #sub-up,   .dark-theme #sub-up   { color: #fbbf24 !important; } 
       .dark #sub-down, [data-theme="dark"] #sub-down, .dark-theme #sub-down { color: #34d399 !important; }
   
       /* --- Карточка 2: Прибыль (Мелкие цифры, Тёмная тема) --- */
       .dark #sub-fin-gen,  [data-theme="dark"] #sub-fin-gen,  .dark-theme #sub-fin-gen  { color: #f87171 !important; } 
       .dark #sub-fin-up,   [data-theme="dark"] #sub-fin-up,   .dark-theme #sub-fin-up   { color: #fbbf24 !important; } 
       .dark #sub-fin-down, [data-theme="dark"] #sub-fin-down, .dark-theme #sub-fin-down { color: #34d399 !important; } 
   
       /* --- Карточка 3: Средние (Мелкие цифры, Тёмная тема) --- */
       .dark #val-sell-price, [data-theme="dark"] #val-sell-price, .dark-theme #val-sell-price { color: #fbbf24 !important; } /* Изумрудный #34d399*/
       .dark #val-avg-cost,   [data-theme="dark"] #val-avg-cost,   .dark-theme #val-avg-cost   { color: #34d399 !important; } /* Стальной #94a3b8*/
   
       /* --- Карточка 4: Gas (Мелкие цифры, Тёмная тема) --- */
       .dark #val-gas-remain, [data-theme="dark"] #val-gas-remain, .dark-theme #val-gas-remain { color: #fbbf24 !important; } /* Синий #60a5fa*/
       .dark #val-gas-norm,   [data-theme="dark"] #val-gas-norm,   .dark-theme #val-gas-norm   { color: #34d399 !important; } /* Серый #94a3b8*/
   
       /* --- Карточка 5: ДТЭК (Мелкие цифры, Тёмная тема) --- */
       .dark #val-dtek-reserve,     [data-theme="dark"] #val-dtek-reserve,     .dark-theme #val-dtek-reserve     { color: #f87171 !important; } 
       .dark #val-dtek-limit-value, [data-theme="dark"] #val-dtek-limit-value, .dark-theme #val-dtek-limit-value { color: #fbbf24 !important; } 
       .dark #val-dtek-payment,     [data-theme="dark"] #val-dtek-payment,     .dark-theme #val-dtek-payment     { color: #34d399 !important; }
   
       /* --- Фирменный логотип ДТЭК в темноте со свечением --- */
       .dark .dtek-icon-square, [data-theme="dark"] .dtek-icon-square, .dark-theme .dtek-icon-square { fill: #fff500 !important; }
       .dark .dtek-text-letters, [data-theme="dark"] .dtek-text-letters, .dark-theme .dtek-text-letters { fill: #ffffff !important; }
       .dark .dtek-logo-container, [data-theme="dark"] .dtek-logo-container, .dark-theme .dtek-logo-container { 
           opacity: 1.0 !important; 
           filter: drop-shadow(0 0 12px rgba(255, 245, 0, 0.35)) !important; 
       }
       .dark .kpi-card:hover .dtek-logo-container, [data-theme="dark"] .kpi-card:hover .dtek-logo-container, .dark-theme .kpi-card:hover .dtek-logo-container { 
           filter: drop-shadow(0 0 20px rgba(255, 245, 0, 0.6)) !important; 
       }