/* ============================================
   ТЕМЫ: Светлая и Тёмная
   Тематика: Всероссийское общество спасания на водах
   ============================================ */

:root {
    /* === Брендовые цвета ВОСВОД === */
    --vosvod-primary: #0A4D8C;
    --vosvod-primary-dark: #083A6B;
    --vosvod-primary-light: #1E6BB8;
    --vosvod-accent: #00A8CC;
    --vosvod-accent-light: #4DD4E8;
    --vosvod-danger: #D64045;
    --vosvod-warning: #F4A261;
    --vosvod-success: #2A9D8F;
    --vosvod-info: #4361EE;

    /* === Светлая тема === */
    --bg-body: #F5F7FA;
    --bg-body-gradient: linear-gradient(135deg, #F5F7FA 0%, #E8EEF5 100%);
    --bg-sidebar: #FFFFFF;
    --bg-card: #FFFFFF;
    --bg-topbar: rgba(255, 255, 255, 0.72);
    --bg-hover: #F0F4F8;
    --bg-active: linear-gradient(135deg, rgba(10, 77, 140, 0.08), rgba(0, 168, 204, 0.08));
    --bg-glass: rgba(255, 255, 255, 0.6);

    --text-primary: #1A2B42;
    --text-secondary: #6B7A90;
    --text-muted: #94A3B8;

    --border-color: #E5E9F0;
    --border-light: #F0F3F7;

    --shadow-xs: 0 1px 2px rgba(16, 24, 40, 0.04);
    --shadow-sm: 0 2px 4px rgba(16, 24, 40, 0.04), 0 1px 2px rgba(16, 24, 40, 0.06);
    --shadow-md: 0 4px 16px rgba(16, 24, 40, 0.08), 0 2px 4px rgba(16, 24, 40, 0.04);
    --shadow-lg: 0 12px 32px rgba(16, 24, 40, 0.1), 0 4px 8px rgba(16, 24, 40, 0.05);
    --shadow-xl: 0 24px 48px rgba(16, 24, 40, 0.12);
    --shadow-glow: 0 0 40px rgba(0, 168, 204, 0.15);

    --gradient-primary: linear-gradient(135deg, #0A4D8C 0%, #00A8CC 100%);
    --gradient-accent: linear-gradient(135deg, #00A8CC 0%, #4DD4E8 100%);
    --gradient-hero: linear-gradient(135deg, #0A4D8C 0%, #00A8CC 50%, #4DD4E8 100%);
    --gradient-soft: linear-gradient(135deg, rgba(10, 77, 140, 0.05), rgba(0, 168, 204, 0.05));
    --gradient-card: linear-gradient(135deg, #FFFFFF 0%, #F8FAFC 100%);

    /* === Анимации === */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
}

/* === Тёмная тема === */
[data-theme="dark"] {
    --bg-body: #0B1220;
    --bg-body-gradient: linear-gradient(135deg, #0B1220 0%, #111827 100%);
    --bg-sidebar: #111827;
    --bg-card: #1A2332;
    --bg-topbar: rgba(17, 24, 39, 0.72);
    --bg-hover: #1F2937;
    --bg-active: linear-gradient(135deg, rgba(0, 168, 204, 0.15), rgba(10, 77, 140, 0.15));
    --bg-glass: rgba(17, 24, 39, 0.6);

    --text-primary: #F1F5F9;
    --text-secondary: #94A3B8;
    --text-muted: #64748B;

    --border-color: #1F2937;
    --border-light: #273449;

    --shadow-xs: 0 1px 2px rgba(0, 0, 0, 0.3);
    --shadow-sm: 0 2px 4px rgba(0, 0, 0, 0.3);
    --shadow-md: 0 4px 16px rgba(0, 0, 0, 0.4);
    --shadow-lg: 0 12px 32px rgba(0, 0, 0, 0.5);
    --shadow-xl: 0 24px 48px rgba(0, 0, 0, 0.6);
    --shadow-glow: 0 0 60px rgba(0, 168, 204, 0.25);

    --gradient-card: linear-gradient(135deg, #1A2332 0%, #1F2937 100%);
    --gradient-soft: linear-gradient(135deg, rgba(0, 168, 204, 0.08), rgba(10, 77, 140, 0.08));
}