/* ========================================
   ПЕРЕОПРЕДЕЛЕНИЕ ЦВЕТОВОЙ ПАЛИТРЫ
   Обеспечивает совместимость с COLOR_PALETTE.md
   ======================================== */

/* Дополнительные CSS переменные для полной совместимости */
:root {
    /* Основная цветовая палитра */
    --primary-color: #2D80C2;        /* Синий - основной цвет */
    --primary-dark: #1F5A8A;         /* Темно-синий */
    --primary-light: #4A9BD4;        /* Светло-синий */
    
    --accent-color: #B26914;         /* Оранжевый - акцентный */
    --accent-dark: #8B4F0F;          /* Темно-оранжевый */
    --accent-light: #D18B3A;         /* Светло-оранжевый */
    
    --danger-color: #CE5130;         /* Красный - опасность */
    --danger-dark: #A03E26;          /* Темно-красный */
    --danger-light: #E66B4A;         /* Светло-красный */
    
    --success-color: #728322;        /* Зеленый - успех */
    --success-dark: #5A681B;         /* Темно-зеленый */
    --success-light: #8FA42E;        /* Светло-зеленый */
    
    --warning-color: #B26914;        /* Оранжевый - предупреждение */
    --warning-dark: #8B4F0F;         /* Темно-оранжевый */
    --warning-light: #D18B3A;        /* Светло-оранжевый */
    
    --info-color: #0F8893;           /* Бирюзовый - информация */
    --info-dark: #0C6B73;            /* Темно-бирюзовый */
    --info-light: #2BA5B0;           /* Светло-бирюзовый */
    
    --purple-color: #CA45A5;         /* Фиолетовый - специальный */
    --purple-dark: #A03684;          /* Темно-фиолетовый */
    --purple-light: #E066C6;         /* Светло-фиолетовый */
    
    --secondary-color: #565F67;      /* Серый - вторичный цвет */
    --secondary-dark: #3A4147;       /* Темно-серый */
    --secondary-light: #7A8289;      /* Светло-серый */
    
    /* Дополнительные утилиты */
    --border-radius: 8px;
    --border-radius-lg: 12px;
    --box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    --box-shadow-lg: 0 4px 20px rgba(0, 0, 0, 0.15);
    --transition: all 0.3s ease;
}

/* Темная тема */
[data-theme="dark"] {
    --primary-color: #4A9BD4;        /* Светло-синий для темной темы */
    --primary-dark: #2D80C2;         /* Основной синий */
    --primary-light: #6BB3E8;        /* Очень светло-синий */
    
    --accent-color: #D18B3A;         /* Светло-оранжевый для темной темы */
    --accent-dark: #B26914;          /* Основной оранжевый */
    --accent-light: #E6A85C;         /* Очень светло-оранжевый */
    
    --danger-color: #E66B4A;         /* Светло-красный для темной темы */
    --danger-dark: #CE5130;          /* Основной красный */
    --danger-light: #F0856A;         /* Очень светло-красный */
    
    --success-color: #8FA42E;        /* Светло-зеленый для темной темы */
    --success-dark: #728322;         /* Основной зеленый */
    --success-light: #A8C23A;        /* Очень светло-зеленый */
    
    --warning-color: #D18B3A;        /* Светло-оранжевый для темной темы */
    --warning-dark: #B26914;         /* Основной оранжевый */
    --warning-light: #E6A85C;        /* Очень светло-оранжевый */
    
    --info-color: #2BA5B0;           /* Светло-бирюзовый для темной темы */
    --info-dark: #0F8893;            /* Основной бирюзовый */
    --info-light: #4BC7D2;           /* Очень светло-бирюзовый */
    
    --purple-color: #E066C6;         /* Светло-фиолетовый для темной темы */
    --purple-dark: #CA45A5;          /* Основной фиолетовый */
    --purple-light: #F085D8;         /* Очень светло-фиолетовый */
    
    --secondary-color: #7A8289;      /* Светло-серый для темной темы */
    --secondary-dark: #565F67;       /* Основной серый */
    --secondary-light: #9CA3AF;      /* Очень светло-серый */
}

/* Дополнительные классы для фона */
.bg-accent { background-color: var(--accent-color) !important; }
.bg-accent-dark { background-color: var(--accent-dark) !important; }
.bg-accent-light { background-color: var(--accent-light) !important; }

.bg-purple { background-color: var(--purple-color) !important; }
.bg-purple-dark { background-color: var(--purple-dark) !important; }
.bg-purple-light { background-color: var(--purple-light) !important; }

/* Дополнительные классы для текста */
.text-accent { color: var(--accent-color) !important; }
.text-accent-dark { color: var(--accent-dark) !important; }
.text-accent-light { color: var(--accent-light) !important; }

.text-purple { color: var(--purple-color) !important; }
.text-purple-dark { color: var(--purple-dark) !important; }
.text-purple-light { color: var(--purple-light) !important; }

/* Дополнительные классы для границ */
.border-accent { border-color: var(--accent-color) !important; }
.border-purple { border-color: var(--purple-color) !important; }

/* Кнопки с новыми цветами */
.btn-accent {
    background: linear-gradient(135deg, var(--accent-color), var(--accent-dark));
    border: none;
    color: white;
    box-shadow: 0 4px 15px rgba(178, 105, 20, 0.3);
    transition: var(--transition);
}

.btn-accent:hover {
    background: linear-gradient(135deg, var(--accent-dark), var(--accent-color));
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(178, 105, 20, 0.4);
}

.btn-purple {
    background: linear-gradient(135deg, var(--purple-color), var(--purple-dark));
    border: none;
    color: white;
    box-shadow: 0 4px 15px rgba(202, 69, 165, 0.3);
    transition: var(--transition);
}

.btn-purple:hover {
    background: linear-gradient(135deg, var(--purple-dark), var(--purple-color));
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(202, 69, 165, 0.4);
}

/* Бейджи с новыми цветами */
.badge-accent {
    background-color: var(--accent-color);
    color: white;
}

.badge-purple {
    background-color: var(--purple-color);
    color: white;
}

/* Прогресс-бары с новыми цветами */
.progress-accent .progress-bar {
    background: linear-gradient(90deg, var(--accent-color), var(--accent-light));
}

.progress-purple .progress-bar {
    background: linear-gradient(90deg, var(--purple-color), var(--purple-light));
}

/* Карточки с градиентными заголовками */
.card-accent .card-header {
    background: linear-gradient(135deg, var(--accent-color), var(--accent-dark));
}

.card-purple .card-header {
    background: linear-gradient(135deg, var(--purple-color), var(--purple-dark));
}

/* Адаптивность */
@media (max-width: 768px) {
    .btn-accent, .btn-purple {
        padding: 0.6rem 1.2rem;
        font-size: 0.9rem;
    }
}

/* Анимации */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in-up {
    animation: fadeInUp 0.6s ease-out;
}

/* Улучшенные тени для новых цветов */
.shadow-accent {
    box-shadow: 0 4px 20px rgba(178, 105, 20, 0.15) !important;
}

.shadow-purple {
    box-shadow: 0 4px 20px rgba(202, 69, 165, 0.15) !important;
}