/* ============================================================================
   База знань — Deep Navy редизайн (у стилі «Чати»/«Картка компанії»). Тільки колір/поверхні.
   Скоуп: #pageKnowledge, #pageSupportKb (список) · #pageMyTraining (мої програми) ·
          #pageTrainingAnalytics (аналітика) · #pageTrainingReader (стаття-читач).
   ⚠ ПРАВИЛО: navy-фон лише де текст керується КЛАСАМИ (article hero, big-card). Решта — білі
   поверхні з navy-акцентами. Global h1..h4{color:var(--text-primary)} перебиває успадкований
   білий → на кожному navy-фоні заголовки/лінки фарбуємо в #fff ЯВНО.
   ========================================================================== */

#pageKnowledge, #pageSupportKb, #pageMyTraining, #pageTrainingAnalytics { font-family: 'Inter', system-ui, -apple-system, sans-serif; }

/* ── список статей: картки + сайдбар ── */
#pageKnowledge .kb-card, #pageSupportKb .kb-card {
    background: var(--novo-surface, #fff); border: 1px solid var(--novo-border, #E2E8F0);
    border-radius: var(--radius-xl, 16px); padding: 15px 16px; box-shadow: var(--shadow-xs);
    transition: transform .14s ease, box-shadow .14s ease, border-color .14s ease;
}
#pageKnowledge .kb-card:hover, #pageSupportKb .kb-card:hover { transform: translateY(-2px); box-shadow: var(--shadow-md); border-color: #D7E0EC; }
#pageKnowledge .kb-card h3, #pageSupportKb .kb-card h3 { color: var(--novo-text, #0F172A); font-weight: 800; letter-spacing: -.01em; }
#pageKnowledge .kb-card .kb-snippet mark, #pageSupportKb .kb-card .kb-snippet mark { background: #FEF3C7; }
#pageKnowledge .kb-tag, #pageSupportKb .kb-tag { background: var(--novo-surface-soft, #F1F5F9); color: var(--novo-text-secondary, #475569); border-radius: 999px; padding: 2px 9px; font-size: 10.5px; }
#pageKnowledge .kb-sidebar h4, #pageSupportKb .kb-sidebar h4 { color: var(--novo-text-muted); }
#pageKnowledge .kb-sidebar .kb-cat-list a, #pageSupportKb .kb-sidebar .kb-cat-list a { border-radius: var(--radius-md, 10px); transition: background .12s ease; }
#pageKnowledge .kb-sidebar .kb-cat-list a:hover, #pageSupportKb .kb-sidebar .kb-cat-list a:hover { background: var(--novo-surface-soft, #F1F5F9); }
#pageKnowledge .kb-sidebar .kb-cat-list a.active, #pageSupportKb .kb-sidebar .kb-cat-list a.active { background: var(--accent, #2563EB) !important; color: #fff !important; font-weight: 700; }

/* ── Мої програми ── */
#pageMyTraining .section-title { color: var(--novo-text, #0F172A); font-weight: 800; font-size: 15px; letter-spacing: -.01em; text-transform: none; }
#pageMyTraining .kb-stat-card { background: var(--novo-surface, #fff); border: 1px solid var(--novo-border, #E2E8F0); border-radius: var(--radius-lg, 14px); box-shadow: var(--shadow-xs); }
#pageMyTraining .kb-stat-card::before { background: radial-gradient(circle, rgba(37,99,235,.12), transparent 70%); }
#pageMyTraining .kb-stat-card .num { color: var(--accent, #2563EB); }
#pageMyTraining .enrollment-card {
    background: var(--novo-surface, #fff); border: 1px solid var(--novo-border, #E2E8F0);
    border-radius: var(--radius-lg, 14px); box-shadow: var(--shadow-xs);
    transition: box-shadow .14s ease, transform .14s ease; position: relative; overflow: hidden;
}
#pageMyTraining .enrollment-card::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: linear-gradient(180deg, #1E3A5F, #3B82F6); }
#pageMyTraining .enrollment-card:hover { transform: translateY(-1px); box-shadow: var(--shadow-sm); }
#pageMyTraining .enrollment-card.blocked::before { background: #CBD5E1; }
#pageMyTraining .enr-head h4 { color: var(--novo-text, #0F172A); font-weight: 800; }
#pageMyTraining .progress-fill { background: linear-gradient(90deg, #1E3A5F, #3B82F6); box-shadow: none; }
#pageMyTraining .progress-fill.done { background: linear-gradient(90deg, #16A34A, #22C55E); }
/* картка «моє місце»/бейджі — залишаємо БІЛОЮ (у ній JS-inline темний текст) + navy-акцент зліва */
#pageMyTraining .card { border-radius: var(--radius-lg, 14px) !important; box-shadow: var(--shadow-xs); border-color: var(--novo-border, #E2E8F0) !important; }

/* ── Аналітика ── */
#pageTrainingAnalytics .analytics-stat-card { background: var(--novo-surface, #fff); border: 1px solid var(--novo-border, #E2E8F0); border-radius: var(--radius-lg, 14px); box-shadow: var(--shadow-xs); }
#pageTrainingAnalytics .analytics-stat-num { color: var(--accent, #2563EB); letter-spacing: -.02em; }
/* велика картка — navy-градієнт із БІЛИМ текстом (діти класові — безпечно) */
#pageTrainingAnalytics .analytics-stat-card-big { background: linear-gradient(135deg, #16233B 0%, #1E3A5F 60%, #24486F 100%) !important; color: #fff !important; border: none !important; box-shadow: var(--shadow-lg); }
#pageTrainingAnalytics .analytics-stat-card-big .analytics-stat-num { color: #fff !important; }
#pageTrainingAnalytics .analytics-stat-card-big .analytics-stat-label { color: rgba(255,255,255,.85) !important; }
#pageTrainingAnalytics .analytics-mini-bar-fill { background: var(--accent, #2563EB); }

/* ── Стаття-читач: navy-hero + navy-акценти (замість жовтих) ── */
#pageTrainingReader .ts-hero {
    background: linear-gradient(135deg, #16233B 0%, #1E3A5F 60%, #24486F 100%);
    border-bottom: none !important; border-radius: 16px; padding: 22px 24px !important; margin-bottom: 20px !important;
    box-shadow: 0 16px 40px rgba(15,23,42,.16);
}
/* ВСЕ в hero — біле (інакше global h1{color:var(--text-primary)} → чорний на navy) */
#pageTrainingReader .ts-hero .ts-h1, #pageTrainingReader .ts-hero h1 { color: #fff !important; }
#pageTrainingReader .ts-hero .ts-hero-subtitle { color: rgba(255,255,255,.86) !important; }
#pageTrainingReader .ts-hero .ts-breadcrumbs, #pageTrainingReader .ts-hero .ts-breadcrumbs a { color: rgba(255,255,255,.72) !important; }
#pageTrainingReader .ts-hero .ts-breadcrumbs a:hover { color: #fff !important; }
#pageTrainingReader .ts-hero .ts-bc-sep { color: rgba(255,255,255,.5) !important; }
#pageTrainingReader .ts-hero .ts-hero-meta, #pageTrainingReader .ts-hero .ts-hero-meta > span { color: rgba(255,255,255,.8) !important; }
/* акцент жовтий → navy-blue: підкреслення H2, TL;DR, KPI-плитки, рейтинг */
#pageTrainingReader .ts-h2 { border-bottom-color: #3B82F6 !important; }
#pageTrainingReader .ts-tldr { background: #EFF6FF !important; color: var(--novo-text, #0F172A) !important; border: 1px solid #BFDBFE; border-left: 4px solid #2563EB; border-radius: 12px; }
#pageTrainingReader .ts-tldr-header { color: #1D4ED8 !important; }
#pageTrainingReader .ts-kpi--accent { background: linear-gradient(135deg, #1E3A5F, #3B82F6) !important; border-color: transparent !important; color: #fff !important; }
#pageTrainingReader .ts-kpi--accent .ts-kpi-value, #pageTrainingReader .ts-kpi--accent .ts-kpi-label { color: #fff !important; }
#pageTrainingReader .ts-quick-facts-title { color: #1D4ED8; }
#pageTrainingReader .ts-rating-btn--up:hover { border-color: #2563EB; color: #2563EB; }
/* таблиці-рішення / зебра — navy-акцент шапки */
#pageTrainingReader .ts-table th { border-bottom-color: #1E3A5F; }