html, body {
    font-family: 'Plus Jakarta Sans', 'Helvetica Neue', Helvetica, Arial, sans-serif;
    background-color: #F3F5F9;
    color: #1e293b;
}

.nav-link-styled {
    position: relative;
    padding-top: 0.25rem;
    padding-bottom: 0.25rem;
    font-size: 0.875rem;
    font-weight: 700;
    color: rgb(148 163 184);
    text-decoration: none;
    transition: all 0.3s;
}

.nav-link-styled:hover {
    color: rgb(71 85 105);
}

.nav-link-styled.active {
    color: #0f172a !important; 
}

.active-underline {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
    height: 0.125rem;
    background-color: #0f172a;
    border-radius: 9999px;
    display: none;
    animation: fadeInZoom 0.3s ease-in-out;
}

.nav-link-styled.active .active-underline {
    display: block;
}

@keyframes fadeInZoom {
    from {
        opacity: 0;
        transform: scale(0.8);
    }

    to {
        opacity: 1;
        transform: scale(1);
    }
}

.nav-item-custom.active {
    color: #0f172a !important; 
}

    .nav-item-custom.active .active-indicator {
        display: block !important;
    }

/* Blazicons: Make SVG icons respect font-size via 1em sizing */
svg[blazicon] {
    width: 1em;
    height: 1em;
}

/* Hide scrollbar for sub-navigation */
.no-scrollbar::-webkit-scrollbar {
    display: none;
}

.no-scrollbar {
    -ms-overflow-style: none;
    scrollbar-width: none;
}