/*
    Theme Name: theme_invitro
    Theme URI:
    Description: Tema para la web
    Author: INVITRO AGENCIA DIGITAL
    Version: 1.0
    License: GNU General Public License v2 or Later
    Tags: Wordpress
*/

*{margin: 0;padding: 0;box-sizing: border-box;}
@media (min-width: 1200px){footer .footer_center .menu{justify-content: flex-start !important;}}

.product .info .cajaImg .yith-wcwl-add-to-wishlist{position:absolute;top:10px;right:10px;width:28px;height:28px;background:#fdfdfd;border-radius:50%;z-index:3;overflow:hidden}.product .info .cajaImg .yith-wcwl-add-button,.product .info .cajaImg .yith-wcwl-add-button a{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center;position:relative;width:28px;height:28px;overflow:hidden}.product .info .cajaImg .yith-wcwl-add-button a i{width:28px;height:28px;overflow:hidden;position:absolute;inset:0;z-index:4;background:#fdfdfd;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.cajaImg .yith-wcwl-add-button .fa.fa-heart{color: #E84A81;}.cajaImg .yith-wcwl-add-button .fa.fa-heart-o{color:#000}


.filtercategoria{
    width: 100% !important;
    max-width: 100%;
}
.filtercategoria-box{
    display: flex;
    align-items: center;
}

@media (min-width: 1024px){
    .responsive_filters,
    .filtercategoria-button-close,
    .filtercategoria-bg{
        display: none;
    }
}

@media (max-width: 1024px){
    .filtercategoria{
        z-index: 1000;
        position: fixed;
        width: 100%;
        height: 100vh;
        inset: 0;
        transition: all .3s ease;
    }
    .filtercategoria-button-close{
        display: block;
        width: 26px;
        height: 26px;
        opacity: 0.8;
        background: none !important;
        border: none !important;
        margin: 0 auto 10px !important;
    }
    .filtercategoria-button-close img{
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
    }
    .filtercategoria-box{
        position: absolute;
        min-height: 50vh;
        bottom: 0;
        left: 0;
        width: 100%;
        background: white;
        z-index: 1002;
        padding-block: 3rem;
        padding-inline: 5%;
        flex-direction: column;
        align-items: flex-start;
        justify-content: center;
        gap: 30px;
        transition: all .3s ease;
    }
    .filtercategoria .dropdown-toggle:hover{
        background: transparent !important;
    }
    .filtercategoria-box > div{
        flex-direction: column;
        width: 100%;
        justify-content: flex-start !important;
        height: fit-content;
        flex: none !important;
    }
    .filtercategoria .dropdown-toggle{
        border: none !important;
        border-bottom: 1px solid #020202 !important;
        font-family: "osnovaPro_trialsemibold", sans-serif !important;
        padding-inline: 0 !important;
    }
    .filtercategoria .dropdown-content{
        position: relative !important;
        inset: 0 !important;
        margin-top: 10px !important;
    }
    .filtercategoria .dropdown-content{
        grid-template-columns: 100% !important;
        border: none !important;
    }
    .filtercategoria .dropdown:not(:last-child){
        margin-bottom: 10px;
    }
    .filtercategoria .dropdown.active .dropdown-toggle{
        background: transparent !important;
        color: #E84A81 !important;
        font-weight: 700 !important;
    }
    .filtercategoria .dropdown-content a{
        border: none !important;
        padding-inline: 0 !important;
        text-transform: uppercase !important;
    }
    .filtercategoria span{
        font-family: "acardiaregular", sans-serif !important;
        text-transform: lowercase !important;
    }
    .filtercategoria span:first-letter{
        text-transform: uppercase !important;
    }
    .filtercategoria-bg{
        content: '';
        z-index: 1001;
        position: absolute;
        inset: 0;
        transition: all .3s ease;
        background: rgba(0,0,0,0.4);
        width: 100%;
        height: 100%;
    }
    
    .filtercategoria:not(.active) .filtercategoria-box,
    .filtercategoria:not(.active) .filtercategoria-bg,
    .filtercategoria:not(.active){
        opacity: 0;
        pointer-events: none;
    }
    .filtercategoria:not(.active) .filtercategoria-box{
        bottom: -50vh;
    }
    
    .responsive_filters{
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        align-items: center;
    }
    .responsive_filters form{
        width: 100%;
        position: relative;
    }
    .responsive_filters form input{
        border: none;
        min-height: 30px;
        font-size: 15px;
        padding: 6px 0;
        border-bottom: 1px solid #5C542F;
        width: 100%;
    }
    .responsive_filters form [type="submit"]{
        position: absolute;
        top: 0;
        right: 0;
        background: none;
        padding: 4px;
        border: none;
        width: 29px;
        height: 29px;
    }
    .responsive_filters form [type="submit"] svg,
    .responsive_filters form [type="submit"] img{
        width: 100%;
        height: 100%;
        object-fit: contain;
        object-position: center;
    }
    .responsive_filters-button{
        display: block;
        width: 30px !important;
        padding: 8px 0;
        background: none;
        margin-left: auto;
        border: none;
    }
    .responsive_filters-button svg{
        width: 100%;
    }
    
    
}

@media (max-width: 968px){
    .aside_filtro .caja{
        min-height: 50vh;
    }
}

@media (max-width: 700px){
    main.page_gracias h1{
        font-size: 3rem !important;
    }
    main.page_gracias p{
        font-size: 1.2rem !important;
    }
    header:not(.title){
        overflow: hidden !important;
    }
    header:not(.title) nav{
        display: grid;
        overflow: hidden !important;
        grid-template-columns: 220px 1fr;
    }   
    header:not(.title).buscador nav{
        grid-template-columns: 70px 1fr;
    }
    header:not(.title) nav a.logo{
        width: 100% !important;
    }
    header:not(.title) .contenedor .buttons ul,
    header:not(.title) nav .buttons{
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: flex-end;
    }
    header:not(.title).buscador .buttons ul li form input{
        width: 222px !important;
    }
}

@media (min-width: 550px){
    a.responsive_link{
        display: none !important;
    }
}

@media (max-width: 550px){
    section.create{
        width: 100% !important;
    }
    .view_products{
        flex-direction: column;
    }
    .blog_section{
        padding-bottom: 0 !important;
    }
    a.responsive_link{
        display: block;
        padding: 10px 20px;
        background: #020202;
        width: fit-content;
        border: 2px solid #020202;
        color: white;
        font-family: "osnovaPro_triallight", sans-serif;
        letter-spacing: 4.5px;
        font-weight: 600;
    }
    .new_related_products{
        padding-top: 3rem !important;
    }
    .new_related_products h2{
        margin-bottom: 10px !important;
        max-width: 333px !important;
        text-align: center;
        line-height: 1.3em;
    }
    section.create .cajaTexto{
        gap: 20px !important;
    }
    section.why .why_content{
        background: #EFEADC !important;
        padding-inline: 5% !important;
    }
    section.why .why_content p{
        font-weight: 600;
        line-height: 1.4em !important;
    }
    
    .grid_4_products{
        display: grid !important;
        grid-template-columns: repeat(2, 1fr) !important;
        grid-gap: 18px !important;
    }
    .grid_4_products .product{
        width: 100%;
    }
    section.desripcioncategoria p{
        font-size: 14px !important;
        width: 95% !important;
        margin-inline: auto !important;
    }
    .description_container{
        padding-top: 2rem !important;
        gap: 26px !important;
    }
    
    main.page_category, main.page_product{
        height: auto !important;
        gap: 9px !important;
        padding-block: 1.4rem !important;
    }
    main.page_blog{
        height: auto !important;
        gap: 9px !important;
    }
    
    main.page_category p{
        font-size: 16px !important;
    }
    main.page_category h1, main.page_product h1{
        font-size: 25px !important;
    }
    main.page_blog h1{
        font-size: 20px !important;
    }
    
    /*.contenedor{
        max-width: 92% !important;
    }*/
    footer{
        position: relative !important;
        z-index: 4 !important;
    }
    footer .footer_center .menu div ul li a{
        font-size: 14px !important;
    }
    footer .footer_center .menu div span{
        font-weight: 600 !important;
    }
    footer > div{
        width: min(100%, 425px) !important;
        margin-inline: auto !important;
    }
    
    .product .info .titulo_descuento h3{
        font-size: 15px !important;
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
    }
    .product .info p span{
        font-size: 17px !important;
    }
    
    .mobile_menu .menu a{
        text-transform: lowercase;
    }
    .mobile_menu .menu a:first-letter{
        text-transform: uppercase;
    }
    main.page_product p:empty{
        display: none !important;
    }
    main.page_blog .contenedor div:last-child{
        aspect-ratio: 16/9 !important;
    }
    main.page_blog .contenedor{
        display: grid !important;
        grid-template-columns: calc(60% - 3px) 40% !important;
        grid-gap: 3px !important
    }
    main.page_blog .contenedor div:first-child h1{
        padding-right: 12px;
    }
    .single_article{
        padding-top: 3.25rem !important;
    }
    .contenidoBlog .contenido hr{
        opacity: 0.7;
    }
    .contenidoBlog > *{
        max-width: 450px !important;
        margin-inline: auto !important;
    }
    .contenidoBlog .blog-card{
        width: 100% !important;
    }
    main.page_blog .contenedor > div{
        flex: none !important;
        float: none !important;
    }
    
    .page-template-contacto .contacto{
        width: min(100%, 420px) !important;
    }
    
}
@media (max-width: 420px){
    header:not(.title).buscador .buttons ul li form input{
        width: 162px !important;
    }
}
@media (max-width: 350px){
    header:not(.title).buscador .buttons ul li form input{
        width: 137px !important;
    }
}




.checkout_coupon{
    margin: 0 !important;
    border: none !important;
    padding: 0 !important;
    width: 576px;
    display: grid !important;
    grid-template-columns: 1fr 114px;
    grid-gap: 24px;
    position: absolute;
    z-index: 7;
}
@media (max-width: 1450px){
    .checkout_coupon{
        width: 500px;
    }
}
@media (max-width: 1350px){
    .checkout_coupon{
        width: 420px;
    }
}
@media (max-width: 1250px){
    .checkout_coupon{
        width: 390px;
    }
}
@media (max-width: 1200px){
    .checkout_coupon{
        display: none !important;
    }
}
.checkout_coupon > *{
    width: 100%;
    font-family: "osnovaPro_triallight";
    height: 41.2px;
}
.checkout_coupon [type="text"]{
    background: white;
    border: 1px solid #000000;
    border-radius: 0;
    padding-inline: 14px !important;
    font-size: 16px !important;
    font-weight: 600 !important;
}
.checkout_coupon [type="submit"]{
    background: #5C542F !important;
    color: white !important;
    border-radius: 0 !important;
    padding: 0 !important;
    font-weight: 600 !important;
}
.checkout_coupon .clear{
    display: none !important;
}


.checkout_section #order_review .tbody{
    margin-bottom: 30px;
}
.checkout_section #order_review .woocommerce-additional-fields__coupon{
    height: 42px;
    /* background: rgba(0,0,0,0.4); */
    pointer-events: none;
}


.order_received-actions a.pdf{
    background: #000;
    padding-inline: 20px;
    gap: 5px;
}

.final_totals{
    display: block;
    /*margin: -16px 0 0 auto;*/
    margin: 15px 0 0 auto;
    width: min(100%, 260px);
    padding-top: 20px;
    border-top: 1px solid #000;
}
.final_totals > *{
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 6px;
}
.final_totals > *:not(:last-child){
    margin-bottom: 3px;
}