/* color.css - Цветовая схема для портфолио в стиле VS Code */

/* ========== CSS ПЕРЕМЕННЫЕ ========== */
:root {
    --download-card-bg: rgba(255, 255, 255, 0.05);
--download-card-border: rgba(255, 255, 255, 0.1);
--download-card-hover-border: var(--terminal-teal);
--tech-tag-bg: rgba(78, 201, 176, 0.15);
--tech-tag-text: var(--terminal-teal);
--tech-tag-border: rgba(78, 201, 176, 0.3);
--download-btn-bg: var(--terminal-teal);
--download-btn-text: var(--primary-dark);
--download-info-bg: rgba(0, 0, 0, 0.2);
--download-info-border: var(--terminal-teal);
--notification-bg: var(--primary-dark);
--notification-border: var(--terminal-teal);
    /* Основные цвета фона */
    --primary-dark: #002451;
    --sidebar-dark: #001733;
    --nav-dark: #001C40;
    --tab-active: #003566;
    --tab-inactive: #002451;
    --footer-tabs-bg: #001C40;
    --footer-tab-active-bg: #002451;
    --footer-tab-hover-bg: rgba(255, 255, 255, 0.05);
    --notification-bg: #002451;
    --notification-border: rgba(255, 255, 255, 0.1);
    --notification-shadow: rgba(0, 0, 0, 0.3);
    --empty-state-bg: #002451;
    
    /* Цвета текста */
    --text-light: #fff6f6;
    --text-gray: #8F9BA6;
    --path-active: #4ec9b0;
    --path-inactive: #8F9BA6;
    --empty-state-text: #8F9BA6;
    
    /* Границы и разделители */
    --border-light: rgba(255, 255, 255, 0.1);
    
    /* Акцентные цвета */
    --terminal-teal: #4ec9b0;
    --code-blue: #569CD6;
    --code-green: #6A9955;
    --code-orange: #CE9178;
    --code-light-blue: #9CDCFE;
    --code-gray: #D4D4D4;
    
    /* Цвета для футера */
    --problems-red: #f14c4c;
    --output-blue: #0e639c;
    --debug-orange: #cc6633;
    --comments-green: #6a9955;
    
    /* Цвета скроллбаров */
    --scrollbar-track: #001733;
    --scrollbar-thumb: rgba(255, 255, 255, 0.15);
    --scrollbar-thumb-hover: rgba(255, 255, 255, 0.25);
    --text-scrollbar-thumb: rgba(255, 255, 255, 0.1);
    --text-scrollbar-thumb-hover: rgba(255, 255, 255, 0.2);
    --footer-scrollbar-thumb: rgba(255, 255, 255, 0.1);
    --footer-scrollbar-thumb-hover: rgba(255, 255, 255, 0.2);
    
    /* Достижения */
    --achievements-gradient-start: #6A9955;
    --achievements-gradient-end: #4ec9b0;
    --achievement-bg: rgba(255, 255, 255, 0.05);
    --achievement-border: #4ec9b0;
    --achievement-details-bg: rgba(0, 0, 0, 0.2);
    --certificate-border: rgba(255, 255, 255, 0.1);
    --certificate-hover-border: #4ec9b0;
    --certificate-hover-shadow: rgba(78, 201, 176, 0.4);
    --stats-gradient-start: rgba(78, 201, 176, 0.1);
    --stats-gradient-end: rgba(86, 156, 214, 0.1);
    --stats-border: rgba(255, 255, 255, 0.1);
    --stat-item-bg: rgba(0, 0, 0, 0.3);
    --achievements-footer-bg: rgba(0, 0, 0, 0.2);
    --achievements-footer-border: rgba(255, 255, 255, 0.1);
    --portfolio-link-bg: #4ec9b0;
    --portfolio-link-text: #002451;
    
    /* Обо мне */
    --profession-title-color: #4ec9b0;
    --about-me-header-border: rgba(255, 255, 255, 0.1);
    --skill-badge-bg: rgba(78, 201, 176, 0.15);
    --skill-badge-text: #4ec9b0;
    --skill-badge-border: rgba(78, 201, 176, 0.3);
    --photo-border: #4ec9b0;
    --current-learning-bg: rgba(0, 0, 0, 0.2);
    --current-learning-border: #569CD6;
    --aviation-details-bg: rgba(0, 36, 81, 0.3);
    --aviation-details-border: rgba(255, 255, 255, 0.1);
    --mentor-section-gradient-start: rgba(0, 36, 81, 0.4);
    --mentor-section-gradient-end: rgba(26, 48, 77, 0.4);
    --mentor-section-border: rgba(255, 255, 255, 0.1);
    --mentor-photo-border: #4ec9b0;
    --mentor-skills-bg: rgba(0, 0, 0, 0.2);
    --club-info-bg: rgba(78, 201, 176, 0.1);
    --club-info-border: #4ec9b0;
    --timeline-line: rgba(255, 255, 255, 0.1);
    --sport-item-bg: rgba(255, 255, 255, 0.05);
    --sport-item-current-bg: rgba(78, 201, 176, 0.15);
    --sport-item-current-border: #4ec9b0;
    --sport-item-marker: #4ec9b0;
    --sport-item-marker-border: #002451;
    --sport-item-current-marker: #9CDCFE;
    --sport-name-underline: #4ec9b0;
    --sport-item-connector: rgba(255, 255, 255, 0.2);
    --sports-conclusion-bg: rgba(0, 0, 0, 0.2);
    --sports-conclusion-border: #6A9955;
    --plan-category-bg: rgba(255, 255, 255, 0.05);
    --plan-category-border: rgba(255, 255, 255, 0.1);
    --quote-gradient-start: rgba(0, 36, 81, 0.6);
    --quote-gradient-end: rgba(26, 48, 77, 0.6);
    --quote-border: #4ec9b0;
    --download-header-color: var(--text-light);
--download-description-color: var(--text-gray);
--download-level-title: var(--code-light-blue);
--download-counter-bg: var(--terminal-teal);
--download-counter-text: var(--primary-dark);
--level-divider-color: var(--border-light);
}

/* ========== ОСНОВНЫЕ ЭЛЕМЕНТЫ ========== */

/* Body и основной фон */
body {
    background-color: var(--primary-dark);
}

/* Левое боковое меню */
.left_menu {
    background-color: var(--sidebar-dark);
}

/* Левая навигация */
.left_nav {
    background-color: var(--nav-dark);
    color: var(--text-light);
}

#left_nav_h2 {
    color: var(--text-light);
}

.left_nav_main_sec {
    background-color: #1A304D;
}

.left_nav_h3 {
    color: var(--text-light);
}

.left_nav_ul li {
    color: var(--text-light);
}

.left_nav_ul li::before {
    filter: brightness(0) invert(1);
}

/* Стили для выпадающего меню тем */
.theme-dropdown {
    background-color: var(--nav-dark);
    border: 1px solid var(--border-light);
}

.theme-option {
    color: var(--text-light);
    border-bottom: 1px solid var(--border-light);
}

.theme-option:hover {
    background-color: rgba(255, 255, 255, 0.1);
}

.theme-option.active {
    background-color: #1A304D;
    color: var(--code-light-blue);
}

/* ========== ПРАВАЯ ЧАСТЬ ========== */

/* Верхняя часть с табами */
.head_title {
    background-color: var(--nav-dark);
    border-bottom: 1px solid var(--border-light);
}

.tab.active {
    background-color: var(--tab-active);
    border-bottom-color: var(--terminal-teal);
}

.tab {
    background-color: var(--tab-inactive);
    border: 1px solid var(--border-light);
}

.tab h2 {
    color: var(--text-light);
}

/* Навигация в основном контенте */
.main_nav {
    background-color: var(--nav-dark);
    border-bottom: 1px solid var(--border-light);
}

.path li:last-child {
    color: var(--path-active);
    font-weight: 600;
}

.path {
    color: var(--text-light);
}

.path li:not(:last-child)::after {
    filter: brightness(0) invert(1) opacity(0.6);
}

.file-icon {
    filter: brightness(0) invert(1) opacity(0.8);
}

.menu-icon {
    filter: brightness(0) invert(1) opacity(0.6);
}

.menu-icon:hover {
    filter: brightness(0) invert(1) opacity(1);
}

/* Основной контент */
.main_content {
    background-color: var(--primary-dark);
    color: var(--text-light);
}

/* Редактор кода */
.code-editor {
    background-color: var(--primary-dark);
    border: 1px solid var(--border-light);
}

.line-numbers {
    background-color: var(--sidebar-dark);
    color: var(--text-gray);
    border-right: 1px solid var(--border-light);
}

.text-content {
    background-color: var(--primary-dark);
    color: var(--text-light);
}

/* Стили для текстового контента */
.text-content h1 {
    color: var(--text-light);
    border-bottom: 2px solid var(--border-light);
}

.text-content h2 {
    color: var(--code-light-blue);
}

.text-content h3 {
    color: var(--code-orange);
}

.text-content p {
    color: var(--code-gray);
}

.text-content li {
    color: var(--code-gray);
}

/* Подсветка синтаксиса для кода */
.tag {
    color: var(--code-blue);
}

.attr {
    color: var(--code-light-blue);
}

.string {
    color: var(--code-orange);
}

.comment {
    color: var(--code-green);
}

.text {
    color: var(--code-gray);
}

/* ========== ФУТЕР ========== */

.footer {
    border-top: 1px solid var(--border-light);
}

.footer-tabs {
    background-color: var(--footer-tabs-bg);
    border-bottom: 1px solid var(--border-light);
}

.footer-tab {
    border-right: 1px solid var(--border-light);
    color: var(--text-light);
}

.footer-tab:hover {
    background-color: var(--footer-tab-hover-bg);
}

.footer-tab.active {
    background-color: var(--footer-tab-active-bg);
    border-bottom: 2px solid var(--terminal-teal);
}

.footer-tab-header {
    color: var(--text-light);
}

.footer-content {
    background-color: var(--primary-dark);
    color: var(--text-light);
}

/* Цвета границ для вкладок футера */
.footer-tab[data-tab="problems"] {
    border-left: 3px solid var(--problems-red);
}

.footer-tab[data-tab="output"] {
    border-left: 3px solid var(--output-blue);
}

.footer-tab[data-tab="debug"] {
    border-left: 3px solid var(--debug-orange);
}

.footer-tab[data-tab="terminal"] {
    border-left: 3px solid var(--terminal-teal);
}

.footer-tab[data-tab="comments"] {
    border-left: 3px solid var(--comments-green);
}

/* Терминал */
.terminal-prompt {
    color: var(--terminal-teal);
}

.terminal-text {
    color: var(--text-light);
}

.left_menu_img {
    filter: brightness(0) invert(1);
}

.left_menu_img.theme-switcher {
    filter: brightness(0) invert(1);
}

/* Иконки в левой навигации */
.a-d,
#img_nav_top,
.left_nav_main_sec_img {
    filter: brightness(0) invert(1);
}

/* Иконки в верхней панели - ИСПРАВЛЕНО для html.png */
#tab1 {
    /* HTML иконка - сохраняем оригинальный цвет */
    filter: none;
}

#tab2,
.header-icons img {
    filter: brightness(0) invert(1);
}

/* Иконки в основной навигации */
.menu-icon {
    filter: brightness(0) invert(1) opacity(0.6);
}

.menu-icon:hover {
    filter: brightness(0) invert(1) opacity(1);
}

/* Иконки в футере */
.footer-tab-icon {
    filter: brightness(0) invert(1);
}

/* Иконка файла в основной навигации */
.file-icon {
    filter: brightness(0) invert(1) opacity(0.8);
}

/* ========== ХОВЕР ЭФФЕКТЫ ========== */

/* Эффекты для иконок */
.left_menu_img:hover,
.a-d:hover,
.left_nav_main_sec_img:hover,
#img_nav_top:hover,
.header-icons img:hover,
#tab2:hover {
    opacity: 0.8;
}

/* Эффекты для пунктов левой навигации */
.left_nav_ul li:hover {
    background-color: rgba(255, 255, 255, 0.05);
}

/* Эффекты для вкладок футера */
.footer-tab:hover .footer-tab-header {
    color: var(--terminal-teal);
}

/* ========== АКТИВНЫЕ СОСТОЯНИЯ ========== */

/* Активная вкладка футера */
.footer-tab.active .footer-tab-header {
    color: var(--terminal-teal);
}

/* ========== СКРОЛЛБАРЫ ========== */

/* Основной скроллбар контента */
.main_content::-webkit-scrollbar-track {
    background: var(--scrollbar-track);
}

.main_content::-webkit-scrollbar-thumb {
    background: var(--scrollbar-thumb);
}

.main_content::-webkit-scrollbar-thumb:hover {
    background: var(--scrollbar-thumb-hover);
}

/* Скроллбар текстового контента */
.text-content::-webkit-scrollbar-track {
    background: transparent;
}

.text-content::-webkit-scrollbar-thumb {
    background: var(--text-scrollbar-thumb);
}

.text-content::-webkit-scrollbar-thumb:hover {
    background: var(--text-scrollbar-thumb-hover);
}

/* Скроллбар для футера */
.footer-content::-webkit-scrollbar-track {
    background: var(--sidebar-dark);
}

.footer-content::-webkit-scrollbar-thumb {
    background: var(--footer-scrollbar-thumb);
}

.footer-content::-webkit-scrollbar-thumb:hover {
    background: var(--footer-scrollbar-thumb-hover);
}

/* ========== ДОПОЛНИТЕЛЬНЫЕ СТИЛИ ========== */

/* Пустое состояние */
.no-tab-content {
    background-color: var(--empty-state-bg);
}

.empty-state {
    color: var(--empty-state-text);
}

.empty-state h1 {
    color: var(--text-light);
}

/* Уведомления курсора */
.cursor-notification {
    background-color: var(--notification-bg);
    border: 1px solid var(--notification-border);
    box-shadow: 0 4px 12px var(--notification-shadow);
}

/* Достижения */
#achievements-content .text-content::before {
    background: linear-gradient(to bottom, var(--achievements-gradient-start), var(--achievements-gradient-end));
}

.achievement-item {
    background-color: var(--achievement-bg);
    border-left: 4px solid var(--achievement-border);
}

.achievement-details {
    background-color: var(--achievement-details-bg);
}

.certificate-img {
    border: 2px solid var(--certificate-border);
}

.certificate-link:hover .certificate-img {
    border-color: var(--certificate-hover-border);
    box-shadow: 0 0 15px var(--certificate-hover-shadow);
}

.achievements-stats {
    background: linear-gradient(135deg, var(--stats-gradient-start), var(--stats-gradient-end));
    border: 1px solid var(--stats-border);
}

.stat-item {
    background-color: var(--stat-item-bg);
}

.achievements-footer {
    background-color: var(--achievements-footer-bg);
    border: 2px dashed var(--achievements-footer-border);
}

.full-portfolio-link {
    background-color: var(--portfolio-link-bg);
    color: var(--portfolio-link-text);
}

/* Обо мне */
.profession-title {
    color: var(--profession-title-color);
}

.about-me-header {
    border-bottom: 2px solid var(--about-me-header-border);
}

.skill-badge {
    background-color: var(--skill-badge-bg);
    color: var(--skill-badge-text);
    border: 1px solid var(--skill-badge-border);
}

.about-me-photo {
    border: 3px solid var(--photo-border);
}

.current-learning {
    background-color: var(--current-learning-bg);
    border-left: 4px solid var(--current-learning-border);
}

.aviation-details {
    background-color: var(--aviation-details-bg);
    border: 1px solid var(--aviation-details-border);
}

.mentor-section {
    background: linear-gradient(135deg, var(--mentor-section-gradient-start), var(--mentor-section-gradient-end));
    border: 1px solid var(--mentor-section-border);
}

.mentor-photo {
    border: 3px solid var(--mentor-photo-border);
}

.mentor-skills {
    background-color: var(--mentor-skills-bg);
}

.club-info {
    background-color: var(--club-info-bg);
    border-left: 3px solid var(--club-info-border);
}

.sports-timeline:before {
    background-color: var(--timeline-line);
}

.sport-item {
    background-color: var(--sport-item-bg);
}

.sport-item.current {
    background-color: var(--sport-item-current-bg);
    border: 2px solid var(--sport-item-current-border);
}

.sport-item:before {
    background-color: var(--sport-item-marker);
    border: 3px solid var(--sport-item-marker-border);
}

.sport-item.current:before {
    background-color: var(--sport-item-current-marker);
    border-color: var(--sport-item-current-marker);
}

.sport-name:after {
    background-color: var(--sport-name-underline);
}

.sport-item:after {
    background-color: var(--sport-item-connector);
}

.sports-conclusion {
    background-color: var(--sports-conclusion-bg);
    border-left: 4px solid var(--sports-conclusion-border);
}

.plan-category {
    background-color: var(--plan-category-bg);
    border: 1px solid var(--plan-category-border);
}

.personal-quote {
    background: linear-gradient(135deg, var(--quote-gradient-start), var(--quote-gradient-end));
    border-left: 5px solid var(--quote-border);
}   
/* ========== СТИЛИ ДЛЯ СИСТЕМЫ СКАЧИВАНИЯ ========== */
.download-header {
    color: var(--download-header-color);
    font-size: 24px;
    margin-bottom: 15px;
}
.download-description {
    color: var(--download-description-color);
    font-size: 14px;
    margin-bottom: 25px;
    line-height: 1.6;
}
.download-level-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-bottom: 15px;
}
.level-title {
    color: var(--download-level-title);
    font-size: 20px;
    font-weight: 600;
}
.download-counter {
    background-color: var(--download-counter-bg);
    color: var(--download-counter-text);
    padding: 4px 12px;
    border-radius: 12px;
    font-size: 14px;
    font-weight: 500;
}
.level-divider {
    border: none;
    height: 1px;
    background-color: var(--level-divider-color);
    margin: 15px 0 25px 0;
}
.download-card {
    background-color: var(--download-card-bg);
    border: 1px solid var(--download-card-border);
}

.download-card:hover {
    border-color: var(--download-card-hover-border);
}

.tech-tag {
    background-color: var(--tech-tag-bg);
    color: var(--tech-tag-text);
    border: 1px solid var(--tech-tag-border);
}
.download-btn {
    background-color: var(--download-btn-bg);
    color: var(--download-btn-text);
}

.download-info, .download-instructions {
    background-color: var(--download-info-bg);
    border-left: 4px solid var(--download-info-border);
}

.download-notification {
    background-color: var(--notification-bg);
    border: 1px solid var(--notification-border);
}
/* Стили для раздела информации о сайте */
.site-info-content {
    color: var(--text-light);
}

.info-section h3 {
    color: var(--code-light-blue);
}

.info-value {
    color: var(--terminal-teal);
}

.tech-tag {
    background-color: rgba(78, 201, 176, 0.1);
    color: var(--terminal-teal);
    border-color: rgba(78, 201, 176, 0.3);
}

.update-date {
    color: var(--code-orange);
}
/* Исправление для иконок контактов в синей теме */
[data-theme="color"] .contacts-content {
    color: var(--text-light);
}

[data-theme="color"] .contact-icon img {
    filter: none !important;
}

[data-theme="color"] .contact-card {
    background-color: rgba(255, 255, 255, 0.05);
    border: 1px solid rgba(255, 255, 255, 0.1);
}

[data-theme="color"] .contact-card:hover {
    border-color: var(--card-accent);
}

[data-theme="color"] .contact-info h4 {
    color: var(--text-light);
}

[data-theme="color"] .contact-desc {
    color: var(--text-light);
}

[data-theme="color"] .contact-value {
    color: var(--text-light);
}

[data-theme="color"] .time-label,
[data-theme="color"] .time-value {
    color: var(--text-light);
}
/* тест */