body.woocommerce .wpc-custom-selected-terms{
    display: block;
}

.wpc-custom-selected-terms{
    display: none;
}

.wp-block-woocommerce-mini-cart-contents div.wp-block-button .wc-block-components-button__text {
    display: none;
}

.wp-block-woocommerce-mini-cart-contents div.wp-block-button a:after {
    content: "Comenzar a comprar";
}

.wp-block-woocommerce-mini-cart-contents div.wp-block-button a {
    padding: 16px 24px;
    border-radius: 24px;
    font-weight: 700;
    letter-spacing: 1.68px;
    text-transform: uppercase;
}

.woocommerce-page .custom-pagination {
    display: flex;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    max-width: 849px;
    margin: 48px 0 60px auto;
}

.hide{
    display: none!important;
}
.wc-block-components-drawer__screen-overlay{
    z-index: 10000 !important;
}
.wc-block-mini-cart__button{
    color: var(--gray-700) !important;
}
.woocommerce ul.products li.product .button::after {
    content: "";
    position: relative;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    background: url("../icons/shopping-cart.png") no-repeat;
    background-size: cover;
    margin-right: 10px;
}
.woocommerce ul.products li.product .button{
    height: 48px;
    display: flex;
    flex-direction: row-reverse;
    justify-content: center;
    align-items: center;
}
.woocommerce ul.products li.product .button.added, .woocommerce ul.products li.product .button.loading {
    flex-direction: row;
}
.woocommerce ul.products li.product .button.loading {
    font-size: 0;
    opacity: 1;
    height: 48px;
    margin-top: 14px;
    background: var(--gray-200);
}
.button.loading {
    pointer-events: none;
}
.button.loading .dots {
    display: flex!important;
}
.dots {
    display: none;
    justify-content: center;
    align-items: center;
}
.dot {
    width: 8px;
    height: 8px;
    margin: 0 2px;
    background-color: var(--gray-500);
    border-radius: 50%;
    animation: loading 1s infinite, colorChange 1s infinite;
}
.dot:nth-child(1) {
    animation-delay: 0s;
}
.dot:nth-child(2) {
    animation-delay: 0.2s;
}
.dot:nth-child(3) {
    animation-delay: 0.4s;
}
@keyframes loading {
    0%, 80%, 100% {
        transform: translateY(0);
    }
    40% {
        transform: translateY(-10px);
    }
}
@keyframes colorChange {
    0% {
        background-color: var(--gray-500);
    }
    50% {
        background-color: var(--gray-700);
    }
    100% {
        background-color: var(--gray-500);
    }
}
.woocommerce ul.products li.product a.button.loading::after{
    display: none;
}



/**
    Exito Modal - Login Form
 */


body.modal-open{
    overflow: hidden;
}
#loginModal.modal {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 9999;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.6);
}
#loginModal .modal-content {
    background: var(--white);
    padding: 40px;
    margin: 0 auto;
    width: 100%;
    max-width: 558px;
    position: relative;
    border-radius: 8px;
    box-shadow: 0px 42px 64px 0px rgba(0, 0, 0, 0.04);
    top: 50%;
    transform: translate(0px, -50%);
}
#loginModal .close {
    position: absolute;
    top: 10px;
    right: 15px;
    font-size: 1.5rem;
    cursor: pointer;
}

#loginModal p {
    position: relative;
    margin: 0!important;
    width: 100%;

}

#loginModal p.modalRegister{
    border-bottom: 1px solid var(--primary-lighter);
    padding-bottom: 24px;
}
#loginModal button.continue-guest {
    background: transparent;
    color: var(--primary);
    text-transform: uppercase;
    font-size: 14px;
    font-weight: 700;
    letter-spacing: 1.68px;
    line-height: normal;
    text-align: center;
    width: 100%;
    padding: 8px 0;
    margin-top: 24px;
}

form#loginform {
    justify-content: center;
    display: flex;
    flex-direction: column;
    gap: 24px;
    align-items: center;
    padding-top: 24px;
    padding-bottom: 24px;
    max-width: 350px;
    margin: 0 auto;
}

p.loginTitle {
    font-size: 24px;
    text-align: center;
    font-weight: 600;
    color: var(--gray-900);
}

.loginModalTitleContainer {
    display: flex;
    flex-direction: column;
    gap: 24px;
    justify-content: center;
    align-items: center;
    border-bottom: 1px solid var(--primary-lighter);
    padding-bottom: 24px;
}

p.loginInfo {
    text-align: center;
    font-size: 15px;
    color: var(--gray-700);
    line-height: 160%;
}

p.modalRegister {
    padding-top: 24px;
    font-size: 15px;
}

p.modalRegister a {
    font-size: 16px;
    font-weight: 600;
    letter-spacing: 2.4px;
    color: var(--dark-brown);
    text-decoration: underline;
}

#loginform input[type="submit"] {
    background: var(--primary);
    padding: 16px 24px;
    border-radius: 24px;
    width: 100%;
    font-weight: 700;
    letter-spacing: 1.68px;
}

p.login-submit {
    width: 100%;
}
.wc-block-mini-cart__button span.wc-block-mini-cart__badge {
    color: var(--gray-700);
}
#loginform p:has(input[type="text"]) label.active,
#loginform p:has(input[type="password"]) label.active{
    top: 0;
    padding: 0;
    line-height: normal !important;
    left: 0;
    color: var(--gray-900);
    font-size: 12px;
    position: absolute;
}

#loginform p:has(input[type="text"]) label,
#loginform p:has(input[type="password"]) label {
    position: absolute !important;
    left: 20px;
    top: 28px;
    transition: all 0.2s ease;
    color: var(--gray-700);
    font-size: 15px;
    pointer-events: none;
}
#loginModal .forgot-password{
    font-size: 12px;
    font-weight: 500;
    color: var(--gray-900);
    line-height: normal;
}

#loginform input[type="text"].input,
#loginform input[type="password"].input {
    border: 1px solid var(--primary-light);
    border-radius: 32px;
    padding: 8px 16px;
    width: 100%;
    outline: none;
}

p.forgot-password a {
    font-size: 12px;
}

a.forgot-password {
    font-size: 12px;
    font-weight: 500;
    color: var(--gray-900);
}

#loginModal p:has(input[type="text"]),#loginModal p:has(input[type="password"]) {
    padding-top: 18px;
}

@media screen and (max-width: 768px), screen and (max-height: 768px) {
    #loginModal .modal-content{
        padding: 24px;
        overflow: scroll;
        height: 100%;
        max-height: fit-content;
    }
}

@media (max-width: 1024px) {
    .woocommerce-page .custom-pagination {
        flex-direction: column;
        gap: 24px;
    }

    .archive .sidebar-filter .block-bottom ul:has(p) {
        display: flex;
        flex-wrap: wrap;
        gap: 8px;
    }

    /*.archive .sidebar-filter .block-bottom ul p {*/
    /*    border: 1px solid;*/
    /*    font-size: 14px;*/
    /*    border-radius: 8px;*/
    /*    padding: 8px;*/
    /*    margin: 0;*/
    /*}*/
    .woocommerce-page .wc-block-mini-cart__footer-actions a{
        width: 100%;
    }
}

/**
    Estilos para la home
 */

.absolute{
    position: absolute;
}
.w-100{
    width: 100%;
}
.h-100 {
    height: 100%;
}

.wp-block-image > img {
    object-fit: cover;
    position: absolute;
    width: 100%;
    height: 100%;
}

.opacity-064 {
    opacity: 0.64;
}


 /**
  * ESTILOS DE LAS NOTIFICACIONES ESTATICAS DE PROMOCIÓN Y DESCUENTO EN LA PÁGINA DE PRODUCTO (SINGLE PRODUCT)
  */

  .product-title-wrapper {
      display: flex;
      flex-direction: column;
      gap: 8px;
  }

  .exito-transfer-discount,
  .promo-nave-message {
    display: none;
  }

  .exito-transfer-message,
  .exito-transfer-discount-widget .exito-transfer-discount,
  .exito-loop-transfer-discount,
  .cart-transfer-discount {
    display: flex;
    padding: 4px 8px;
    gap: 8px;
    color: #60AA32;
    font-family: Raleway;
    font-size: 14px;
    font-style: normal;
    font-weight: 400;
    line-height: 140%;
    border-radius: 8px;
    background: #ECFFE0;
    width: fit-content;
  }
  .exito-transfer-message strong {
    font-weight: 700;
    font-size: 18px;
  }
  .exito-nave-message {
    color: var(--gray-700, #565656);
    /* Body/Body */
    font-family: Raleway;
    font-size: 15px;
    font-style: normal;
    font-weight: 400;
    line-height: 24px; /* 160% */
  }


  /**
   * ESTILOS DEL WIDGET DE CUOTAS NAVE SINGLE PRODUCT
   * ESTILOS DEL WIDGET DE TRANSFERENCIA CON DESCUENTO SINGLE PRODUCT
   * 
   */
  .exito-cuotas-widget .exito-cuotas-list {
    display: flex;
    gap: 8px;
    justify-content: center;
    align-items: center;
  }

  /* Transferencia bancaria widget*/
  .exito-transfer-discount-widget .exito-transfer-discount {
    margin-bottom: 24px;
  }

  .exito-transfer-discount-widget .exito-transfer-discount strong {
    font-weight: 700;
    font-size: 22px;
  }

  @media (max-width: 768px) {

    .product-title-wrapper {
        display: none;
    }

    .product-title-mobile {
        margin-bottom: 16px;
    }

    .exito-transfer-message {
        margin-bottom: 8px;
    }

    .exito-transfer-discount-widget .exito-transfer-discount strong {
        font-size: 16px;
    }

  }


  /**
   * ESTILOS DE PROMO NAVE Y TRANSFERENCIA EN EL LOOP DE PRODUCTOS (ARCHIVE)
   */

   .exito-loop-payment-widgets {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    gap: 12px;
   }

   .exito-loop-payment-widgets .exito-loop-cuotas {
        display: flex;
        align-items: center;
        gap: 8px;
   }
   .exito-loop-transfer-discount strong,
   .exito-loop-payment-widgets .exito-loop-cuotas strong{
        font-size: 18px;
   }
    
   .exito-loop-payment-widgets .exito-loop-cuotas.variable {
        display: flex;
        gap: 8px;
   }

/**
 * ESTILOS DE PROMOCIÓN CON TRANSFERENCIA BANCARIA Y CUOTAS NAVE (TODA LA WEB)
 */

   .exito-transfer-discount strong {
    font-size: 18px;
   }
/* Cuotas widget: oculto por defecto, visible con transición */
.exito-cuotas-widget {
    display: none;
    opacity: 0;
    transition: opacity 200ms ease-in-out;
    margin-left: 16px;
}

.exito-cuotas-widget.is-visible {
    display: block;
    opacity: 1;
}

.exito-cuota:not(:last-child)::after,
.exito-loop-payment-widgets .exito-loop-cuota:not(:last-child)::after {
    content: "|";
    margin-left: 8px;
    color: var(--gray-700);
}

.exito-loop-cuota .woocommerce-Price-amount.amount {
    font-weight: 700;
}


form .blocky-woo-product-quoter-container .variation-price.blocky-price-container {
    flex-direction: row;
}

/**
 * Widget con descuento total por transferencia
 */
.exito-transfer-discount-widget {
    grid-column: 1/-1;
    order: 2;
}

.blocky-woo-product-quoter-container .exito-transfer-discount-widget {
    order: unset;
}

.exito-transfer-discount-widget.is-visible .exito-transfer-discount {
    display: flex;
}


.blocky-woo-product-quoter-container .exito-transfer-discount {
    margin-bottom: 0;
}

.exito-checkout-transfer-discount {
    color: #60AA32;
    display: flex;
    gap: 8px;
    border-radius: 5px 0 0 5px;
}

/**
 * MINI-CART ESTILOS DE PROMOS
 */

 .cart-promo-wrapper {
    display: flex;
    flex-direction: column;
    gap: 8px;
 }

 .exito-price-wrapper {
    display: flex;
    align-items: center;
    gap: 8px;
 }

  .exito-price-wrapper .discounted-price {
    color: var(--gray-900, #111827);
    /* Heading/H5 */
    font-size: 16px;
    font-style: normal;
    font-weight: 700;
    line-height: 24px; /* 150% */
 }

 .wc-block-cart-item__product .cart-transfer-discount {
    margin-top: 16px;
 }

 /**
 * SITE LOGO ESTILOS
 */

.has-sticky-branding .sticky-navigation-logo {
}

.has-sticky-branding .sticky-navigation-logo a {
    width: 200px;
    height: 64px;
}