/* ===== SPA СТИЛИ ===== */

/* Убираем горизонтальный скролл */
body, html {
    overflow-x: hidden;
}

/* Активный пункт меню */
.menu-item.active .relative {
    color: rgb(17 24 39) !important; /* text-textBody */
}

.menu-item.active .bg-textSecondary {
    background-color: rgb(17 24 39) !important; /* bg-textBody */
}

.menu-item.active span,
.menu-item.active .false {
    color: rgb(17 24 39) !important; /* text-textBody */
}

/* Неактивный пункт меню */
.menu-item:not(.active) .relative {
    background-color: transparent !important;
}

.menu-item:not(.active) .bg-textBody {
}

.menu-item:not(.active) span,
.menu-item:not(.active) .false {
}

/* Плавные переходы */
.menu-item .relative {
    transition: all 0.2s ease;
}

.menu-item .bg-textBody,
.menu-item .bg-textSecondary {
    transition: background-color 0.2s ease;
}

.menu-item span {
    transition: color 0.2s ease;
}

/* Анимация появления контента */
#page-content {
    animation: fadeIn 0.3s ease-in-out;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

/* Скрытие скроллбара */
.hide-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}

.hide-scrollbar::-webkit-scrollbar {
    display: none;
}