/* ==================== */
/* CSS ПЕРЕМЕННЫЕ ТЕМЫ  */
/* ==================== */

:root {
    /* Основные цвета */
    --dark-bg: #121212;
    --darker-bg: #0a0a0a;
    --dark-card: #1e1e1e;
    --light-card: #2a2a2a;
    --dark-border: #333;

    /* Акцентные цвета */
    --primary-color: #ffd700;
    --secondary-color: #297cd9;

    /* Цвета проблем и решений */
    --problem-color: #e74c3c;
    --problem-bg-hover: rgba(231, 76, 60, 0.15);
    --solution-color: #2ecc71;
    --solution-bg-hover: rgba(46, 204, 113, 0.15);


    /* Прозрачные варианты primary */
    --primary-bg-ultra-strong: rgba(255, 215, 0, 0.2);
    --primary-bg-color: rgba(255, 215, 0, 0.1);
    --primary-bg-light: rgba(255, 215, 0, 0.03);
    --primary-bg-medium: rgba(255, 215, 0, 0.05);
    --primary-bg-strong: rgba(255, 215, 0, 0.08);

    /* Прозрачные варианты secondary */
    --secondary-bg-color: rgba(41, 124, 217, 0.1);
    --secondary-bg-light: rgba(41, 124, 217, 0.03);
    --secondary-bg-medium: rgba(41, 124, 217, 0.05);
    --secondary-bg-strong: rgba(41, 124, 217, 0.08);

    /* Границы */
    --border-light: rgba(255, 255, 255, 0.03);
    --border-lighter: rgba(255, 255, 255, 0.05);
    --border-medium: rgba(255, 255, 255, 0.1);
    --border-strong: rgba(255, 255, 255, 0.2);
    --border-ultra-strong: rgba(255, 255, 255, 0.5);
    --border-primary: rgba(255, 215, 0, 0.1);
    --border-primary-medium: rgba(255, 215, 0, 0.15);
    --border-primary-strong: rgba(255, 215, 0, 0.3);

    /* Текст */
    --text-light: #f5f5f5;
    --text-muted: #b0b0b0;
    --date-color: #d1d1d1;

    /* Устаревшие цвета - позже удалить */
    --primary-bg-color-02: rgba(255, 215, 0, 0.2);
    --primary-bg-color-03: rgba(255, 215, 0, 0.3);
    --secondary-bg-color-02: rgba(41, 124, 217, 0.2);
    --secondary-bg-color-03: rgba(41, 124, 217, 0.3);
}

/* Базовые стили */
body {
    background-color: var(--dark-bg);
    color: var(--text-light);
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.6;
}

/* Вспомогательные классы */
.bg-darker {
    background-color: var(--darker-bg);
}

.bg-dark-card {
    background-color: var(--dark-card);
}

.bg-light-card {
    background-color: var(--light-card);
}

.border-dark {
    border-color: var(--dark-border) !important;
}

.text-primary {
    color: var(--primary-color) !important;
}

.text-justify {
    text-align: justify;
}

.text-justify h1,
.text-justify h2,
.text-justify h3 {
    text-align: left; /* Возвращаем заголовкам выравнивание влево */
}