/* =========================================================
   ToolZen Hub
   Global Navigation
========================================================= */


/* =========================================================
   Navigation Container
========================================================= */

.navbar__menu {

    display: flex;

    align-items: center;

    gap: 48px;

    padding: 0;

    list-style: none;

    flex-shrink: 0;

    /*
       Automatically pushes navigation
       toward the right side.
    */

    margin-left: auto;
}


/* =========================================================
   Navigation Items
========================================================= */

.navbar__menu li {

    margin: 0;
    padding: 0;
}


/* =========================================================
   Navigation Link
========================================================= */

.navbar__link {

    position: relative;

    display: inline-flex;

    align-items: center;
    justify-content: center;

    height: var(--header-height);

    color: #101828;

    font-size: 14px;

    font-weight: 600;

    text-decoration: none;

    white-space: nowrap;

    transition:
        color 0.2s ease;
}


/* =========================================================
   Hover
========================================================= */

.navbar__link:hover {

    color: #0b9f58;
}


/* =========================================================
   Active
========================================================= */

.navbar__link.active {

    color: #0b9f58;
}


/* =========================================================
   Active Indicator
========================================================= */

.navbar__link.active::after {

    content: "";

    position: absolute;

    left: 0;
    right: 0;

    bottom: 0;

    height: 3px;

    border-radius: 3px 3px 0 0;

    background: #0b9f58;
}


/* =========================================================
   Tablet / Mobile
========================================================= */

@media (max-width: 900px) {

    .navbar__menu {

        display: none !important;

        margin-left: 0 !important;
    }

}