/*****************************************************************
    STARTER INMOBILIARIO
    NAVBAR.CSS
*****************************************************************/


/*==============================================================
    NAVBAR
==============================================================*/

#navbarPrincipal{

    height:var(--navbar-height);

    background:var(--navbar-bg);

    transition:var(--transition);

    z-index:var(--z-navbar);

}


/*==============================================================
    CONTAINER
==============================================================*/

#navbarPrincipal .container{

    height:100%;

}


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

.navbar-logo{

    height:55px;

    width:auto;

    transition:var(--transition);

}


/*==============================================================
    BRAND
==============================================================*/

.navbar-brand{

    display:flex;

    align-items:center;

    padding:0;

}


/*==============================================================
    MENU
==============================================================*/

.navbar-nav{

    gap:.30rem;

}


.navbar-nav .nav-link{

    display:flex;

    align-items:center;

    gap:.45rem;

    padding:.75rem 1rem;

    color:var(--navbar-button-color);

    background:var(--navbar-button-bg);

    font-size:var(--font-size-sm);

    font-weight:var(--font-medium);

    border-radius:var(--radius);

    transition:var(--transition);

}


.navbar-nav .nav-link:hover,
.navbar-nav .nav-link:focus-visible{

    color:var(--navbar-button-hover-color);

    background:var(--navbar-button-hover-bg);

}


.navbar-nav .nav-link.active{

    color:var(--navbar-button-active-color);

    background:var(--navbar-button-active-bg);

}


/*==============================================================
    ICONOS
==============================================================*/

.navbar-nav i{

    font-size:.90rem;

}


/*==============================================================
    BOTON WHATSAPP
==============================================================*/

.navbar-whatsapp{

    margin-left:1rem;

    padding:.70rem 1.25rem;

    border-radius:var(--radius-pill);

    background:#25D366;

    color:#fff;

    font-size:var(--font-size-sm);

    font-weight:600;

    transition:var(--transition);

}


.navbar-whatsapp:hover{

    color:#fff;

    background:#1DA851;

    transform:translateY(-2px);

}


/*==============================================================
    NAVBAR SCROLL
==============================================================*/

#navbarPrincipal.scrolled{

    height:65px;

    box-shadow:var(--shadow);

}


#navbarPrincipal.scrolled .navbar-logo{

    height:45px;

}


/*==============================================================
    HAMBURGUESA
==============================================================*/

.navbar-toggler{

    border:none;

    box-shadow:none !important;

}


.navbar-toggler:focus{

    box-shadow:none;

}


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

@media(max-width:991px){

    #navbarPrincipal{

        height:auto;

        padding:.75rem 0;

    }

    .navbar-collapse{

        margin-top:1rem;

    }

    .navbar-nav{

        gap:.25rem;

    }

    .navbar-nav .nav-link{

        border-radius:var(--radius-sm);

    }

    .navbar-whatsapp{

        display:block;

        margin:1rem 0 0;

        text-align:center;

    }

}
