/* 

1. Add your custom Css styles below
2. Place the this code in your template: 

 <link href="css/custom.css" rel="stylesheet">


*/
body,
html,
p,
span,
div,
.misionvisionvalores,
a {
    font-family: 'Inter', 'Poppins', sans-serif !important;
    font-size: 15px;
}

.content {
    min-height: 1000px;
}

#mainMenu nav>ul>li {
    margin-left: 4px;
}

#mainMenu nav>ul>li>a {

    font-size: 15px;
    padding: 8px 10px;
}

/* Iconografía elegante - barra de menús: blanco y transparente, compacta */
#mainMenu nav ul li a i.fa,
#mainMenu .dropdown-menu li a i.fa,
#mainMenu .dropdown-submenu .dropdown-menu li a i.fa {
    font-family: 'FontAwesome' !important;
    /* Evitar herencia de Poppins desde fonts.css */
    color: rgba(255, 255, 255, 0.95) !important;
    margin-right: 6px;
    min-width: 16px;
    width: 16px;
    font-size: 14px;
    text-align: center;
    opacity: 0.95;
    display: inline-block !important;
    font-style: normal !important;
}

#mainMenu.inverted nav ul li>a i.fa,
#mainMenu .dropdown-menu li a i.fa {
    color: rgba(255, 255, 255, 0.95) !important;
}

#mainMenu .dropdown-menu {
    background: #e39630 !important;
    background-image: none !important;
    z-index: 9999;
    min-width: 300px !important;
    white-space: nowrap;
    border: 1px solid rgba(0, 0, 0, 0.08);
}

#mainMenu .dropdown-submenu>.dropdown-menu {
    min-width: 280px !important;
    background: #e39630 !important;
}

#mainMenu .dropdown-menu li a,
#mainMenu .dropdown-menu li a:hover,
#mainMenu .dropdown-submenu .dropdown-menu li a {
    color: #ffffff !important;
    white-space: nowrap;
    overflow: visible;
    background-color: transparent !important;
}

#mainMenu .dropdown-menu li a:hover,
#mainMenu .dropdown-submenu .dropdown-menu li a:hover {
    background-color: #f0b429 !important;
}

#mainMenu .dropdown-menu li a:hover i.fa {
    opacity: 1;
}

/* Ocultar flechas decorativas del tema (solo quedan las de Font Awesome) */
#mainMenu nav>ul>li .dropdown-submenu:before,
#mainMenu nav>ul>li .dropdown-submenu:after,
#mainMenu nav>ul>li .dropdown-submenu>.dropdown-menu:before,
#mainMenu nav>ul>li .dropdown-submenu>.dropdown-menu:after,
#mainMenu nav>ul>li.dropdown:before,
#mainMenu nav>ul>li.dropdown:after,
#mainMenu nav>ul>li .dropdown>.dropdown-menu:before,
#mainMenu nav>ul>li .dropdown>.dropdown-menu:after {
    display: none !important;
    content: none !important;
    background: none !important;
}

/* Flecha indicadora de submenú */
#mainMenu .dropdown-submenu>a .submenu-arrow,
#mainMenu .dropdown>a .submenu-arrow {
    float: right;
    margin-right: 0;
    margin-left: 8px;
    font-size: 14px;
    opacity: 1;
}

/* Flecha ADMINISTRACIÓN: visible solo en móvil, rota al expandir */
#mainMenu .dropdown>a .dropdown-arrow-mobile {
    display: none;
    float: right;
    margin-left: 8px;
    transition: transform 0.2s ease;
}

@media (max-width: 991px) {
    #mainMenu .dropdown>a .dropdown-arrow-mobile {
        display: inline-block !important;
    }

    body.mainMenu-open #mainMenu nav>ul>li.dropdown.hover-active>a .dropdown-arrow-mobile,
    .mainMenu-open #mainMenu nav>ul>li.dropdown.hover-active>a .dropdown-arrow-mobile {
        transform: rotate(180deg);
    }
}

/* Evitar corte de texto en menús largos */
#mainMenu nav>ul>li>a,
#mainMenu .dropdown-menu li>a {
    white-space: nowrap;
    overflow: visible;
    text-overflow: clip;
}

#mainMenu nav,
#mainMenu nav ul,
#mainMenu nav ul li {
    overflow: visible !important;
}

#mainMenu .acceder_menu a i.fa {
    display: inline-block !important;
    visibility: visible !important;
}

/* Forzar color naranja en barra de menú (override clase dark) */
#header.dark .header-inner,
#header.dark #header-wrap,
.dark #header .header-inner,
.dark #header #header-wrap {
    background-color: #e39630 !important;
    background: #e39630 !important;
}

/* Hover en menú padre: fondo amarillo visible (como la barra) */
#mainMenu nav>ul>li:hover>a,
#mainMenu nav>ul>li.hover-active>a,
#mainMenu nav>ul>li.current>a,
#mainMenu nav>ul>li:focus>a {
    background-color: #f0b429 !important;
    color: #ffffff !important;
}

#mainMenu nav>ul>li:hover>a i.fa,
#mainMenu nav>ul>li.hover-active>a i.fa {
    color: #ffffff !important;
    opacity: 1;
}

#header .container,
#header .header-inner .container {
    background-color: transparent !important;
    background: transparent !important;
}

/* Menú móvil: visible y con fondo naranja */
@media (max-width: 991px) {

    body.mainMenu-open #header .header-inner,
    body.mainMenu-open #header #header-wrap,
    .mainMenu-open #header .header-inner,
    .mainMenu-open #header #header-wrap {
        background-color: #e39630 !important;
        background: #e39630 !important;
    }

    body.mainMenu-open #mainMenu nav,
    .mainMenu-open #mainMenu nav {
        opacity: 1 !important;
        visibility: visible !important;
        -webkit-transform: translateY(0) !important;
        transform: translateY(0) !important;
    }

    body.mainMenu-open #mainMenu nav>ul>li>a,
    .mainMenu-open #mainMenu nav>ul>li>a {
        opacity: 1 !important;
        color: #ffffff !important;
        display: block !important;
        padding: 12px 20px !important;
        border-bottom: 1px solid rgba(255, 255, 255, 0.2);
    }

    body.mainMenu-open #mainMenu nav>ul>li>a i.fa,
    .mainMenu-open #mainMenu nav>ul>li>a i.fa {
        color: #ffffff !important;
        opacity: 1;
    }

    /* Dropdown colapsado: sin espacio, completamente oculto */
    body.mainMenu-open #mainMenu nav>ul>li:not(.hover-active)>.dropdown-menu,
    .mainMenu-open #mainMenu nav>ul>li:not(.hover-active)>.dropdown-menu,
    body.mainMenu-open #mainMenu nav>ul>li .dropdown-submenu:not(.hover-active)>.dropdown-menu,
    .mainMenu-open #mainMenu nav>ul>li .dropdown-submenu:not(.hover-active)>.dropdown-menu {
        max-height: 0 !important;
        overflow: hidden !important;
        padding: 0 !important;
        margin: 0 !important;
        opacity: 0 !important;
        visibility: hidden !important;
        border: none !important;
    }

    /* Dropdown expandido (solo cuando tiene hover-active) */
    body.mainMenu-open #mainMenu nav>ul>li.hover-active>.dropdown-menu,
    .mainMenu-open #mainMenu nav>ul>li.hover-active>.dropdown-menu,
    body.mainMenu-open #mainMenu nav>ul>li .dropdown-submenu.hover-active>.dropdown-menu,
    .mainMenu-open #mainMenu nav>ul>li .dropdown-submenu.hover-active>.dropdown-menu {
        max-height: 2000px !important;
        overflow: visible !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    body.mainMenu-open #mainMenu nav>ul>li>.dropdown-menu,
    .mainMenu-open #mainMenu nav>ul>li>.dropdown-menu {
        position: static !important;
        box-shadow: none;
        border: none;
        background: rgba(0, 0, 0, 0.15) !important;
        margin-left: 20px;
        margin-top: 0;
        margin-bottom: 8px;
        padding: 0 16px 8px !important;
    }

    body.mainMenu-open #mainMenu .dropdown-submenu>.dropdown-menu,
    .mainMenu-open #mainMenu .dropdown-submenu>.dropdown-menu {
        margin-left: 20px;
        background: rgba(0, 0, 0, 0.1) !important;
    }

    /* Submenús expandidos: visibles con max-height (compatible con tema) */
    body.mainMenu-open #mainMenu nav>ul>li.hover-active>.dropdown-menu,
    body.mainMenu-open #mainMenu nav>ul>li .dropdown-submenu.hover-active>.dropdown-menu,
    .mainMenu-open #mainMenu nav>ul>li.hover-active>.dropdown-menu,
    .mainMenu-open #mainMenu nav>ul>li .dropdown-submenu.hover-active>.dropdown-menu {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        max-height: 3000px !important;
        overflow: visible !important;
    }

    body.mainMenu-open #mainMenu .dropdown-menu li,
    .mainMenu-open #mainMenu .dropdown-menu li {
        display: block !important;
    }

    body.mainMenu-open #mainMenu .dropdown-menu li a,
    .mainMenu-open #mainMenu .dropdown-menu li a {
        color: #ffffff !important;
        padding: 10px 20px !important;
        display: block !important;
        opacity: 1 !important;
        visibility: visible !important;
    }

    body.mainMenu-open #mainMenu .dropdown-menu li a:hover,
    .mainMenu-open #mainMenu .dropdown-menu li a:hover {
        background-color: #f0b429 !important;
    }

    body.mainMenu-open #mainMenu nav>ul>li,
    .mainMenu-open #mainMenu nav>ul>li {
        display: block !important;
        float: none !important;
        margin: 0 !important;
        border: none !important;
    }
}

/*LETRAS ANIMADAS*/
@font-face {
    font-family: "Geist";
    src: url("https://pham.codes/d/GeistVF.woff2") format("woff2");

}

.p {
    font-family: "Geist";
    font-size: 70px;
    margin: 0;

    background-color: white;
    background-image: gradient(0deg, #fff 70%, white);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
    -moz-background-clip: text;
    -moz-text-fill-color: transparent;
    filter: drop-shadow();

    --wght-min: 32;
    --wght-max: 240;
}

.p>span {
    animation: breath 1.5s alternate cubic-bezier(0.37, 0, 0.63, 1);
    animation-iteration-count: infinite;
    animation-delay: 1s;
    animation-fill-mode: both;
    color: white;

}

@keyframes breath {
    0% {
        font-variation-settings: "wght" var(--wght-min);
    }

    100% {
        font-variation-settings: "wght" var(--wght-max);
    }
}

/* Setup */

.container_texto {
    display: flex;
    justify-content: center;
    align-items: center;
    height: 100%;
}

/*LETRAS ANIMADAS*/
.nuestra_historia,
.mision,
.vision,
.valores {
    font-size: 21px;
    line-height: 33px;
}

.form-control:disabled,
.form-control[readonly] {
    background: rgb(233, 233, 233);
}

.form-control {
    border: 1px solid rgb(202, 202, 202);
}

select {
    -webkit-appearance: auto;
    -moz-appearance: auto;
    appearance: auto;
}

.btncrese {
    line-height: 18px;
    background: #ad7f00;
    padding: 10px;
    border-radius: 7px;
    color: white !important;
    width: 100%;
    display: block;
    text-align: center;
    border: none;
    font-size: 12px;
}

.btncrese:hover {
    background: #e0a500;
}

.btncrese_rojo {
    line-height: 18px;
    background: #a10b00;
    padding: 10px;
    border-radius: 7px;
    color: white !important;
    width: 100%;
    display: block;
    text-align: center;
    border: none;
    font-size: 12px;
}

.btncrese_rojo:hover {
    background: #630000;
}

.misionvisionvalores {
    display: flex;
}

.mensaje_correo_agenda {
    background: #280202d6;
    position: absolute;
    padding: 10px;
    border-radius: 7px;
    display: none;
}

.contiene_mision {

    flex: 1;
    height: 400px;
    border: 1px solid rgb(255, 255, 255);
    background-image: url(../imagenes/misionvision/mision.jpg);
    background-size: cover;
    background-position: center;
}

.contiene_mision p {
    font-size: 25px;
    color: black;

}

.contiene_mision h2 {
    color: #112d58 !important;
}

.contiene_vision {

    flex: 1;
    height: 400px;
    border: 1px solid rgb(255, 255, 255);
    background-image: url(../imagenes/misionvision/vision.png);
    background-size: cover;
    background-position: center;
}

.contiene_vision p {
    font-size: 25px;
    color: black;

}

.contiene_vision h2 {
    color: #112d58 !important;
}

.cuadro_transparente {

    background: #adadad96;
    height: 400px;
    width: 100%;
    padding: 40px 20px 0px 20px;

}

.cuadro_transparente:hover {
    background: #353535d4;
    height: 400px;
    width: 100%;
    padding: 40px 20px 0px 20px;
    padding-top: 70px;
    transition: padding-top 0.3s ease;

}

/*AGENDA*/
.descargaporcorreo {
    overflow: hidden;
    text-align: center;

    background: #00132a;
    background-image: repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(255, 255, 255, 0.02) 5px, rgba(255, 255, 255, 0.02) 10px), repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(255, 255, 255, 0.02) 5px, rgba(255, 255, 255, 0.02) 10px);
    background-size: 100px 100px;
    padding: 5px;

}

.formulario {
    max-width: 600px;
    width: 100%;
    margin: 0 auto;
    border-radius: 7px;
    overflow: hidden;

}

.formulario .foto {
    width: 30%;
    min-height: 280px;
    float: left;
    background: white;

}

.formulario img {
    width: 100%;
}

.formulario .contenido {
    width: 70%;
    float: left;
    border: 1px solid white;
    text-align: left;
    height: 280px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    padding: 10px;
    background: #ffe7e7;
}

.formulario .texto {
    border-radius: 7px;
    border: 1px solid gray;
    margin-bottom: 2px;
}

.formulario .boton {
    margin-top: 5px;
}

.formulario .btncrese {
    width: 200px;
    float: left;
}

/*AGENDA*/
/*SERVICIOS*/
.servicios_ {
    width: 100%;
    border: 5px solid #ffbfbf;
    padding: 10px;
    transition: all 0.3s ease;
    /* Agregamos una transición suave de 0.3 segundos */
    margin-top: 10px;
}

.servicios_:hover {
    width: 110%;
    border: 7px solid #ffbfbf;
    background: rgb(255, 225, 225);
}

/*SERVICIOS*/
/*TESTIMONIAL*/
.white-box {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 80%;
    /* Ajusta el tamaño del recuadro blanco */
    height: 100%;
    /* Ajusta el tamaño del recuadro blanco */
    background-color: rgba(255, 255, 255, 0.041);
    /* Color de fondo del recuadro blanco */
    transform: translate(-50%, -50%) rotate(-45deg);
    /* Inclina el recuadro */
}

.testimonial_img {
    height: 120px !important;
    width: 120px !important;
    border-radius: 7px !important;

}

/*TESTIMONIAL*/
/*VIDEOS YOUTUBE*/
.videocrese {
    background: rgb(0, 17, 36);
}

.videocrese .descripcion {
    font-size: 20px;
    color: white;
}

.contiene_video_youtube {
    width: 100%;
    overflow: hidden;
    padding: 20px;
}

.contiene_video_youtube .imagen {
    height: 270px;
    width: 100%;
    position: relative;
    /* Añadimos esta propiedad para establecer un contexto de posición */

}

.contiene_video_youtube .imagen img {
    position: absolute;
    /* Establecemos la posición absoluta para la imagen */
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    object-fit: cover;
    /* Hacemos que la imagen cubra el contenedor */
    border-radius: 7px;
}

.contiene_video_youtube h2 {
    font-size: 16px;
    text-align: center;
}

/*VIDEOS YOUTUBE*/
/*VIDEO INDIVIDUAL*/
.lista {
    border-radius: 7px;
}

.contiene_lista_videos {
    width: 100%;
    border: 1px solid rgb(85, 85, 85);
    margin-bottom: 5px;
    overflow: hidden;
    padding: 5px;
}

.contiene_lista_videos .video {

    float: left;
    width: 40%;
}

.contiene_lista_videos .contenido {

    float: left;
    width: 60%;
    padding: 6px;
}

.container_video {
    overflow: hidden;
    background: rgb(1, 16, 34);
}

.izquierda_video {
    float: left;
    width: 70%;
    padding: 20px;
    background: rgb(3, 4, 24);
}

.izquierda_video h2 {
    font-size: 20px;
}

.izquierda_video .descripciones {
    color: rgb(168, 168, 168);
}

.derecha_video {
    float: right;
    width: 30%;
    padding: 20px;
    background: rgb(3, 4, 24);
}

.derecha_video h2 {
    padding: 7px;
    color: white;
    font-size: 16px;

}

.derecha_video .lista {
    padding: 7px;
    color: white;
    background: #00132a;
    background-image: repeating-linear-gradient(45deg, transparent, transparent 5px, rgba(255, 255, 255, 0.02) 5px, rgba(255, 255, 255, 0.02) 10px), repeating-linear-gradient(-45deg, transparent, transparent 5px, rgba(255, 255, 255, 0.02) 5px, rgba(255, 255, 255, 0.02) 10px);
    background-size: 100px 100px;
}

.derecha_video .lista h4 {
    font-size: 12px;
}

.derecha_video .lista .descripcion {
    font-size: 11px;
    line-height: 15px;
}

/*VIDEO INDIVIDUAL*/
/*LISTA DE TALLERES*/
.contenedor_talleres {
    text-align: center;
    background: black;
    padding: 30px;
    background: linear-gradient(to bottom right, #0c0000 50%, #000113 50%);
    border-top: 6px solid #275B9C;
}

.contenedor_talleres h2 {
    color: white;
}

.contiene_talleres {
    max-width: 800px;
    width: 100%;
    padding: 10px;
    margin: 0 auto;
    border: 1px solid rgb(155, 155, 155);
    background: #d7d7d7;
    border-radius: 7px;
    margin-bottom: 10px;
}

.contiene_talleres:hover {
    transform: scale(1.1);
    transition: transform 0.3s ease;
}

.taller {
    padding: 10px;
    border: 1px solid white;
    text-align: left;
    overflow: hidden;
    background: white;
}

.taller .foto {
    max-width: 100px;
    width: 30%;
    height: 100px;
    border-right: 1px solid rgb(114, 114, 114);
    float: left;
}

.taller .contenido {
    max-width: 650px;
    width: 70%;
    float: left;

}

.taller .titulo {
    font-weight: bold;
    font-size: 18px;
    padding-left: 10px;
    color: rgb(172, 172, 172);
}

.taller .titulo a {

    color: blue;
}

.taller .descripcion {
    margin-top: 10px;
    padding-left: 10px;
    color: rgb(172, 172, 172);
}

.especialista_video {
    padding: 10px;
    text-align: left;
    overflow: hidden;
    border: none;
    background: #09091e;
}

.especialista_video .titulo {
    font-weight: bold;
    font-size: 18px;
    padding-left: 10px;

}

.especialista_video a {

    color: rgb(27, 49, 248);
}

.form_preguntas .ac-item {
    border: 1px solid rgb(32, 32, 32);
}

.form_preguntas {
    width: 100%;
    padding: 15px;
}

.form_preguntas .pregunta {
    width: 100%;
}

.form_preguntas textarea {
    width: 80%;
}

/*LISTA DE TALLERES*/
/*TALLER INDIVIDUAL*/
.contiene_videos_individual {
    max-width: 500px;
    width: 100%;
    padding: 5px;
}

.contiene_videos_individual .contenedor {
    overflow: hidden;
    padding: 5px;
    background: rgb(241, 241, 241);
    margin-top: 5px;
}

.contiene_videos_individual .foto {
    float: left;
    width: 25%;
    padding: 5px;
}

.contiene_videos_individual .contenido {
    float: left;
    width: 75%;
    padding: 5px;
}

.contiene_videos_individual .titulo h2 {
    font-weight: bold;
    font-size: 16px;
}

.contiene_videos_individual .foto img {
    width: 100%;
}

/*TALLER INDIVIDUAL*/
/*CONTACTO*/
.t_ubicacion {
    background: linear-gradient(45deg, rgba(255, 69, 0, 0.3) 10%, transparent 10%, transparent 20%, rgba(255, 69, 0, 0.3) 20%, rgba(255, 69, 0, 0.3) 30%, transparent 30%, transparent 40%, rgba(255, 69, 0, 0.3) 40%, rgba(255, 69, 0, 0.3) 50%, transparent 50%, transparent 60%, rgba(255, 69, 0, 0.3) 60%, rgba(255, 69, 0, 0.3) 70%, transparent 70%, transparent 80%, rgba(255, 69, 0, 0.3) 80%, rgba(255, 69, 0, 0.3) 90%, transparent 90%);

}

.covernegro {
    background: #000000c4;
}

.covernegro .container {
    background: #d98f07;
    padding: 50px;
    border-radius: 7px;
}

#section7 {
    border-top: 6px solid #275B9C;
    padding: 0px;
    background: black;
    background-position: 71% 22%;
    background-size: cover;
    background-position: center;
    background-attachment: fixed;
    /* Añadir el efecto de parallax */
}

#section7 h2,
#section7 p,
#section7 address,
#section7 h4 {
    color: white;
}

/*PREGUNTAS Y RESPUESTAS*/
.pregunta {
    font-weight: bold;
    font-size: 15px;
    margin-top: 8px;
}

.respuesta {
    font-size: 13px;
    color: rgb(70, 70, 70);
    margin-top: 8px;
}

.contiene_talleres_toggle {
    border: 1px solid rgb(219, 219, 219);
    padding: 10px;
}

.ac-title_ {
    overflow: hidden;
}

.img-container {
    width: 50px;
    height: 50px;
    float: left;
    overflow: hidden;
    border-radius: 7px;
}

.img-container img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.titulo-container {
    width: 80%;
    height: 50px;
    float: left;
    display: flex;
    align-items: center;
    padding-left: 10px;

}

.contiene_videos_toggle {
    border: 1px solid rgb(219, 219, 219);
    padding: 10px;
}

.ac-content_preguntas {
    border: 1px solid rgb(219, 219, 219);
    padding: 10px;
}

/*PREGUNTAS Y RESPUESTAS*/
/*CONTACTO*/
/*PIEPAGINA*/
.footer-content {
    background: #e39630;
}

.redessociales {
    display: inline-block;
    float: none !important;
}

.copyright-content {
    background: #995200d4 !important;
    color: white;
}

/*PIEPAGINA*/
/* MENU TACOS INDEX*/
.container1 img {
    max-width: 100%;
    height: auto;
}

.container1 ul,
ol {
    list-style-type: none;
}

@media (min-width:768px) {
    .container1 {
        width: 900px;
    }

}

.container1 {

    font-family: 'Exo 2', sans-serif !important;
    font-family: 'Inter', sans-serif !important;
    margin: 10px auto;
    position: relative;
    overflow: hidden;
    margin-top: 100px;
}

.container1 .nombre {
    font-size: 16px;
    font-weight: bold;
    margin-top: 20px;
}

.container1 .page-title {
    margin: 17px auto;
    text-align: center;
    color: #fff;
    font-size: 17px;
}

.container1 .page-title h1 {
    font-size: 40px;
    line-height: 1;
}

.container1 .page-title a {
    color: #ff7777;
    text-decoration: none;
}

.container1 .page-title a:hover {
    text-decoration: underline;
    color: #ff3333;
}

.container1 .circle-menu-box {
    width: 100%;
    height: 800px;
    position: relative;
    margin: 0px 0px 200px 0px;
}

.container1 .circle-menu-box a.menu-item {
    display: block;
    text-decoration: none;
    border-radius: 100%;

    text-align: center;
    width: 200px;
    height: 200px;

    color: #777;

    line-height: 1;
    position: absolute;
    font-size: 30px;

    transition: all 0.5s;
    -moz-transition: all 0.5s;
    -webkit-transition: all 0.5s;
    -o-transition: all 0.5s;
}

.container1 .circle-menu-box a.menu-item:hover {
    transform: scale(1.5);
    -webkit-transform: scale(1.5);
    -moz-transform: scale(1.5);
    -o-transform: scale(1.5);
    color: #800000;

}

.container1 .circle-menu-box a.menu-item img {
    border-radius: 50%;
    width: 200px;
    height: 200px;
}

/* MENU TACOS INDEX*/
/*PAGO TARJETA*/
.contienepagotarjeta .card-header h3 {

    color: white;
}

.imagenbanco {
    display: inline-block;
    height: 20px;
    margin-right: 5px;
}

.botonpagarconekta {
    background: #143761 !important;
    color: white !important;
    width: 100% !important;
    border: none;
    border-radius: 7px;
    padding: 10px;
    font-size: 15px;
    cursor: pointer;
}

.botonpagarconekta:hover {
    background: #0f2d52 !important;
}

/*FIN PAGO TARJETA*/

/*FIN CARRUCEL*/

.submit_boton {
    padding: 15px !important;
    color: white !important;
    border: none !important;
    border-radius: 7px !important;
    font-size: 14px !important;
    display: inline-block !important;
    width: 300px !important;
}

.product-price {
    width: 45% !important;
}

/*BLOG*/
.contiene_borrarcomentario {
    height: 20px;
}

.borrar_comentario {
    float: right;
}

#page-content-importantes {
    padding: 0px;
}

.grid-articles .post-entry_p {
    width: 24.5%;
    margin-left: 0.25%;
    margin-top: 0.5%;
}

.grid-articles .post-entry {
    width: 24.5%;
    margin-left: 0.25%;
    margin-top: 0.25%;
}

/*END BLOG*/

/*personalizable*/
.container {
    word-wrap: break-word;
}

.naranja #header .header-inner,
.naranja #header #header-wrap,
#header.naranja .header-inner,
#header.naranja #header-wrap {
    background-color: #FFA500 !important;
    color: white;
}

.naranja #mainMenu nav>ul>li>a,
#mainMenu.naranja nav>ul>li>a {
    color: #ffffff !important;
}

.negro #mainMenu nav>ul>li .dropdown-menu {
    background-color: #2f2f2f !important;
    ;
    border: none;
}

.negro #header .header-inner,
.negro #header #header-wrap,
#header.negro .header-inner,
#header.negro #header-wrap {
    background-color: #2f2f2f !important;
    color: white;
}

.negro #mainMenu nav>ul>li>a,
#mainMenu.negro nav>ul>li>a {
    color: #ffffff !important;
}

.negro .lines,
.negro .lines:after,
.negro .lines:before {
    background-color: #fff;
}

.negro #mainMenu:not(.menu-overlay) nav>ul>li .dropdown-menu>li [class*=col-]>ul>li>a,
.negro #mainMenu:not(.menu-overlay) nav>ul>li .dropdown-menu>li>a,
.negro #mainMenu:not(.menu-overlay) nav>ul>li .dropdown-menu>li>span {
    color: white !important;
    background-color: #2f2f2f !important;
}

.azul #mainMenu nav>ul>li .dropdown-menu {
    background-color: #2474bb !important;
    border: none;
}

.azul #header .header-inner,
.azul #header #header-wrap,
#header.azul .header-inner,
#header.azul #header-wrap {
    background-color: #2474bb !important;
    color: white !important;
}

.azul #mainMenu nav>ul>li>a,
#mainMenu.azul nav>ul>li>a {
    color: #ffffff !important;
}

.azul .lines,
.azul .lines:after,
.azul .lines:before {
    background-color: #fff !important;
}

.azul #mainMenu:not(.menu-overlay) nav>ul>li .dropdown-menu>li [class*=col-]>ul>li>a,
.azul #mainMenu:not(.menu-overlay) nav>ul>li .dropdown-menu>li>a,
.azul #mainMenu:not(.menu-overlay) nav>ul>li .dropdown-menu>li>span {
    color: white !important;
    background-color: #2474bb !important;
}

.verde #header .header-inner,
.verde #header #header-wrap,
#header.verde .header-inner,
#header.verde #header-wrap {
    background-color: green;
    color: white;
}

.verde #mainMenu nav>ul>li>a,
#mainMenu.verde nav>ul>li>a {
    color: #ffffff;
}

.verde .lines,
.verde .lines:after,
.verde .lines:before {
    background-color: #fff;
}

.verde #mainMenu:not(.menu-overlay) nav>ul>li .dropdown-menu>li [class*=col-]>ul>li>a,
.verde #mainMenu:not(.menu-overlay) nav>ul>li .dropdown-menu>li>a,
.verde #mainMenu:not(.menu-overlay) nav>ul>li .dropdown-menu>li>span {
    color: white !important;
    background-color: green !important;
}

/*personalizable fin*/

.busqueda,
.clasificacion_altas {
    border: 1px solid #a1a1a1;
    border-radius: 4px;
}

.btnbuscar {
    margin-bottom: 2px !important;
}

.fondonegro {
    background: black;
}

.logo-height {
    max-width: 300px;
    width: 100%;
}

.logo-height2 {
    max-height: 150px;
}

.pie-height {
    max-height: 300px;
}

/*PRODUCTO*/
.imagenproduc {
    width: 70px;
}

.tags {
    /*    border: 1px solid #ced5fc;*/
    border-radius: 7px;
    padding: 4px;
    margin-left: 4px;
}

.link-to-top-whatsapp {
    position: fixed;
    bottom: 10px;
    left: 10px;
    width: 70px;
    height: 70px;
    line-height: 70px;
    text-align: center;
    color: rgba(0, 0, 0, .2);
    font-size: 48px;
}

.circulo {
    width: 30px;
    height: 30px;
    -moz-border-radius: 50%;
    -webkit-border-radius: 50%;
    border-radius: 50%;

    display: inline-block;
}

.circulo_colores {
    display: block;
    list-style: outside none none;
    margin: 10px;
    overflow: hidden;
    padding-left: 0;
}

.circulo_colores li {
    border: 1px solid #bbbbbb;
    margin: 3px;
}

.circulo_colores li label span {
    cursor: pointer;
    display: block;
    font-size: 1.2em;
    font-weight: 400;
    height: 30px;
    width: 30px;
    line-height: 37px;
    margin: 0;
    text-align: center;
    -webkit-transition: all 0.3s ease 0s;
    transition: all 0.3s ease 0s;
}

.circulo_colores li label input {
    left: -9000px;
    position: absolute;
}

.circulo_colores li label span {

    color: #909090;
}

.circulo_colores li label input:checked+span {
    background-color: rgba(0, 0, 0, 0.18);
}

.linkindex li {
    display: inline-block;
    border: 4px solid #191919;
}

.error {
    color: red;
}

.exitoso {
    color: rgb(35, 177, 0);
}

.atributos_productos {
    border: 1px solid #d8d8d8;
    padding: 10px;
    border-radius: 7px;
    overflow: hidden;
}

#todaslasvariaciones {
    margin-top: 10px;
    overflow: hidden;

}

.seleccionavariacion {
    font-size: 18px;

}

.descripcion_variaciones {
    color: #004580;
    border: 1px solid rgb(214, 214, 214);
    border-radius: 7px;
    padding: 7px;
    font-size: 15px;
    cursor: pointer;
    margin-top: 10px;
    text-transform: capitalize;
    display: block;

}

.descripcion_variaciones:hover {
    text-decoration: underline;
}

.mensaje_variaciones {
    font-size: 20px;
}

/*FIN PRODUCTO*/
#mensaje_e {
    color: red;
}

.mensaje_error {
    color: red;
    border: 1px solid red !important;
}

.mensaje_exitoso {
    border: 1px solid green;
}

#imagen {
    width: 150px;
}

.imagenes_temporales {
    height: 100px;
    cursor: move;
}

#cargando {
    display: none;
}

.contiene_imagen_adicional {
    float: left;
    margin-left: 30px;
    margin-top: 30px;
    text-align: center;
}

.barra_eliminar_foto {
    width: 100%;
    height: 30px;
    margin-top: 20px;
    cursor: pointer;
    color: blue;
}

.barra_eliminar_foto:hover {
    color: red;
    font-weight: bold;
}

.productos_segmento {
    float: left;
    width: 50%;
    background: #fcfcfc;
    padding: 20px;
}

.col-lg-20_ {
    width: 100%;
}

.clasificacion_altas {
    width: 200px;
}

/*colores*/
.txt_color {
    width: 100%;
}

.contiene_colores {
    display: flex;
    flex-wrap: wrap;

}

.color_item {
    display: flex;
    flex: 1;
    height: 50px;
    border: 1px solid #e7e7e7;
    justify-content: center;
    align-items: center;
    cursor: pointer;
}

.verde {
    background: #00913f !important;
    color: white !important;
}

.rojo {
    background: #AE2029 !important;
    color: white !important;
}

.azul {
    background: #0000FF !important;
    color: white !important;
}

.amarillo {
    background: #FFFF00 !important;
    color: green !important;
}

.naranja {
    background: #FFA500 !important;
    color: white !important;
}

.negro {
    background: black !important;
    color: white !important;
}

.gris {
    background: #2f2f2f !important;
    color: white !important;
}

.blanco {
    background: white !important;
    color: black !important;
}

.salmon {
    background: rgb(238, 92, 88) !important;
    background: -moz-linear-gradient(90deg, rgba(238, 92, 88, 1) 0%, rgba(237, 106, 80, 1) 35%, rgba(245, 120, 101, 1) 100%) !important;
    background: -webkit-linear-gradient(90deg, rgba(238, 92, 88, 1) 0%, rgba(237, 106, 80, 1) 35%, rgba(245, 120, 101, 1) 100%) !important;
    background: linear-gradient(90deg, rgba(238, 92, 88, 1) 0%, rgba(237, 106, 80, 1) 35%, rgba(245, 120, 101, 1) 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ee5c58", endColorstr="#f57865", GradientType=1) !important;
    color: white !important;
}

.salmon label,
.salmon p,
.salmon h2,
.salmon h4 {

    color: white !important;
}

.dorado {
    background: rgb(171, 129, 0);
    background: -moz-linear-gradient(90deg, rgba(171, 129, 0, 1) 0%, rgba(168, 134, 7, 1) 35%, rgba(228, 184, 69, 1) 100%) !important;
    background: -webkit-linear-gradient(90deg, rgba(171, 129, 0, 1) 0%, rgba(168, 134, 7, 1) 35%, rgba(228, 184, 69, 1) 100%) !important;
    background: linear-gradient(90deg, rgba(171, 129, 0, 1) 0%, rgba(168, 134, 7, 1) 35%, rgba(228, 184, 69, 1) 100%) !important;
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#ab8100", endColorstr="#e4b845", GradientType=1) !important;
    color: white !important;
}

.dorado label,
.dorado p,
.salmon h2,
.dorado h4,
.dorado h2 {

    color: white !important;
}

.rosa {
    background: #FFC0CB;
    color: black;
}

/*clasificaciones*/
.content_clasificaciones {
    padding: 20px;

}

.nombre_clasificacion {
    width: 30%;
    min-width: 500px;
    margin: 0 auto;
}

.clasificaciones_atributos {
    background: #eeeaea;
    ;
    width: 30%;
    padding: 20px;
    margin: 0 auto;
}

.check_atributos {
    padding: 5px !important;
}

.altura35 {
    min-height: 35px;
    width: 70%;

}

.margin-top30 {
    margin-top: 30px;

}

.vercarritocolor {
    display: inline-block !important;
    margin-left: 10px;
    width: 25px;
    height: 25px;
}


/*ticket*/

.t_contiene_ticket {
    text-align: center;

    padding: 10px;

}

.t_centrado {
    display: inline-block;

    padding: 10px;
    width: 750px;
    border: 1px solid rgb(189, 189, 189);
}

.t_titulo {
    background: #000000;
    color: white;
    font-weight: bold;
    text-align: left;
    margin-top: 10px;
    padding: 5px;

}

.t_datos_personales {
    display: flex;
}

.t_datos_contacto_principal {
    flex: 1;

}

.t_datos_contacto_secundario {
    flex: 1;
    padding-left: 10px;
}

.t_datos {
    text-align: left;
}

#t_logo {
    height: 100px;
}

.t_imgright {
    text-align: right;
}

.t_datos_fecha {
    text-align: right;
    padding: 30px;
    padding-right: 15px;
}

.seccion {
    overflow-x: auto;
}

.t_seccion {
    width: 100%;
    display: flex;
    text-align: center;
    padding: 20px;
}

.t_deposita {
    flex: 1;
}

.t_deposita img {
    width: 80%;
    padding-bottom: 6px;

}

.t_deposita_d {
    width: 170px;
    display: inline-block;
    text-align: left;
}

.t_cantidad {
    width: 50px;
}

.t_precio {
    width: 120px;
}

.t_total {
    width: 120px;
}

/*DETALLES DATOS FISCALES*/
.container_datosfiscales {
    display: flex;
    flex-wrap: wrap;
    max-width: 800px;
    margin: auto;
    padding: 20px;
    border: 1px solid #ddd;
    border-radius: 8px;
    background-color: #f9f9f9;
}

.container_datosfiscales .item {
    flex: 1 1 45%;
    margin: 10px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 4px;
    background-color: #fff;
}

.container_datosfiscales .item label {
    font-weight: bold;
}

/*MOVIMIENTOS PEDIDOS DETALLES*/
#cerrar_detalle {
    width: 100%;
    text-align: right;
}

.serie {
    width: 100px;
}

.formapago {
    width: 150px;
}

.fechapedido {
    width: 155px;
}

th {
    color: #515efc;
    background: #F7F9FB;
}

#cerrar_icon {
    padding: 3px 10px 3px 10px;
    color: white;
    background: #adadad;
    cursor: pointer;
    display: inline-block;
}

.detalles {
    padding: 20px;
    width: 100%;

    z-index: 2000;
    display: none;
    border: 1px solid #d3d3d3;
    padding: 15px;
}

#informacion_detalles {

    height: auto;
    overflow-x: hidden;
    padding: 10px;
}

/*TABLAS*/

tr:nth-child(odd) {
    background-color: #f2f2f2;

}

tr:nth-child(even) {
    background-color: #fbfbfb;
}

/*PEDIDOS*/
.seccion_buscador {

    height: 100px;

}

.selects_busquedapedido {
    width: auto;
}

.boton_pedido {
    margin-bottom: 0px !important;
}

#enviando {
    display: none;
    height: 50px;
}

/*tienda*/
.cantidad_producto {
    padding: 5px 5px 5px 15px;
    border: 1px solid rgb(170, 170, 170);
}

.product .product-title {
    max-width: 100%;
    width: 100%;
}

.product .product-title h3 {
    font-weight: bold;
    font-size: 22px;
}

.product .product-title h4 {
    font-weight: 100;
    font-size: 16px;
}

.product2 {
    border-bottom: 1px solid rgb(207, 207, 207);
}

.product2 .product-image {
    height: 100% !important;
    padding: 10px;
}

.product2 .product-image img,
.product2 .product-image>a {

    text-align: center;
    height: 90%;
}

.product2 .product-description {
    text-align: center !important;
}

.grid-item {
    min-height: 400px !important;
}

.product-image {
    height: 250px !important;
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
    overflow: hidden;
}

.product-image img {
    width: 100%;
    /* Ancho de la imagen al 100% del div */
    height: 100%;
    /* Alto de la imagen al 100% del div */
    object-fit: cover;
    /* Zoom para cubrir todo el espacio del div */
}

.product .product-price {
    float: none;
    margin-bottom: 0;
    margin-top: 0px;
    text-align: center;
    width: 100% !important;
}

.product-price2 {
    margin-top: 10px;
    margin-bottom: 10px;
    font-weight: bold;
    font-size: 25px;
    color: rgb(0, 89, 255);
    text-align: left;
    width: 100% !important;
}

.product .product-price ins {
    font-size: 20px !important;
    color: rgb(179, 80, 0);
}

.btncarrito {
    background: #e39630;
    padding: 10px;
    border-radius: 7px;
    color: white !important;
    width: 100%;
    display: block;
    text-align: center;
}

.btncarrito:hover {
    background: #cc6e02;

}

#price-from,
#price-to {
    line-height: 18px;
    padding: 10px 16px;
    min-height: 40px;
    font-size: .9rem;
    width: 48.5%;
    border: 1px solid #c6c6c6;
    border-radius: 3px;
}

/*MENSAJE CARRRITO*/
.centrar_desplegar_informacion {

    width: 100%;
    height: 100%;
    position: fixed;
    top: 0px;
    z-index: 20 !important;
    background: rgba(0, 0, 0, 0.747);
    display: flex;
    align-items: center;
    display: none;

}

.desplegar_informacion {

    margin: auto;
    width: 400px;
    height: auto;
    overflow: hidden;
    background: white;
    border: 1px solid rgb(192, 192, 192);
    text-align: center;
    border-radius: 7px;


}

.desplegar_informacion .info_producto_agregado {
    padding: 20px;
}

.desplegar_informacion .boton {
    margin-top: 30px;
    margin-bottom: 30px;

    text-align: center;
}

.desplegar_informacion .imagen {
    margin-top: 30px;
    margin-bottom: 30px;
    text-decoration: none;
}

.desplegar_informacion a {
    margin: 0 auto;
    width: 300px !important;
    padding: 20px;
    background: rgb(194, 103, 0);
    color: white;
    border-radius: 7px;
    cursor: pointer;
    margin-top: 5px;
    text-decoration: none;
}

.desplegar_informacion a:hover {
    background: rgb(216, 148, 0);
}

/*MENSAJE CARRRITO*/
/*NAV*/

.navclasificaciones {
    float: left !important;
    margin-left: 40px;
    border-radius: 7px;
}

#mainMenu nav>ul>li>a {

    text-transform: inherit !important;
}

.todaslasclasificaciones {

    overflow: hidden;
    width: auto;
    display: flex;
    top: 0;
    line-height: 30px !important;
}

.titulo_submenu {
    border-bottom: 1px solid #9c9c9c;
    margin-bottom: 5px;
    line-height: 30px;
    color: #931d83;
    font-size: 17px;
}

.titulosubmenu {
    font-weight: bold;
    font-size: 14px;


}

.titulosubmenu a {
    color: gray !important;

}

.titulosubmenu_vermas {
    font-weight: bold;
    font-size: 14px;
    color: #931d83;

}

.titulo_submenu_hijo {
    padding-left: 10px;
    color: gray;
}

.titulo_submenu_hijo a {

    color: gray !important;
}

.todaslasclasificaciones_div {
    min-width: 300px;
    min-height: 100px;
    margin-top: 7px;
    margin-bottom: 30px;
    flex: 1;

}

.contiene_metodospago {
    background: red;
    height: 100px;
}

.pagos {
    float: left;
    border: none;
    height: 60px;
    width: 200px;
    text-align: center;
    background: white;
    margin: 5px;
    font-size: 17px !important;
    line-height: 0px !important;
    padding: 0px !important;
    min-height: 0px !important;
    border: 1px solid #a29e9e;
    border-bottom: 3px solid #7b7b7b;
    border-right: 3px solid #7b7b7b;

}

.pagos:hover {
    background: #e6e6e6;
}

/*BARRA DE MENUS*/

#topbar {
    background: rgb(0, 3, 31) !important;
    border: 1px solid rgb(46, 46, 46);
}

#topbar .top-menu>li>a {
    color: #ffffff;
}

.header-inner {
    height: auto !important;
}

#header {
    background: #e39630;
    min-height: 80px;
    height: auto !important;
}

/* Barra de menús en escritorio - vista distribuidor/administración */
@media (min-width: 992px) {

    /* Header full-width para que quepan todos los elementos */
    #header .header-inner .container,
    #header #header-wrap .container {
        max-width: 100% !important;
        padding-left: 20px !important;
        padding-right: 20px !important;
        position: relative !important;
    }

    #header .header-inner,
    #header #header-wrap {
        display: flex !important;
        align-items: center !important;
        min-height: 70px !important;
        height: auto !important;
        padding: 8px 0 !important;
    }

    #header .header-inner .container,
    #header #header-wrap .container {
        display: flex !important;
        align-items: center !important;
        justify-content: center !important;
        flex-wrap: wrap !important;
        width: 100% !important;
    }

    /* Logo centrado junto con el menú */
    #header #logo {
        flex-shrink: 0 !important;
        margin-right: 15px !important;
    }

    #header #logo img {
        max-height: 65px !important;
        height: 65px !important;
        width: auto !important;
    }

    /* Menú centrado junto con el logo (sin flex:1 para que el bloque se centre) */
    #mainMenu {
        flex: 0 1 auto !important;
        min-width: 0 !important;
        display: flex !important;
        justify-content: center !important;
    }

    #mainMenu>.container {
        width: 100% !important;
        max-width: none !important;
        display: flex !important;
        justify-content: center !important;
    }

    #mainMenu nav {
        float: none !important;
        flex-wrap: wrap !important;
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
    }

    #mainMenu nav>ul {
        display: flex !important;
        flex-wrap: wrap !important;
        justify-content: center !important;
        align-items: center !important;
        margin: 0 !important;
        padding: 0 !important;
        gap: 0 2px !important;
    }

    #mainMenu nav>ul>li {
        float: none !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    /* Elementos más compactos para que quepan todos al iniciar sesión */
    #mainMenu nav>ul>li>a {
        padding: 6px 8px !important;
        font-size: 12px !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
    }

    #mainMenu nav>ul>li>a i.fa {
        font-size: 13px !important;
        margin-right: 4px !important;
    }

    /* Ocultar flecha móvil en escritorio */
    #mainMenu .dropdown>a .dropdown-arrow-mobile {
        display: none !important;
    }

    /* Dropdowns visibles y bien posicionados en escritorio */
    #mainMenu .dropdown-menu {
        position: absolute !important;
        top: 100% !important;
        left: 0 !important;
        margin-top: 0 !important;
        box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15) !important;
    }

    #mainMenu .dropdown-submenu>.dropdown-menu {
        left: 100% !important;
        top: 0 !important;
        margin-left: 0 !important;
    }
}

#header.header-sticky.sticky-active #header-wrap,
#header.header-sticky.sticky-active .header-inner {
    background: #e39630;
    background-size: 100px 100px;
}

#mainMenu nav>ul>li>a {
    color: white;
}

#header .container {

    background: #e39630;
}

#mainMenu.menu-outline nav>ul>li.current>a,
#mainMenu.menu-outline nav>ul>li:focus>a,
#mainMenu.menu-outline nav>ul>li:hover>a {
    color: #ffd29b;
    border-color: #fda73c;
    background-color: transparent;
}

#mainMenu.dark.menu-outline nav>ul>li.current>a,
#mainMenu.dark.menu-outline nav>ul>li:focus>a,
#mainMenu.dark.menu-outline nav>ul>li:hover>a,
.dark:not(.submenu-light) #mainMenu.menu-outline nav>ul>li.current>a,
.dark:not(.submenu-light) #mainMenu.menu-outline nav>ul>li:focus>a,
.dark:not(.submenu-light) #mainMenu.menu-outline nav>ul>li:hover>a {
    color: #ffffff;
    border-color: #2250fc;
}

.contiene_blog_categorias {
    background: #f7f7f7;
    padding: 10px !important;
    color: #ffffff;
    text-align: center;
    line-height: 10px;
    width: 100%;
    display: inline-block;

}

/*
#header{
    height: auto !important;
}
*/
.contiene_blog_categorias ul {
    margin-bottom: 0px;
}

.contiene_blog_categorias li {
    display: inline-block;
    padding: 12px;

    border: 1px solid #d5d5d5;
    background: white;

}

.contiene_blog_categorias li:hover {
    background: #ededed;

}

.contiene_blog_categorias li>a {

    color: #830000 !important;
    font-weight: bold;
}

.contiene_blog_categorias li>a:hover {

    color: #bb0000 !important;
    ;
}

.quienessomos {
    background: #ffe9e9;
}

.detalles_individual {
    background: #ffe9e9;
}

/*CONFIGURACION*/
#txt_nuestra_historia,
#txt_mision,
#txt_vision,
#txt_politica_privacidad,
#txt_terminos_condiciones,
#txt_valores {
    width: 100%;
    padding: 20px;
}


/*REACCIONES*/
.contiene_contenido1 {

    overflow: hidden;
    max-width: 1300px;
    margin: 0 auto;

}

.post_item1 {
    padding: 5px;
}

.itemm {
    width: 100%;
    box-sizing: border-box;
    height: 300px;
    display: inline-block;
    border-radius: 10px;
    position: relative;
    /*        border:1px solid rgba(203, 203, 203, 0.67);*/
}

.itemm .subcontenedor {
    height: 60%;
    width: 100%;
    background: rgba(0, 0, 0, 0);
    position: absolute;
    bottom: 0px;
    padding: 10px;
    border-radius: 0px 0px 10px 10px;
}

.itemm .subcontenedor_todo {
    height: 100%;
    width: 100%;

    position: absolute;
    bottom: 0px;
    padding: 10px;
    border-radius: 0px 0px 10px 10px;

    background: rgb(40, 22, 3);
    background: -moz-linear-gradient(0deg, rgba(40, 22, 3, 1) 2%, rgba(40, 22, 3, 0.9556197478991597) 11%, rgba(40, 22, 3, 0.865983893557423) 20%, rgba(40, 22, 3, 0.7455357142857143) 30%, rgba(40, 22, 3, 0.5186449579831933) 43%, rgba(40, 22, 3, 0.36738445378151263) 53%, rgba(40, 22, 3, 0.19091386554621848) 64%, rgba(40, 22, 3, 0) 83%);
    background: -webkit-linear-gradient(0deg, rgba(40, 22, 3, 1) 2%, rgba(40, 22, 3, 0.9556197478991597) 11%, rgba(40, 22, 3, 0.865983893557423) 20%, rgba(40, 22, 3, 0.7455357142857143) 30%, rgba(40, 22, 3, 0.5186449579831933) 43%, rgba(40, 22, 3, 0.36738445378151263) 53%, rgba(40, 22, 3, 0.19091386554621848) 64%, rgba(40, 22, 3, 0) 83%);
    background: linear-gradient(0deg, rgba(40, 22, 3, 1) 2%, rgba(40, 22, 3, 0.9556197478991597) 11%, rgba(40, 22, 3, 0.865983893557423) 20%, rgba(40, 22, 3, 0.7455357142857143) 30%, rgba(40, 22, 3, 0.5186449579831933) 43%, rgba(40, 22, 3, 0.36738445378151263) 53%, rgba(40, 22, 3, 0.19091386554621848) 64%, rgba(40, 22, 3, 0) 83%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#281603", endColorstr="#281603", GradientType=1);



}

.itemm .subcontenedor_todo:hover {
    background: rgb(40, 22, 3);
    background: -moz-linear-gradient(0deg, rgba(40, 22, 3, 0.9332107843137255) 2%, rgba(40, 22, 3, 0.8211659663865546) 11%, rgba(40, 22, 3, 0.7035189075630253) 20%, rgba(40, 22, 3, 0.5942752100840336) 30%, rgba(40, 22, 3, 0.4066001400560224) 43%, rgba(40, 22, 3, 0.25253851540616246) 53%, rgba(40, 22, 3, 0.09567577030812324) 64%, rgba(40, 22, 3, 0) 83%);
    background: -webkit-linear-gradient(0deg, rgba(40, 22, 3, 0.9332107843137255) 2%, rgba(40, 22, 3, 0.8211659663865546) 11%, rgba(40, 22, 3, 0.7035189075630253) 20%, rgba(40, 22, 3, 0.5942752100840336) 30%, rgba(40, 22, 3, 0.4066001400560224) 43%, rgba(40, 22, 3, 0.25253851540616246) 53%, rgba(40, 22, 3, 0.09567577030812324) 64%, rgba(40, 22, 3, 0) 83%);
    background: linear-gradient(0deg, rgba(40, 22, 3, 0.9332107843137255) 2%, rgba(40, 22, 3, 0.8211659663865546) 11%, rgba(40, 22, 3, 0.7035189075630253) 20%, rgba(40, 22, 3, 0.5942752100840336) 30%, rgba(40, 22, 3, 0.4066001400560224) 43%, rgba(40, 22, 3, 0.25253851540616246) 53%, rgba(40, 22, 3, 0.09567577030812324) 64%, rgba(40, 22, 3, 0) 83%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#281603", endColorstr="#281603", GradientType=1);
}

.subcontenedor .descripcion {

    position: relative;
    height: 85%;
    width: 100%;

}

.subcontenedor .descripcion .subdesp {
    bottom: 20px;
    position: absolute;
}

.subcontenedor .descripcion .categoria {
    font-size: 12px;
    margin-bottom: 5px;

}

.subcontenedor .descripcion .categoria a {
    font-weight: normal !important;
}

.subcontenedor .descripcion a,
.subcontenedor .descripcion p {
    color: white !important;
    font-weight: bold;
}

.subcontenedor .reacciones {
    height: 20%;
    width: 100%;

}

.emojies-box {
    width: 375px !important;
    height: 64px !important;
    padding: 5px;
    z-index: 2;
    box-shadow: none;

    background: rgb(40, 22, 3);
    background: -moz-linear-gradient(0deg, rgba(40, 22, 3, 1) 2%, rgba(40, 22, 3, 0.9612219887955182) 11%, rgba(40, 22, 3, 0.8995973389355743) 20%, rgba(40, 22, 3, 0.8491771708683473) 30%, rgba(40, 22, 3, 0.773546918767507) 43%, rgba(40, 22, 3, 0.7203256302521008) 53%, rgba(40, 22, 3, 0.6474964985994398) 64%, rgba(40, 22, 3, 0.5690651260504201) 83%);
    background: -webkit-linear-gradient(0deg, rgba(40, 22, 3, 1) 2%, rgba(40, 22, 3, 0.9612219887955182) 11%, rgba(40, 22, 3, 0.8995973389355743) 20%, rgba(40, 22, 3, 0.8491771708683473) 30%, rgba(40, 22, 3, 0.773546918767507) 43%, rgba(40, 22, 3, 0.7203256302521008) 53%, rgba(40, 22, 3, 0.6474964985994398) 64%, rgba(40, 22, 3, 0.5690651260504201) 83%);
    background: linear-gradient(0deg, rgba(40, 22, 3, 1) 2%, rgba(40, 22, 3, 0.9612219887955182) 11%, rgba(40, 22, 3, 0.8995973389355743) 20%, rgba(40, 22, 3, 0.8491771708683473) 30%, rgba(40, 22, 3, 0.773546918767507) 43%, rgba(40, 22, 3, 0.7203256302521008) 53%, rgba(40, 22, 3, 0.6474964985994398) 64%, rgba(40, 22, 3, 0.5690651260504201) 83%);
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr="#281603", endColorstr="#281603", GradientType=1);
}

.reacciones {
    padding-left: 3px;

}

.reacciones span {

    color: #ff0000 !important;
}

.reaction-btn {
    margin: 0px;
}

.reaction-btn-emo {
    display: inline;
    margin: 0px;
}

.comentarios_home {
    margin-top: 5px;
    color: #ffb100;

}

.comentarios_home:hover {
    text-decoration: underline;

}

.descripcion_reaccion {

    display: inline-block;
}

.subreacciones {
    margin-left: 10px;
    color: white;
    width: 100px;
    display: inline-block;
}

.subreacciones img {
    display: inline-block !important;
    height: 20px !important;
    width: 20px !important;
}

.totalreacciones {
    display: inline-block;
}

/*REACCIONES*/
/*TIENDA*/
.contiene_producto {
    width: 15%;
    float: left;
    margin-left: 10px;
    min-width: 250px;
    margin-top: 10px;
}

.categoria {
    display: block;
    text-align: center;
    overflow: hidden;
}

.categoriahead {

    margin-bottom: 10px;
}

.categoriahead h2 {
    color: #707070;

}

.imagen {
    width: 100%;
    height: 330px;
    overflow: hidden;
    position: relative;
}

.imagen img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
}

.descripcion {
    margin-top: 10px;
}

.descripcion .nombre {
    text-align: center;
    font-weight: bold;
}

.descripcion .desc {
    text-align: center;
    font-weight: bold;
}

@media (max-width: 805PX) {
    .contiene_producto {
        width: 45%;
    }
}

@media (max-width: 550PX) {
    .contiene_producto {
        width: 100%;
    }
}

@media (max-width: 992PX) {
    .grid-articles:not(.post-carousel) .post-entry {
        width: 49%;
        margin-left: 0.5%;
        margin-top: 0.5%;
    }

    .izquierda_video {
        width: 100%;
    }

    .derecha_video {
        width: 100%;
    }

    .izquierda_video h2 {
        font-size: 27px !important;
    }

    .derecha_video h2 {
        font-size: 27px !important;
    }

    .derecha_video .lista h4 {
        font-size: 24px !important;
    }

    .derecha_video .lista .descripcion {
        font-size: 20px !important;
    }

    footer {
        text-align: center;
    }

}

@media (min-width: 0px) and (max-width: 1024px) {
    .contiene_mision {
        font-size: 14px;
    }

    .contiene_vision {
        font-size: 14px;
    }
}

@media (min-width: 0px) and (max-width: 800px) {
    .misionvisionvalores {
        display: block;
    }

    .contiene_mision {
        display: block;
    }

    .contiene_vision {
        display: block;
    }
}

@media (min-width: 0px) and (max-width: 600px) {

    .grid-articles .post-entry {
        width: 25%;
        margin: 0%;
    }

    .grid-articles .post-entry_p {
        width: 24.5%;
        margin-left: 0.25%;
        margin-top: 0.5%;
    }

    .grid-articles .post-entry {
        width: 24.5%;
        margin-left: 0.25%;
        margin-top: 0.25%;
    }


    .heading-text.heading-section>h2 {

        font-size: 28px;
    }

    .productos_segmento {
        float: left;
        width: 100%;
    }

    .todaslasclasificaciones_div {
        width: 100%;
        min-width: inherit;
    }

    .naranja #mainMenu nav>ul>li>a,
    #mainMenu.naranja nav>ul>li>a {
        color: white !important;

    }

    .negro #mainMenu nav>ul>li>a,
    #mainMenu.negro nav>ul>li>a {
        color: white !important;

    }

    .azul #mainMenu nav>ul>li>a,
    #mainMenu.azul nav>ul>li>a {
        color: white !important;
    }

    .verde #mainMenu nav>ul>li>a,
    #mainMenu.verde nav>ul>li>a {
        color: #000000;
    }

    .navclasificaciones {

        margin-left: 0px;

    }

    .elticket {
        width: 100% !important;
    }


    .izquierda_video h2 {
        font-size: 20px !important;

    }

    .derecha_video h2 {
        font-size: 20px !important;

    }

    .derecha_video .lista h4 {
        font-size: 17px !important;
        line-height: 16px;
    }

    .derecha_video .lista .descripcion {
        font-size: 13px !important;
        line-height: 16px;
    }

    .taller .titulo {
        font-size: 11px;
        line-height: 18px;
    }

    .taller .descripcion {
        display: -webkit-box;
        -webkit-line-clamp: 3;
        /* Número de líneas a mostrar */
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        /* Asegura que el texto se muestre en varias líneas */
        font-size: 10px;
        line-height: 16px;
    }

}

/* ================================================================
   INDEX PAGE - Premium Styles
   Los Originales de Braulio MTZ 
   ================================================================ */

/* ----------------------------------------------------------------
   Hero Slider Typography
   ---------------------------------------------------------------- */
.hero-slide-title {
    font-family: 'Kalam', cursive;
}

.hero-slide-heading {
    font-family: 'Kalam', cursive !important;
    font-size: clamp(2rem, 5vw, 3.5rem);
    font-weight: 700;
    line-height: 1.2;
    color: #fff;
    text-shadow: 2px 4px 12px rgba(0, 0, 0, 0.5);
    margin-bottom: 20px;
}

.hero-slide-cta {
    font-family: 'Kalam', cursive !important;
    font-size: clamp(0.875rem, 1.5vw, 1.1rem) !important;
    padding: 14px 36px !important;
    border-radius: 50px !important;
    letter-spacing: 0.5px;
    text-transform: uppercase;
    box-shadow: 0 8px 24px rgba(34, 80, 252, 0.35);
    transition: all 0.3s ease !important;
    margin-top: 10px;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}

.hero-slide-cta:hover {
    transform: translateY(-2px);
    box-shadow: 0 12px 32px rgba(34, 80, 252, 0.5);
}

/* ----------------------------------------------------------------
   Logo - Aspect Ratio Preservation
   ---------------------------------------------------------------- */
#header #logo a>img,
#header #header-wrap #logo a>img,
.logo-default img,
.logo-dark img {
    height: 80px;
    width: auto;
    object-fit: contain;
    max-width: 200px;
}

/* ----------------------------------------------------------------
   MISIÓN / VISIÓN / VALORES - Premium Card Section
   ---------------------------------------------------------------- */
.section-mvv {
    padding: 80px 0 60px;
    background: linear-gradient(180deg, #f8f9fa 0%, #ffffff 100%);
    position: relative;
}

.mvv-row {
    display: flex;
    justify-content: center;
    gap: 0;
}

.mvv-col {
    padding: 15px;
    display: flex;
}

.mvv-card {
    background: #ffffff;
    border-radius: 16px;
    padding: 40px 30px 35px;
    text-align: center;
    position: relative;
    overflow: hidden;
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.06);
    transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.mvv-card::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    height: 5px;
    border-radius: 16px 16px 0 0;
    transition: height 0.3s ease;
}

.mvv-card:hover {
    transform: translateY(-8px);
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.12);
}

.mvv-card:hover::before {
    height: 6px;
}

/* Card Colors */
.mvv-card--mision::before {
    background: linear-gradient(90deg, #e8802a, #f5a623);
}

.mvv-card--vision::before {
    background: linear-gradient(90deg, #2250fc, #5b8def);
}

.mvv-card--valores::before {
    background: linear-gradient(90deg, #10b981, #34d399);
}

/* Icon Circles */
.mvv-card__icon-wrap {
    margin-bottom: 24px;
}

.mvv-card__icon {
    width: 72px;
    height: 72px;
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 28px;
    transition: transform 0.3s ease;
}

.mvv-card:hover .mvv-card__icon {
    transform: scale(1.1);
}

.mvv-card__icon--orange {
    background: rgba(232, 128, 42, 0.12);
    color: #e8802a;
}

.mvv-card__icon--blue {
    background: rgba(34, 80, 252, 0.1);
    color: #2250fc;
}

.mvv-card__icon--green {
    background: rgba(16, 185, 129, 0.1);
    color: #10b981;
}

/* Card Titles */
.mvv-card__title {
    font-family: 'Kalam', cursive !important;
    font-size: clamp(1.4rem, 2.5vw, 1.75rem);
    font-weight: 700;
    color: #1a202c;
    margin-bottom: 16px;
    line-height: 1.3;
}

/* Card Text - Normal, NO cursiva */
.mvv-card__text {
    font-family: "Inter", "Poppins", sans-serif !important;
    font-size: 15px;
    color: #4a5568;
    line-height: 1.75;
    margin-bottom: 0;
    flex-grow: 1;
}

/* ----------------------------------------------------------------
   HISTORIA - Parallax Section
   ---------------------------------------------------------------- */
.section-historia {
    padding: 120px 0 100px;
    position: relative;
}

.historia-title {
    font-family: 'Kalam', cursive !important;
    font-size: clamp(2rem, 4vw, 3rem) !important;
    font-weight: 700 !important;
    color: #fff !important;
    text-shadow: 2px 3px 10px rgba(0, 0, 0, 0.4);
    margin-bottom: 10px;
}

.historia-text {
    font-family: "Inter", "Poppins", sans-serif !important;
    font-size: 15px;
    line-height: 1.9;
    color: rgba(255, 255, 255, 0.92);
    max-width: 850px;
    margin: 0 auto;
    text-shadow: 1px 2px 6px rgba(0, 0, 0, 0.3);
}

/* ----------------------------------------------------------------
   SUCURSALES - Map Section
   ---------------------------------------------------------------- */
.section-sucursales {
    padding: 70px 0 80px;
    background: #f8f9fa;
    position: relative;
    width: 100%;
    z-index: 1;
}

.sucursales-header {
    margin-bottom: 40px;
}

.sucursales-title {
    font-family: 'Poppins', sans-serif !important;
    font-size: clamp(1.5rem, 3vw, 2.25rem);
    font-weight: 700;
    color: #1a202c;
    letter-spacing: 2px;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.sucursales-divider {
    width: 60px;
    height: 4px;
    background: linear-gradient(90deg, #e8802a, #f5a623);
    margin: 0 auto;
    border-radius: 2px;
}

.map-wrapper {
    position: relative;
    width: 100%;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 8px 32px rgba(0, 0, 0, 0.1);
}

.map-wrapper iframe {
    display: block;
    width: 100%;
    min-height: 500px;
    border: none;
}

/* Mapa oculto - sección en actualización */
.map-oculto {
    display: none !important;
}

.map-actualizacion {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-height: 400px;
    padding: 60px 30px;
    background: linear-gradient(135deg, #f8f9fa 0%, #e9ecef 100%);
    border-radius: 12px;
    text-align: center;
}

.map-actualizacion__icono {
    width: 80px;
    height: 80px;
    background: linear-gradient(135deg, #e8802a, #f5a623);
    border-radius: 50%;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 24px;
    box-shadow: 0 8px 24px rgba(232, 128, 42, 0.35);
}

.map-actualizacion__icono i {
    font-family: 'FontAwesome' !important;
    font-size: 2rem;
    color: #fff;
}

.map-actualizacion__titulo {
    font-family: 'Poppins', sans-serif !important;
    font-size: 1.5rem;
    font-weight: 700;
    color: #1a202c;
    margin-bottom: 12px;
}

.map-actualizacion__texto {
    font-size: 1rem;
    color: #64748b;
    line-height: 1.6;
    max-width: 400px;
}

/* ----------------------------------------------------------------
   General Image Proportions
   ---------------------------------------------------------------- */
.rev-slidebg,
[data-bg-parallax] .parallax-container {
    background-size: cover;
    background-position: center center;
}

img {
    max-width: 100%;
    height: auto;
}

/* ----------------------------------------------------------------
   Responsive Adjustments
   ---------------------------------------------------------------- */
@media (max-width: 991px) {
    .section-mvv {
        padding: 50px 0 30px;
    }

    .mvv-col {
        padding: 10px 15px;
    }

    .mvv-card {
        padding: 30px 24px 28px;
    }

    .mvv-card__icon {
        width: 60px;
        height: 60px;
        font-size: 24px;
    }

    .section-historia {
        padding: 80px 0 70px;
    }

    .section-sucursales {
        padding: 50px 0 60px;
    }

    .map-wrapper iframe {
        min-height: 400px;
    }
}

@media (max-width: 767px) {
    .mvv-row {
        flex-direction: column;
    }

    .mvv-col {
        padding: 8px 15px;
    }

    .mvv-card {
        padding: 28px 20px 24px;
    }

    .mvv-card__title {
        font-size: 1.4rem;
    }

    .mvv-card__text {
        font-size: 0.9rem;
    }

    .hero-slide-heading {
        font-size: 1.8rem !important;
    }

    .hero-slide-cta {
        font-size: 0.8rem !important;
        padding: 14px 24px !important;
        white-space: normal !important;
        text-align: center !important;
        line-height: 1.4 !important;
        max-width: 90%;
        display: inline-flex !important;
        flex-direction: column !important;
        align-items: center !important;
        justify-content: center !important;
        -webkit-font-smoothing: antialiased;
        -moz-osx-font-smoothing: grayscale;
    }

    .section-historia {
        padding: 60px 0 50px;
    }

    .historia-text {
        font-size: 0.95rem;
        padding: 0 10px;
    }

    .map-wrapper iframe {
        min-height: 350px;
    }

    .section-sucursales {
        padding: 40px 0 50px;
    }

    .sucursales-title {
        font-size: 1.3rem;
    }

    .map-actualizacion {
        min-height: 300px;
        padding: 40px 20px;
    }

    .map-actualizacion__icono {
        width: 64px;
        height: 64px;
        margin-bottom: 20px;
    }

    .map-actualizacion__icono i {
        font-size: 1.5rem;
    }

    .map-actualizacion__titulo {
        font-size: 1.25rem;
    }

    .map-actualizacion__texto {
        font-size: 0.95rem;
    }
}

/* ================================================================
   CONTACTO - Premium Redesign
   ================================================================ */

/* Contact Section Background */
#section7 {
    border-top: none !important;
    padding: 0px !important;
    background: #1a1a2e !important;
    background-position: center !important;
    background-size: cover !important;
    background-attachment: fixed !important;
    position: relative;
    overflow: hidden;
}

#section7::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(227, 150, 48, 0.92) 0%, rgba(180, 100, 20, 0.95) 50%, rgba(140, 70, 10, 0.97) 100%);
    z-index: 0;
}

.covernegro {
    background: transparent !important;
    position: relative;
    z-index: 1;
}

.covernegro .container {
    background: transparent !important;
    padding: 60px 40px !important;
    border-radius: 0 !important;
}

/* Contact Title */
#h2contactanos {
    font-family: 'Kalam', cursive !important;
    font-size: clamp(2rem, 4vw, 3rem) !important;
    font-weight: 700 !important;
    color: #fff !important;
    margin-bottom: 8px;
    text-shadow: 2px 3px 8px rgba(0, 0, 0, 0.2);
}

/* Contact Info - Texto normal, NO cursiva */
#section7 .lead {
    font-family: "Inter", "Poppins", sans-serif;
    font-size: 15px;
    color: rgba(255, 255, 255, 0.85) !important;
    font-style: italic;
    margin-bottom: 24px;
}

#section7 address {
    font-family: "Inter", "Poppins", sans-serif;
    color: rgba(255, 255, 255, 0.9) !important;
    font-size: 15px;
    line-height: 1.8;
}

#section7 address strong {
    font-family: "Poppins", sans-serif !important;
    font-size: 15px;
    font-weight: 700;
    color: #fff !important;
    display: inline-flex;
    align-items: center;
    gap: 6px;
    text-transform: uppercase;
    letter-spacing: 0.5px;
}

#section7 p,
#section7 span,
#section7 li {
    font-family: "Inter", "Poppins", sans-serif;
    font-size: 15px;
}

/* Social Media Section */
#section7 h4 {
    font-family: 'Kalam', cursive !important;
    font-size: clamp(1.1rem, 1.8vw, 1.4rem) !important;
    color: #fff !important;
    margin-bottom: 16px;
    margin-top: 10px;
}

#section7 .social-icons li a {
    width: 44px;
    height: 44px;
    line-height: 44px;
    border-radius: 50%;
    font-size: 18px;
    transition: all 0.3s ease;
}

#section7 .social-icons li a:hover {
    transform: translateY(-3px);
    box-shadow: 0 6px 16px rgba(0, 0, 0, 0.2);
}

/* Contact Form Card */
#section7 .col-lg-5 {
    position: relative;
}

#section7 .widget-contact-form {
    background: rgba(255, 255, 255, 0.12);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    padding: 36px 32px;
    box-shadow: 0 16px 40px rgba(0, 0, 0, 0.15);
}

/* Form Labels */
#section7 .widget-contact-form label,
#section7 label {
    font-family: "Poppins", sans-serif !important;
    font-size: 0.8rem !important;
    font-weight: 600 !important;
    text-transform: uppercase !important;
    letter-spacing: 0.8px !important;
    color: rgba(255, 255, 255, 0.95) !important;
    margin-bottom: 6px !important;
}

/* Form Inputs */
#section7 .form-control,
#section7 input[type="text"],
#section7 input[type="email"],
#section7 input[type="tel"],
#section7 select,
#section7 textarea {
    background: rgba(255, 255, 255, 0.9) !important;
    border: 2px solid rgba(255, 255, 255, 0.3) !important;
    border-radius: 10px !important;
    padding: 12px 16px !important;
    font-size: 0.9rem !important;
    color: #333 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06) !important;
}

#section7 .form-control:focus,
#section7 input:focus,
#section7 select:focus,
#section7 textarea:focus {
    background: #fff !important;
    border-color: #e8802a !important;
    box-shadow: 0 0 0 4px rgba(232, 128, 42, 0.15) !important;
    outline: none !important;
}

/* Validation - Red borders on empty required fields */
#section7 .was-validated .form-control:invalid,
#section7 .was-validated input:invalid,
#section7 .was-validated select:invalid,
#section7 .was-validated textarea:invalid,
#section7 .widget-contact-form.was-validated .form-control:invalid,
#section7 .widget-contact-form.was-validated input:invalid,
#section7 .widget-contact-form.was-validated select:invalid,
#section7 .widget-contact-form.was-validated textarea:invalid {
    border: 2px solid #e53e3e !important;
    background: rgba(255, 255, 255, 0.95) !important;
    box-shadow: 0 0 0 4px rgba(229, 62, 62, 0.15) !important;
}

#section7 .was-validated .form-control:valid,
#section7 .was-validated input:valid,
#section7 .was-validated select:valid,
#section7 .was-validated textarea:valid,
#section7 .widget-contact-form.was-validated .form-control:valid,
#section7 .widget-contact-form.was-validated input:valid,
#section7 .widget-contact-form.was-validated select:valid,
#section7 .widget-contact-form.was-validated textarea:valid {
    border: 2px solid #10b981 !important;
}

#section7 textarea.form-control {
    min-height: 120px !important;
    resize: vertical;
}

#section7 .form-select,
#section7 select.form-control {
    appearance: auto !important;
}

/* ReCaptcha */
#section7 .g-recaptcha {
    transform: scale(0.92);
    transform-origin: left top;
}

/* Submit Button */
#section7 #form-submit,
#section7 .btn-light {
    background: linear-gradient(135deg, #fff 0%, #f0f0f0 100%) !important;
    color: #b85c00 !important;
    border: none !important;
    border-radius: 12px !important;
    padding: 14px 40px !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 0.85rem !important;
    font-weight: 700 !important;
    letter-spacing: 1.5px !important;
    text-transform: uppercase !important;
    cursor: pointer !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12) !important;
    -webkit-font-smoothing: antialiased !important;
    -moz-osx-font-smoothing: grayscale !important;
    text-align: center !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
}

#section7 #form-submit:hover,
#section7 .btn-light:hover {
    background: #fff !important;
    color: #8b4500 !important;
    transform: translateY(-2px) !important;
    box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2) !important;
}

/* ================================================================
   FOOTER (PIE DE PAGINA) - Premium Redesign
   ================================================================ */

/* Main Footer Area */
.footer-content {
    background: linear-gradient(180deg, #1e2022 0%, #2a2d31 100%) !important;
    padding: 60px 0 40px !important;
    position: relative;
    border-top: 4px solid #e8802a;
}

.footer-content .container {
    background: transparent !important;
}

.footer-content .row {
    align-items: flex-start;
}

/* Footer Logo */
.footer-content .logo-height2 {
    max-height: 130px !important;
    width: auto;
    object-fit: contain;
    transition: transform 0.3s ease;
    filter: drop-shadow(0 4px 12px rgba(0, 0, 0, 0.3));
}

.footer-content .logo-height2:hover {
    transform: scale(1.05);
}

/* Footer Headings */
.footer-content h4,
.footer-content h5,
.footer-content .widget h4 {
    font-family: 'Kalam', cursive !important;
    font-size: clamp(1.1rem, 1.8vw, 1.4rem) !important;
    color: #fff !important;
    margin-bottom: 20px !important;
    padding-bottom: 12px;
    position: relative;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.footer-content h4::after,
.footer-content h5::after {
    content: '';
    position: absolute;
    bottom: 0;
    left: 0;
    width: 40px;
    height: 3px;
    background: linear-gradient(90deg, #e8802a, #f5a623);
    border-radius: 2px;
}

/* Footer Links */
.footer-content .list,
.footer-content ul.list {
    list-style: none !important;
    padding: 0 !important;
    margin: 0 !important;
}

.footer-content .list li {
    margin-bottom: 10px;
}

.footer-content .list li a {
    font-family: "Inter", "Poppins", sans-serif !important;
    color: rgba(255, 255, 255, 0.7) !important;
    font-size: 0.9rem !important;
    transition: all 0.3s ease !important;
    text-decoration: none !important;
    display: inline-block;
    position: relative;
    padding-left: 0;
}

.footer-content .list li a::before {
    content: '›';
    margin-right: 8px;
    color: #e8802a;
    font-weight: 700;
    font-size: 1.1rem;
    transition: margin-right 0.3s ease;
}

.footer-content .list li a:hover {
    color: #f5a623 !important;
    padding-left: 4px;
}

.footer-content .list li a:hover::before {
    margin-right: 12px;
}

/* Footer Social Icons */
.footer-content .redessociales {
    float: none !important;
    display: flex !important;
    gap: 10px;
}

.footer-content .social-icons li a {
    width: 44px !important;
    height: 44px !important;
    line-height: 44px !important;
    border-radius: 50% !important;
    font-size: 18px !important;
    transition: all 0.3s ease !important;
}

.footer-content .social-icons li a:hover {
    transform: translateY(-3px) !important;
    box-shadow: 0 6px 18px rgba(0, 0, 0, 0.3) !important;
}

/* Copyright Bar */
.copyright-content {
    background: linear-gradient(90deg, #141618, #1a1c1e) !important;
    padding: 20px 0 !important;
    border-top: 1px solid rgba(255, 255, 255, 0.08);
}

.copyright-content .copyright-text {
    font-family: "Inter", "Poppins", sans-serif;
    font-size: 0.85rem;
    color: rgba(255, 255, 255, 0.5) !important;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 16px;
    flex-wrap: wrap;
}

.copyright-content a[href*="pwa"] {
    font-family: "Poppins", sans-serif !important;
    font-size: 0.8rem !important;
    color: #fff !important;
    background: linear-gradient(135deg, #e8802a, #f5a623) !important;
    border: none !important;
    border-radius: 8px !important;
    padding: 8px 18px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    transition: all 0.3s ease !important;
    box-shadow: 0 4px 12px rgba(232, 128, 42, 0.3) !important;
}

.copyright-content a[href*="pwa"]:hover {
    transform: translateY(-2px) !important;
    box-shadow: 0 6px 20px rgba(232, 128, 42, 0.4) !important;
}

/* ================================================================
   Mobile Responsive - Contact & Footer
   ================================================================ */
@media (max-width: 991px) {
    .covernegro .container {
        padding: 40px 20px !important;
    }

    #section7 .widget-contact-form {
        padding: 28px 24px;
        margin-top: 30px;
    }

    .footer-content {
        padding: 40px 0 30px !important;
        text-align: center;
    }

    .footer-content h4::after,
    .footer-content h5::after {
        left: 50%;
        transform: translateX(-50%);
    }

    .footer-content .redessociales {
        justify-content: center !important;
    }

    .footer-content .logo-height2 {
        margin-bottom: 20px;
    }
}

@media (max-width: 767px) {
    #h2contactanos {
        font-size: 1.8rem !important;
    }

    #section7 .widget-contact-form {
        padding: 24px 18px;
        border-radius: 14px;
    }

    #section7 #form-submit,
    #section7 .btn-light {
        width: 100% !important;
        padding: 14px 24px !important;
        -webkit-font-smoothing: antialiased !important;
        -moz-osx-font-smoothing: grayscale !important;
        text-rendering: optimizeLegibility !important;
        letter-spacing: 0.5px !important;
        font-size: 0.9rem !important;
    }

    .footer-content .col-lg-4 {
        margin-bottom: 30px;
    }

    .copyright-content .copyright-text {
        flex-direction: column;
        gap: 12px;
    }
}

/* ================================================================
   TIENDA - Premium Product Cards
   ================================================================ */

/* Category Headers */
.categoriahead h2 {
    font-family: 'Kalam', cursive !important;
    color: #1a202c !important;
    font-size: clamp(1.5rem, 3vw, 2.2rem);
    font-weight: 700;
    padding-bottom: 10px;
    border-bottom: 3px solid #e8802a;
    display: inline-block;
    margin-bottom: 20px;
}

/* Product Cards */
.contiene_producto {
    background: #fff;
    border-radius: 12px;
    overflow: hidden;
    box-shadow: 0 2px 12px rgba(0, 0, 0, 0.06);
    transition: all 0.35s ease;
    margin-bottom: 20px;
    border: 1px solid rgba(0, 0, 0, 0.05);
}

.contiene_producto:hover {
    transform: translateY(-6px);
    box-shadow: 0 12px 32px rgba(0, 0, 0, 0.12);
}

/* Product Image */
.contiene_producto .imagen {
    border-radius: 12px 12px 0 0;
    overflow: hidden;
}

.contiene_producto .imagen img {
    transition: transform 0.4s ease;
}

.contiene_producto:hover .imagen img {
    transform: scale(1.05);
}

/* Product Description */
.contiene_producto .descripcion {
    padding: 15px;
}

.contiene_producto .descripcion .nombre {
    font-family: 'Kalam', cursive !important;
    font-size: 17px;
    font-weight: 700;
    color: #1a202c;
}

.contiene_producto .descripcion .desc {
    font-family: "Inter", "Poppins", sans-serif !important;
    font-size: 14px;
    font-weight: 400;
    color: #718096;
    line-height: 1.6;
}

.contiene_producto ins {
    font-family: "Poppins", sans-serif !important;
    font-size: 18px;
    font-weight: 700;
    color: #e8802a;
    text-decoration: none;
}

/* Add to Cart Button */
.btncarrito {
    background: linear-gradient(135deg, #e8802a, #f5a623) !important;
    border-radius: 10px !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 14px !important;
    font-weight: 600 !important;
    letter-spacing: 0.3px;
    transition: all 0.3s ease;
    border: none;
}

.btncarrito:hover {
    background: linear-gradient(135deg, #cc6e02, #e39630) !important;
    transform: translateY(-2px);
    box-shadow: 0 4px 16px rgba(232, 128, 42, 0.3);
}

/* Quantity Input */
.cantidad_producto,
.quantity input {
    font-family: "Inter", sans-serif !important;
    font-size: 15px !important;
    border-radius: 8px !important;
}

/* Search Bar */
.widget-newsletter .form-control {
    font-family: "Inter", sans-serif !important;
    font-size: 15px;
    border-radius: 10px 0 0 10px !important;
    padding: 12px 16px;
}

.widget-newsletter .btn {
    border-radius: 0 10px 10px 0 !important;
}

/* Product Popup Modal */
.desplegar_informacion {
    border-radius: 16px !important;
    box-shadow: 0 16px 48px rgba(0, 0, 0, 0.2) !important;
}

.desplegar_informacion h2 {
    font-family: 'Kalam', cursive !important;
}

.desplegar_informacion .info_producto_agregado {
    font-family: "Inter", "Poppins", sans-serif !important;
    font-size: 15px;
}

/* ================================================================
   CARRITO DE COMPRAS - Premium Table
   ================================================================ */

/* Cart Title */
.shop-cart h1 {
    font-family: 'Kalam', cursive !important;
    font-size: clamp(1.8rem, 3.5vw, 2.5rem) !important;
    font-weight: 700;
    color: #1a202c;
    margin-bottom: 30px;
    padding-bottom: 15px;
    border-bottom: 3px solid #e8802a;
    display: inline-block;
}

/* Cart Table */
#shop-cart .table,
.shop-cart .table {
    font-family: "Inter", "Poppins", sans-serif !important;
    font-size: 15px;
    border-collapse: separate;
    border-spacing: 0;
}

#shop-cart .table thead th,
.shop-cart .table thead th {
    font-family: "Poppins", sans-serif !important;
    font-size: 13px;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.8px;
    color: #4a5568;
    background: #f7f9fb !important;
    padding: 14px 12px;
    border-bottom: 2px solid #e2e8f0;
}

#shop-cart .table tbody td,
.shop-cart .table tbody td {
    font-family: "Inter", sans-serif !important;
    font-size: 15px;
    padding: 14px 12px;
    vertical-align: middle;
    border-bottom: 1px solid #edf2f7;
}

/* Cart Product Name */
.cart-product-thumbnail-name {
    font-family: 'Kalam', cursive !important;
    font-size: 16px;
    font-weight: 700;
    color: #1a202c;
}

/* Cart Amount */
.shop-cart .amount {
    font-family: "Poppins", sans-serif !important;
    font-size: 16px;
    font-weight: 700;
    color: #e8802a;
}

/* Cart Subtotal Header */
.shop-cart h4 {
    font-family: 'Kalam', cursive !important;
    font-size: clamp(1.2rem, 2vw, 1.6rem) !important;
    font-weight: 700;
    color: #1a202c;
}

/* Cart Remove Button */
.cart-product-remove a {
    color: #e53e3e !important;
    font-size: 16px;
    transition: all 0.2s ease;
}

.cart-product-remove a:hover {
    color: #c53030 !important;
    transform: scale(1.2);
}

/* Cart Buttons */
.shop-cart .btn,
#shop-cart .btn {
    font-family: "Poppins", sans-serif !important;
    font-size: 15px !important;
    font-weight: 600;
    padding: 12px 28px;
    border-radius: 10px;
    transition: all 0.3s ease;
}

.shop-cart .btn:hover,
#shop-cart .btn:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(0, 0, 0, 0.15);
}

/* Cart Form Labels */
.carrito_compra label {
    font-family: "Poppins", sans-serif !important;
    font-size: 14px !important;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.5px;
    color: #1a202c;
}

/* Cart Form Inputs */
.carrito_compra .form-control,
.carrito_compra select,
.carrito_compra textarea {
    font-family: "Inter", sans-serif !important;
    font-size: 15px !important;
    border-radius: 10px !important;
    padding: 12px 16px;
    border: 1px solid #e2e8f0;
    transition: all 0.3s ease;
}

.carrito_compra .form-control:focus,
.carrito_compra select:focus,
.carrito_compra textarea:focus {
    border-color: #e8802a;
    box-shadow: 0 0 0 3px rgba(232, 128, 42, 0.12);
}

/* Important Links */
a[style*="background:yellow"] {
    background: linear-gradient(135deg, #e53e3e, #fc8181) !important;
    color: #fff !important;
    font-family: "Poppins", sans-serif !important;
    font-size: 14px !important;
    padding: 12px 20px !important;
    border-radius: 10px !important;
    text-decoration: none !important;
    font-weight: 600 !important;
    display: inline-block;
    margin-top: 10px;
    transition: all 0.3s ease;
}

a[style*="background:yellow"]:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(229, 62, 62, 0.3);
}

/* --- Botón Sucursal Index --- */
@keyframes agitarBoton {

    0%,
    100% {
        transform: translateX(0) rotate(0deg);
    }

    10% {
        transform: translateX(-4px) rotate(-2deg);
    }

    20% {
        transform: translateX(4px) rotate(2deg);
    }

    30% {
        transform: translateX(-4px) rotate(-2deg);
    }

    40% {
        transform: translateX(4px) rotate(2deg);
    }

    50%,
    100% {
        transform: translateX(0) rotate(0deg);
    }
}

.btn-sucursal-landing {
    display: inline-flex;
    align-items: center;
    gap: 10px;
    padding: 14px 28px;
    background: linear-gradient(135deg, #7341B4 0%, #9b59b6 50%, #8e44ad 100%);
    color: #fff !important;
    text-decoration: none !important;
    border-radius: 50px;
    font-weight: 700;
    font-size: 14px;
    box-shadow: 0 6px 25px rgba(115, 65, 180, 0.5);
    transition: all 0.3s ease;
    animation: agitarBoton 2.5s infinite;
}

.btn-sucursal-landing:hover {
    animation: none;
    transform: scale(1.03);
    box-shadow: 0 8px 35px rgba(115, 65, 180, 0.6);
    color: #fff !important;
}

.btn-sucursal-landing i {
    font-size: 22px;
}

/* Tooltip tipo diálogo */
.btn-sucursal-container {
    position: relative;
    display: inline-block;
}

.custom-tooltip-dialog {
    visibility: hidden;
    opacity: 0;
    position: absolute;
    bottom: 120%;
    left: 50%;
    transform: translateX(-50%) translateY(10px);
    background-color: #fff;
    color: #333;
    padding: 15px 20px;
    border-radius: 12px;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.2);
    width: max-content;
    max-width: 320px;
    font-size: 14px;
    font-weight: 500;
    line-height: 1.4;
    text-align: center;
    border: 3px solid #7341B4;
    z-index: 9991;
    transition: all 0.3s cubic-bezier(0.68, -0.55, 0.265, 1.55);
    pointer-events: none;
    animation: autoShowTooltip 6s ease-out;
}

@keyframes autoShowTooltip {

    0%,
    50% {
        visibility: visible;
        opacity: 1;
        transform: translateX(-50%) translateY(0);
    }

    100% {
        visibility: hidden;
        opacity: 0;
        transform: translateX(-50%) translateY(10px);
    }
}

.custom-tooltip-dialog::after {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -10px;
    border-width: 10px;
    border-style: solid;
    border-color: #7341B4 transparent transparent transparent;
}

.custom-tooltip-dialog::before {
    content: '';
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -7px;
    border-width: 7px;
    border-style: solid;
    border-color: #fff transparent transparent transparent;
    z-index: 1;
}

.btn-sucursal-container:hover .custom-tooltip-dialog {
    visibility: visible;
    opacity: 1;
    transform: translateX(-50%) translateY(0);
    animation: none !important;
}

.custom-tooltip-dialog strong {
    display: block;
    color: #7341B4;
    font-size: 16px;
    margin-bottom: 5px;
}