/* ==================================
   GOVERNMENT STYLE NAVBAR
================================== */

.custom-navbar{
    position:fixed;
    top:0;
    left:0;
    width:100%;
    z-index:9999;

    background:#ffffff;

    border-bottom:1px solid var(--border-color);

    box-shadow:none;

    padding:10px 0;

    transition:.25s ease;
}

/* .custom-navbar::after{
    content:'';
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    height:3px;
    background:var(--primary-red);
} */

.custom-navbar.scrolled{
    padding:8px 0;
    background:#ffffff;
    box-shadow:0 2px 8px rgba(0,0,0,.05);
}

/* ==================================
   LOGO
================================== */

.logo{
    height:60px;
    width:auto;
    transition:.25s ease;
}

.custom-navbar.scrolled .logo{
    height:54px;
}

/* ==================================
   NAVIGATION
================================== */

.navbar-nav{
    align-items:center;
    gap:2px;
}

.nav-link{
    position:relative;

    color:var(--text-dark)!important;

    font-size:13px;

    font-weight:600;

    padding:10px 14px!important;

    text-transform:uppercase;

    letter-spacing:.3px;

    transition:.25s ease;
}

.nav-link:hover{
    color:var(--primary-red)!important;
    background:rgba(0,108,53,.05);
}

.nav-link.active{
    color:var(--primary-red)!important;
    font-weight:700;
}

.nav-link::after{
    content:'';

    position:absolute;

    left:14px;
    bottom:5px;

    width:0;

    height:2px;

    background:var(--primary-red);

    transition:.25s ease;
}

.nav-link:hover::after,
.nav-link.active::after{
    width:calc(100% - 28px);
}

/* ==================================
   TRACK BUTTON
================================== */

.nav-action{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    height:42px;

    padding:0 16px;

    border:1px solid var(--border-color);

    border-radius:4px;

    background:#fff;

    color:var(--primary-red);

    font-size:12px;

    font-weight:600;

    text-transform:uppercase;

    transition:.25s ease;
}

.nav-action:hover{
    background:#f8fafc;
    color:var(--primary-red)!important;
}

.nav-action.active{
    border-color:var(--primary-red);
    background:rgba(0,108,53,.05);
}

/* ==================================
   APPLY BUTTON
================================== */

.apply-btn{
    display:inline-flex;
    align-items:center;
    justify-content:center;

    height:42px;

    padding:0 18px;

    background:var(--primary-red);

    color:#fff!important;

    border-radius:4px;

    font-size:12px;

    font-weight:700;

    text-transform:uppercase;

    letter-spacing:.4px;

    transition:.25s ease;
}

.apply-btn:hover{
    background:var(--red-dark);
    color:#fff!important;
}

.apply-btn.active-btn{
    background:var(--red-dark);
}

/* ==================================
   TOGGLER
================================== */

.navbar-toggler{
    border:none;
    box-shadow:none!important;
    padding:0;
}

.navbar-toggler i{
    font-size:24px;
    color:var(--primary-red);
}

/* ==================================
   MOBILE
================================== */

@media(max-width:991px){

    .custom-navbar{
        padding:8px 0;
    }

    .logo{
        height:50px;
    }

    .navbar-collapse{
        margin-top:12px;

        background:#fff;

        border:1px solid var(--border-color);

        border-radius:4px;

        padding:12px;
    }

    .navbar-nav{
        gap:0;
        align-items:flex-start;
    }

    .nav-item{
        width:100%;
    }

    .nav-link{
        width:100%;
        padding:12px!important;
        border-bottom:1px solid #f1f5f9;
    }

    .nav-link::after{
        display:none;
    }

    .nav-action,
    .apply-btn{
        width:100%;
        margin-top:10px;
    }
}