.navbar {
    box-shadow: 0 4px 6px rgba(0, 0, 0, 0.25); /* Ajusta los valores para modificar la sombra */
    overflow-x: hidden;
}

/* Logo del navbar */
.navbar-brand img {
    max-height: 50px; 
    height: auto;     
    width: auto;     
}

/* iconos del navbar */
.logo-nav{
    max-height: 20px; 
    width: auto; 
}

.linea {
    width: 0; /* Sin longitud inicialmente */
    height: 3px; /* Grosor de la línea */
    background-color: transparent; /* Color invisible */
    margin-top: 5px; /* Espaciado respecto al enlace */
    transition: all 0.3s ease; /* Transición suave */
}

/* Línea activa */
.active-line {
    width: 50%; /* Longitud de la línea (ajústalo según diseño) */
    background-color: #f39c12; /* Color de la línea activa */
    margin: 0 auto; /* Centrada bajo el ítem */
}

/*Línea divisoria entre los elementos del menú */
.navbar-nav .nav-item {
    
    align-items: center;
    justify-content: center;
    border-right: 3px solid orange; 
}

/*Esto evita que el último elemento tenga el borde cambiado */
.navbar-nav .nav-item:last-child {
    border-right: none;
}
/*Botón hamburguesa (no cambia las líneas de dentro)*/
.navbar-toggler{
    border: none;
    background-color: rgba(13, 15, 59, 1);
}
/*Cambia el color de las líneas del botón hamburguesa (cambiar los valores de rgba para alterarlo) */
.navbar-toggler-icon {
    background-image: url(
"data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(255, 255, 255, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
}
/*Tamaño de letra de los elementos del menú */
.nav-link {
    font-size: 1rem;
    
    
}



@media (min-width: 1200px) {
    /* Reducir el tamaño de los elementos del menú de navegación */
    /*
    .navbar-nav .nav-link {
        font-size: 1rem;  
        padding: 0.5rem 0.75rem;  
    }
*/
    /* Ajustar el tamaño de la frase "Llama gratis" */
    .llama-izquierda {
        font-size: 1rem;  /* Reduce el tamaño del texto */
        margin-right: 1rem;  /* Agrega un pequeño margen a la derecha para evitar desbordamientos */
    }

    /* Ajustar la alineación y espaciado para el menú y la frase */
    .navbar-nav {
        flex-wrap: nowrap;  /* Evita que los elementos se envuelvan */
        justify-content: flex-start;  /* Alinea el menú a la izquierda */
    }

    /* Reducir el tamaño del logo si es necesario */
    .navbar-brand img {
        max-height: 35px;  /* Ajusta la altura máxima del logo para pantallas grandes */
    }
}


@media (min-width: 1200px) {
    /* Reducir el ancho de los elementos del menú */


   
  

    /* Ajustar la alineación de los elementos */
    .navbar-nav {
        flex-wrap: nowrap;  /* Evita que los elementos se envuelvan en una nueva línea */
        justify-content: flex-start;  /* Alinea el menú a la izquierda */
        max-width: 75%;
    }

    /* Ajustar el tamaño del logo para ahorrar espacio */
    .navbar-brand img {
        max-height: 35px;  /* Tamaño reducido del logo */
    }
}

/* Mostrar la frase "Llama gratis" en el offcanvas en pantallas pequeñas */
@media (max-width: 991px) {
    .navbar-brand img {
        max-height: 50px; 
    }

    .llama-offcanvas {
        display: block; /* Muestra la frase en offcanvas en pantallas pequeñas */
        text-align: center;
    }

    .navbar-toggler {
        display: block; /* Muestra el botón hamburguesa */
        margin-left: auto; /* Coloca el botón hamburguesa a la derecha del todo */
    }
    .navbar-nav .nav-item {
        border-right: none; 
         padding: 0;
    }
 
}
@media (min-width: 768px) {
    .llama-offcanvas{
        display: none;
    }
 
}

@media (min-width: 768px) and (max-width: 1200px) {
    .navbar-nav {
      justify-content: flex-end !important; 
    }
  
    
    .llama-izquierda {
      display: none;
    }




  }

  @media (min-width: 769px){
    .navbar-nav .nav-link:hover {
        font-size: 1.1rem;
        color: orange !important;
        transition-duration: 500ms;
    }
    
    .nav-link {
        transition: color 500ms ease, font-size 500ms ease;
    }
  }

@media (max-width: 768px) {
  
   
      .offcanvas .navbar-nav .nav-item {
        margin-bottom: 10px; 
        justify-content: flex-end !important; 
        
      }

      .offcanvas .nav-link {
        font-size: 1.4rem; 
        font-weight: bold; 
      }
    .navbar-brand img {
        max-height: 40px; /* Asegura que no se reduzca en pantallas aún más pequeñas */
    }
    .llama-offcanvas{
        justify-content: flex-end !important; 
        font-size: 1.5rem; 
    }

    .navbar-nav .nav-item {
        border-right: none; /*Elimina las líneas divisorias del menú*/
    }

    .navbar-nav .nav-link:hover {
        
        color: orange !important;
        transition-duration: 500ms;
    }
    
    .nav-link {
        transition: color 500ms ease;
    }

}