/* static/css/main.css — добавить в конец */

/* ===== ПЛАВНЫЙ ПЕРЕХОД ДЛЯ ВСЕХ ЭЛЕМЕНТОВ ===== */
* {
    transition: background-color 0.4s ease,
                border-color 0.4s ease,
                color 0.4s ease,
                box-shadow 0.4s ease,
                transform 0.3s ease;
}

/* ===== СВЕТЛАЯ ТЕМА (по умолчанию) ===== */
:root {
    --bg-page: #F2F3F5;
    --bg-surface: #FFFFFF;
    --bg-card: rgba(255, 255, 255, 0.85);
    --text-primary: #1A1A1A;
    --text-secondary: #404050;
    --text-muted: #6B7280;
    --border-color: rgba(0, 0, 0, 0.04);
    --shadow-color: rgba(0, 0, 0, 0.04);
    --accent: #4D5CFF;
    --accent-hover: #3A45CC;
}

/* ===== ТЁМНАЯ ТЕМА ===== */
.dark-mode {
    --bg-page: #0f0f1a;
    --bg-surface: #1A1A2E;
    --bg-card: rgba(30, 30, 50, 0.85);
    --text-primary: #E8E8F0;
    --text-secondary: #A0A0B8;
    --text-muted: #8888A0;
    --border-color: rgba(255, 255, 255, 0.04);
    --shadow-color: rgba(0, 0, 0, 0.2);
}

/* ===== СТИЛИ ДЛЯ СКРОЛЛА ===== */
::-webkit-scrollbar {
    width: 6px;
}

::-webkit-scrollbar-track {
    background: transparent;
}

::-webkit-scrollbar-thumb {
    background: rgba(77, 92, 255, 0.3);
    border-radius: 9999px;
}

::-webkit-scrollbar-thumb:hover {
    background: rgba(77, 92, 255, 0.5);
}

.dark-mode ::-webkit-scrollbar-thumb {
    background: rgba(77, 92, 255, 0.2);
}

.dark-mode ::-webkit-scrollbar-thumb:hover {
    background: rgba(77, 92, 255, 0.4);
}