/* ==========================================================================
   forum-tokens.css — единый источник дизайн-токенов движка Black Bonus.
   Подключается ПЕРВЫМ (до forum-shell.css и page-*.css).
   Здесь: цветовые палитры (light/dark), spacing, radius, shadow, motion,
   z-index, типографика. Page-CSS больше НЕ должны переопределять эти блоки.
   ========================================================================== */

/* ---------- Базовые токены (theme-agnostic) ---------- */
:root {
    /* Бренд-акцент и семантика */
    --accent-color: #ff6b00;
    --accent-hover: #ff8533;
    --accent-soft: rgba(255, 107, 0, 0.12);
    --accent-contrast: #ffffff;

    --success-color: #28a745;
    --success-soft: rgba(40, 167, 69, 0.14);
    --warning-color: #f39c12;
    --warning-soft: rgba(243, 156, 18, 0.16);
    --danger-color: #e74c3c;
    --danger-soft: rgba(231, 76, 60, 0.14);
    --info-color: #3498db;
    --info-soft: rgba(52, 152, 219, 0.14);
    --support-color: #17a2b8;
    --online-color: #28a745;

    /* Spacing scale (4px base) */
    --space-1: 4px;
    --space-2: 8px;
    --space-3: 12px;
    --space-4: 16px;
    --space-5: 20px;
    --space-6: 24px;
    --space-7: 32px;
    --space-8: 40px;
    --space-9: 56px;
    --space-10: 72px;

    /* Radius */
    --radius-xs: 6px;
    --radius-sm: 10px;
    --radius-md: 14px;
    --radius-lg: 20px;
    --radius-xl: 28px;
    --radius-pill: 999px;

    /* Motion */
    --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
    --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
    --ease-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
    --dur-fast: 0.14s;
    --dur-base: 0.22s;
    --dur-slow: 0.34s;
    --dur-page: 0.42s;

    /* Z-index scale */
    --z-base: 1;
    --z-sticky: 100;
    --z-dropdown: 1000;
    --z-modal: 5000;
    --z-toast: 9000;
    --z-loading: 20000;

    /* Типографика */
    --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, 'Helvetica Neue', Arial, sans-serif;
    --font-mono: 'SFMono-Regular', Consolas, 'Liberation Mono', Menlo, monospace;
    --fs-xs: 12px;
    --fs-sm: 13px;
    --fs-base: 15px;
    --fs-md: 16px;
    --fs-lg: 18px;
    --fs-xl: 22px;
    --fs-2xl: 28px;
    --fs-3xl: 36px;
    --lh-tight: 1.25;
    --lh-base: 1.55;
    --lh-loose: 1.7;

    /* Layout */
    --shell-max-width: 1280px;
    --shell-gutter: clamp(12px, 3vw, 32px);
    --header-height: 64px;

    /* Псевдонимы для обратной совместимости со старым кодом */
    --admin-panel-bg: var(--bg-tertiary);
    --admin-panel-border: var(--border-color);
}

/* ---------- Тёмная тема (по умолчанию) ---------- */
.dark-theme,
:root {
    --bg-primary: #16181d;
    --bg-secondary: #23262d;
    --bg-tertiary: #2c303a;
    --bg-elevated: #323744;
    --bg-overlay: rgba(10, 12, 16, 0.72);

    --text-primary: #f4f6fb;
    --text-secondary: #b6bcc8;
    --text-muted: #828b9a;
    --text-inverse: #16181d;

    --border-color: #3a3f4d;
    --border-soft: rgba(255, 255, 255, 0.08);
    --hover-color: #2f3441;
    --hover-soft: rgba(255, 255, 255, 0.05);

    --shadow-color: rgba(0, 0, 0, 0.45);
    --shadow-sm: 0 1px 2px rgba(0, 0, 0, 0.28);
    --shadow-md: 0 4px 14px rgba(0, 0, 0, 0.36);
    --shadow-lg: 0 12px 36px rgba(0, 0, 0, 0.48);
    --shadow-glow: 0 0 22px rgba(255, 107, 0, 0.35);

    --chat-bg: #1c1f25;
    --chat-bubble-me: linear-gradient(135deg, #ff6b00, #ff8533);
    --chat-bubble-other: #2c303a;
    --chat-message-received: #363636;
    --chat-message-sent: #2d6296;
    --notification-hover: #3d3d3d;
    --tooltip-bg: #2c303a;
    --tooltip-border: #404040;
    --tooltip-header: linear-gradient(135deg, #ff6b00, #b34d00);
    --skeleton-base: #2c303a;
    --skeleton-shine: #3a3f4d;

    /* Семантические / доменные цвета */
    --private-badge: #332e1f;
    --private-color: #ffc107;
    --hidden-badge: #3d3d3d;
    --hidden-color: #adb5bd;
    --support-hover: #138496;
    --bg-message-user: #1e3a5f;
    --bg-message-staff: #363636;
    --bg-message-system: #4a3e2a;
    --music-color: #1db954;
    --music-hover: #1ed760;
    --test-color: #6f42c1;
    --test-hover: #8551d9;

    color-scheme: dark;
}

/* ---------- Светлая тема ---------- */
.light-theme {
    --bg-primary: #f4f6fa;
    --bg-secondary: #ffffff;
    --bg-tertiary: #f0f2f7;
    --bg-elevated: #ffffff;
    --bg-overlay: rgba(20, 24, 32, 0.55);

    --text-primary: #1a1f2b;
    --text-secondary: #5a6473;
    --text-muted: #8b94a3;
    --text-inverse: #ffffff;

    --border-color: #e2e6ee;
    --border-soft: rgba(0, 0, 0, 0.06);
    --hover-color: #f5f7fb;
    --hover-soft: rgba(0, 0, 0, 0.03);

    --shadow-color: rgba(20, 30, 60, 0.10);
    --shadow-sm: 0 1px 2px rgba(20, 30, 60, 0.08);
    --shadow-md: 0 4px 16px rgba(20, 30, 60, 0.12);
    --shadow-lg: 0 14px 40px rgba(20, 30, 60, 0.18);
    --shadow-glow: 0 0 22px rgba(255, 107, 0, 0.28);

    --chat-bg: #eef1f6;
    --chat-bubble-me: linear-gradient(135deg, #ff6b00, #ff8533);
    --chat-bubble-other: #ffffff;
    --chat-message-received: #f0f2f5;
    --chat-message-sent: #d9edff;
    --notification-hover: #f5f5f5;
    --tooltip-bg: #1a1f2b;
    --tooltip-border: #e0e0e0;
    --tooltip-header: linear-gradient(135deg, #ff6b00, #ff8533);
    --skeleton-base: #e8ecf3;
    --skeleton-shine: #f4f6fa;

    --private-badge: #fff3cd;
    --private-color: #856404;
    --hidden-badge: #e2e3e5;
    --hidden-color: #383d41;
    --support-hover: #138496;
    --bg-message-user: #e3f2fd;
    --bg-message-staff: #f0f2f5;
    --bg-message-system: #fff3cd;
    --music-color: #1db954;
    --music-hover: #1ed760;
    --test-color: #6f42c1;
    --test-hover: #8551d9;

    color-scheme: light;
}

/* ---------- Системное предпочтение, если тема ещё не выбрана ---------- */
@media (prefers-color-scheme: light) {
    :root:not(.dark-theme):not(.light-theme) {
        --bg-primary: #f4f6fa;
        --bg-secondary: #ffffff;
        --bg-tertiary: #f0f2f7;
        --bg-elevated: #ffffff;
        --bg-overlay: rgba(20, 24, 32, 0.55);
        --text-primary: #1a1f2b;
        --text-secondary: #5a6473;
        --text-muted: #8b94a3;
        --text-inverse: #ffffff;
        --border-color: #e2e6ee;
        --border-soft: rgba(0, 0, 0, 0.06);
        --hover-color: #f5f7fb;
        --hover-soft: rgba(0, 0, 0, 0.03);
        --shadow-color: rgba(20, 30, 60, 0.10);
        --shadow-sm: 0 1px 2px rgba(20, 30, 60, 0.08);
        --shadow-md: 0 4px 16px rgba(20, 30, 60, 0.12);
        --shadow-lg: 0 14px 40px rgba(20, 30, 60, 0.18);
        --chat-bg: #eef1f6;
        --chat-bubble-other: #ffffff;
        --tooltip-bg: #1a1f2b;
        --skeleton-base: #e8ecf3;
        --skeleton-shine: #f4f6fa;
        color-scheme: light;
    }
}

/* ---------- Reduced motion: отключаем анимации и переходы ---------- */
@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        animation-duration: 0.001ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.001ms !important;
        scroll-behavior: auto !important;
    }
}