.div_idioma{
    display:block !important;
}
.idioma_header{
    border-right: none !important;
}
.div_idioma .text-end{
    display:block !important;
}
/* Modal Mensajes */
#modal_mensajes h5{
    color: #fff !important;
    font-weight: bold;
    text-transform: uppercase;
}

/* ESTILOS CATEGORÍA */
.div_especialidad_casa{
    text-align: center;margin: 15px;background: #343534;color: #fff;width: 80%;border-radius: 20px;margin: 0 auto;margin-bottom: 10px;
}
.div_especialidad_casa img{
    width: 18px;position: relative;bottom: 2px;
}
.div_imagen{
    width: 100%;
        text-align: center;
}
.div_imagen img{
    max-height: 200px;    
    border-radius: 50%;
    border: 5px solid var(--white);
}
.producto_listado{
    background-color: #fff;
    border-radius: 20px;
}
.producto_listado .subtitulo_detalles{
    font-weight: bold !important;
    text-decoration: underline;
    font-size: 16px;
}
.producto_listado{
    background: #ffffff;
    
}
.producto_listado h4,.div_precio_producto{
    background: none !important;
}
.contenedor_alergenos{
    margin-bottom: 15px;border-bottom: 1px solid #cccccc;padding-bottom: 15px;font-size: 16px;
}
.div_alergenos{
    margin-top: 10px;
}
.div_alergenos img{
    width: 30px; height: 30px; cursor: pointer;display: inline;
}
.miniaturas-imagenes{
    text-align: center;
}
.miniaturas-imagenes img{
    width: 50px; height: 50px; border-radius: 50%; cursor: pointer; margin: 5px;
}
.miniatura {
    opacity: 0.6;
    transition: opacity 0.3s;
}

.miniatura.activa {
    opacity: 1;
    border: 2px solid #000; /* Puedes cambiar el color o el grosor */
}

.miniatura:hover {
    opacity: 1;
}
.select_variacion{
    width: 100%; padding: 10px;margin-bottom: 10px;
}

.enlace_boton{
    width: 100%;
    text-align: center;
}
.enlace_boton div{
    display: inline-block;
    margin: 0 auto;
    font-weight: bold;
    text-transform: capitalize;
    transition: all 0.35s ease-in-out;
    overflow: hidden;
    border-radius: 7px;
    border: 2px solid transparent;
    -webkit-box-shadow: inherit;
    box-shadow: inherit;
    font-size: 16px;
    text-transform: uppercase;
    letter-spacing: 1px;
    padding: 10px 40px;
    background: #E7EDF8;
    position: relative;
    z-index: 1;
    color: var(--white);
    border: none;
    background: var(--color-primary);
    cursor: pointer;
}
.enlace_boton div:hover::after {
    -webkit-transform: translateY(-45%) skew(25deg) scale(1.2);
    transform: translateY(-45%) skew(25deg) scale(1.2);
}
.enlace_boton div::after {
    position: absolute;
    top: inherit;
    right: inherit;
    bottom: inherit;
    left: -5%;
    content: "";
    height: 150px;
    width: 115%;
    z-index: -1;
    background-color: var(--dark);
    -webkit-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    -webkit-transform: translateY(-45%) skew(25deg) scale(0);
    transform: translateY(-45%) skew(25deg) scale(0);
}
 /* Estilos para la textarea */
.textarea_nota {
    width: 100%;
    padding: 10px;
    margin-top: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    font-size: 14px;
}

/* Estilos para los botones de cantidad */
.cantidad_pedido {
    display: flex;
    align-items: center;
    margin-top: 10px;
    width: 100%;
}

.btn_cantidad {
    background-color: #000;
    border: 1px solid #ccc;
    border-radius: 10px;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: 25px;
    cursor: pointer;
    margin: 0 5px;
}

.cantidad_numero {
    font-size: 16px;
    padding: 0 10px;
}



.ocultar {
    display: none;
}


.sub-heading{    
    font-weight: bold !important; 
}

/* Estilos para eliminar el estilo por defecto de los selects en Safari iOS */
.producto_listado select {
    
    background-color: #fff;  /* Fondo blanco o el color que prefieras */
    color: #000;             /* Texto en negro o el color que prefieras */
    padding: 10px;           /* Añadir padding para el aspecto */
    border: 1px solid #ccc;  /* Borde gris claro */
    border-radius: 5px;      /* Bordes redondeados */
    font-size: 16px;         /* Tamaño de fuente */
    width: 100%;             /* Asegúrate de que ocupe el 100% del ancho disponible */
}

/* Para agregar un ícono de flecha personalizado */
.producto_listado select {
    background-repeat: no-repeat;
    background-position: right 10px center; /* Posiciona la imagen */
    background-size: 10px;
    padding-right: 30px; /* Espacio adicional para la imagen */
}
.texto_antes_despues{
    background-color: var(--dark); line-height: 1.5;padding: 20px;margin-top: 15px;border-radius: 20px;
}
.texto_antes_despues p,.texto_antes_despues ul{
    font-family: var(--font-default);font-weight: 400;color: #cccccc;margin: 0;
}
.texto_antes_despues ul li{list-style: disc;margin-left:20px;}
.texto_antes_despues h2{color: #cccccc;}


/* Menú del Dia */
.productos_menu_dia{
    grid-row-gap: 0px !important;
    margin: 0 !important;
}
.productos_menu_dia li{
    border: none !important;
    padding: 0 !important;
}
.seccion_menu_dia{
    margin-bottom: 15px !important;
    margin-top: 15px !important;
}

/* Ficha Contacto*/
.div_ficha_contacto ul{
    margin-top: 15px;
}
.div_ficha_contacto ul li{
    list-style: disc;
    margin-left: 15px;
}
#div_paking p{
    display: inline;
}
.div_ficha_contacto i{
        color: var(--color-primary) !important;
}
.google-maps iframe {
    width: 100% !important;
    height: 400px;
    border: none;
    margin-top: 15px;
}
/*Footer*/
#div_copyright div{
    background-color:#d24154;color:#fff;padding: 10px;margin-top: 10px;
}
#div_copyright div a{
     text-decoration: underline;
    font-weight: bold;
    color: #fff;
}

/* Estilo para la pagina de reserva */
#carros_sillas input{
    -webkit-appearance: radio;
    float: initial;
    margin-left: 0px;
}

.checkbox_carros_si{
    background: green;
    padding-left: 1.5em;
    padding-right: 1.5em;
    color:#fff;
}


.checkbox_carros_no{
    background:#eb0029;
    padding-left: 1.5em;
    padding-right: 1.5em;
    color:#fff;
}

.checkbox_carros label{color:#fff;}

@media only screen and (max-width: 767px) {
    .breadcrumb-area {
        padding: 50px 0 !important;
    }

    .top-bar-area {
        padding: 3px 0;
    }

    #dropdownMenuButton1{
        position: relative;
        bottom: 4px;
    }
}
@media (max-width: 1023px) {
    nav{height: 120px;}
    .navbar-brand>img {
        height: auto;
        max-height: 110px;
    }
}


/* PARTE DE CATS Y SUBCATS */
ul.meal-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); /* Responsivo */
    gap: 20px; /* Espacio entre elementos */
    padding: 0; /* Opcional: elimina padding si no es necesario */
    list-style: none; /* Elimina los puntos de la lista */
}

/* Ajustes del diseño entre 768px y 1000px */
@media (max-width: 1000px) and (min-width: 769px) {
    ul.meal-items {
        grid-template-columns: repeat(2, 1fr); /* Dos columnas entre 1000px y 768px */
    }
}

/* Ajustes del diseño en dispositivos móviles (menos de 768px) */
@media (max-width: 768px) {
    ul.meal-items {
        grid-template-columns: repeat(1, 1fr); /* Una columna debajo de 768px */
    }
}


ul.meal-items li {
    background: #f9f9f9; /* Estilo de ejemplo */
    border: 1px solid #ddd; /* Estilo de ejemplo */
    border-radius: 5px; /* Opcional */
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1); /* Opcional */

    display: flex; /* Asegura que el contenido interno se expanda */
    align-items: stretch; /* Alinea el contenido verticalmente */
    padding: 10px; /* Espacio interno */
    margin: 0; /* Elimina márgenes no deseados */
    text-align: center; /* Centrado del contenido */
}

ul.meal-items li > div {
    width: 100%; /* Asegura que el div ocupe todo el ancho */
    box-sizing: border-box; /* Incluye padding y border en el cálculo de width */
}


/* MENU DEL DÍA */
.productos_menu_dia {
    list-style: none; /* Elimina los puntos de la lista */
    padding: 0;
    margin: 20px 0;
}

.productos_menu_dia li {
    background: #fff; /* Fondo blanco limpio */
    border: 1px solid #ddd; /* Borde sutil */
    border-radius: 10px; /* Bordes redondeados */
    box-shadow: 0 2px 5px rgba(0, 0, 0, 0.1); /* Sombra ligera */
    padding: 15px;
    margin-bottom: 15px; /* Espacio entre filas */
    transition: transform 0.2s ease, box-shadow 0.2s ease; /* Animación al pasar el ratón */
    display: block; /* Hace que ocupe toda la fila */
    width: 100%; /* Asegura que ocupa el 100% del contenedor */
}

.productos_menu_dia li:hover {
    transform: translateY(-5px); /* Efecto de elevación */
    box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2); /* Sombra más prominente */
}
.meal-item {
    display: flex;
    justify-content: space-between; /* Distribuye el contenido a lo largo de la fila */
    align-items: center; /* Centra verticalmente el contenido */
    width: 100%; /* Asegura que ocupa toda la fila */
}

.meal-item h5 {
    font-size: 18px !important; /* Aumenta el tamaño del texto */
    color: #333; /* Color oscuro para buena legibilidad */
    margin: 0;
    font-weight: bold;
    padding: 15px;
    display: flex;
    align-items: center;
}
.meal-item h5 label{
    margin: 0;font-weight: bold;cursor: pointer;
}


.meal-item .meal-info {
    flex-grow: 1; /* Asegura que el texto ocupa el máximo espacio disponible */
    font-size: 16px; /* Ajusta el tamaño del texto */
    color: #444;
    text-align: left; /* Alinea el texto a la izquierda */
    padding-right: 10px; /* Espaciado entre el texto y otros elementos */
}





/* RESPONSIVE CORRECCIONES */












/* Responsive para móviles */
@media (max-width: 768px) {
    .meal-item {
        flex-direction: column; /* En móviles, los elementos se apilan verticalmente */
        align-items: flex-start; /* Alinea los elementos al inicio */
    }

    .meal-item h5 {
        font-size: 16px; /* Ajusta el tamaño del texto para móviles */
    }

    .meal-item .meal-info {
        font-size: 14px; /* Reduce ligeramente el texto en móviles */
    }
}



