.elementor-11 .elementor-element.elementor-element-68c3cc0{--display:flex;--margin-top:40px;--margin-bottom:50px;--margin-left:0px;--margin-right:0px;}.elementor-widget-heading .elementor-heading-title{font-family:var( --e-global-typography-primary-font-family ), Sans-serif;font-weight:var( --e-global-typography-primary-font-weight );color:var( --e-global-color-primary );}.elementor-11 .elementor-element.elementor-element-182e13d{padding:0px 0px 20px 0px;}.elementor-11 .elementor-element.elementor-element-182e13d.elementor-element{--align-self:center;}.elementor-11 .elementor-element.elementor-element-182e13d .elementor-heading-title{font-family:"Mozilla Headline", Sans-serif;font-size:50px;font-weight:700;color:var( --e-global-color-32f1ae9 );}.elementor-11 .elementor-element.elementor-element-b9087b6{--update-cart-automatically-display:none;--sections-padding:20px 20px 20px 20px;--sections-title-color:var( --e-global-color-8257446 );--links-normal-color:var( --e-global-color-8257446 );--links-hover-color:#F7A200;--order-summary-quantity-border-weight:0px;}.elementor-11 .elementor-element.elementor-element-b9087b6 .e-cart-section{border-width:0px 0px 0px 0px;}.elementor-11 .elementor-element.elementor-element-b9087b6 .cart_totals h2{font-family:"Mozilla Headline", Sans-serif;font-size:35px;}.elementor-11 .elementor-element.elementor-element-b9087b6 {--sections-descriptions-color:var( --e-global-color-accent );}.elementor-11 .elementor-element.elementor-element-b9087b6 .e-shop-table .cart th, .elementor-11 .elementor-element.elementor-element-b9087b6 .e-shop-table .cart td:before{font-family:"Mozilla Headline", Sans-serif;font-size:16px;font-weight:400;text-transform:uppercase;}.elementor-11 .elementor-element.elementor-element-b9087b6 .cart td span, .elementor-11 .elementor-element.elementor-element-b9087b6 .cart td, .elementor-11 .elementor-element.elementor-element-b9087b6 .input-text.qty{font-family:"Mozilla Headline", Sans-serif;font-size:14px;font-weight:bold;}.elementor-11 .elementor-element.elementor-element-b9087b6 .cart_totals .shop_table td:before, .elementor-11 .elementor-element.elementor-element-b9087b6 .cart_totals .shop_table td .woocommerce-Price-amount{font-family:"Mozilla Headline", Sans-serif;font-weight:normal;}.elementor-11 .elementor-element.elementor-element-b9087b6 .checkout-button{font-family:"Mozilla Headline", Sans-serif;font-size:16px;font-weight:normal;text-transform:uppercase;}.elementor-11 .elementor-element.elementor-element-b9087b6 .e-cart-totals{--sections-border-type:none;--sections-descriptions-color:var( --e-global-color-accent );}.elementor-11 .elementor-element.elementor-element-b9087b6 .cart_totals{--sections-title-color:var( --e-global-color-8257446 );}.elementor-11 .elementor-element.elementor-element-b9087b6 .coupon{--sections-border-type:none;}.elementor-11 .elementor-element.elementor-element-19992ed{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-11 .elementor-element.elementor-element-4f172a4{--display:flex;--flex-direction:column;--container-widget-width:100%;--container-widget-height:initial;--container-widget-flex-grow:0;--container-widget-align-self:initial;--flex-wrap-mobile:wrap;}.elementor-11 .elementor-element.elementor-element-d634e7a .elementor-heading-title{color:var( --e-global-color-accent );}.elementor-widget-text-editor{font-family:var( --e-global-typography-text-font-family ), Sans-serif;font-weight:var( --e-global-typography-text-font-weight );color:var( --e-global-color-text );}.elementor-widget-text-editor.elementor-drop-cap-view-stacked .elementor-drop-cap{background-color:var( --e-global-color-primary );}.elementor-widget-text-editor.elementor-drop-cap-view-framed .elementor-drop-cap, .elementor-widget-text-editor.elementor-drop-cap-view-default .elementor-drop-cap{color:var( --e-global-color-primary );border-color:var( --e-global-color-primary );}.elementor-11 .elementor-element.elementor-element-bba474c{color:var( --e-global-color-accent );}.elementor-11 .elementor-element.elementor-element-bba474c a{color:var( --e-global-color-accent );}:root{--page-title-display:none;}@media(max-width:767px){.elementor-11 .elementor-element.elementor-element-68c3cc0{--padding-top:0px;--padding-bottom:0px;--padding-left:20px;--padding-right:20px;}.elementor-11 .elementor-element.elementor-element-182e13d{padding:0px 10px 0px 10px;text-align:center;}.elementor-11 .elementor-element.elementor-element-b9087b6{--totals-title-alignment:center;}.elementor-11 .elementor-element.elementor-element-d634e7a{text-align:center;}.elementor-11 .elementor-element.elementor-element-bba474c{text-align:center;}}/* Start custom CSS for woocommerce-cart, class: .elementor-element-b9087b6 *//* Contenedor del botón */
.woocommerce-cart .product-remove a.remove{
    font-size: 0 !important; /* oculta la X */
    width: 24px;
    height: 24px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    margin-left: 20px;
}

/* Icono SVG como background botes de basura */
.woocommerce-cart .product-remove a.remove::before{
    content: "";
    display: block;
    width: 16px;
    height: 16px;
    background-image: url("https://colorantescitocol.com/wp-content/uploads/2025/12/eliminar.svg");
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
}

/* Hover */
.woocommerce-cart .product-remove a.remove:hover::before{
    filter: brightness(0) saturate(100%) invert(63%) sepia(67%) saturate(684%) hue-rotate(347deg) brightness(97%) contrast(95%);
}

/*.product-thumbnail img {
    min-width: 100px;
    border: solid 1px lightgra;
    padding: 10px 20px;
}*/

/*.quantity {
    pointer-events: none;
}*/

.quantity input {
    text-align: center !important;
}




/* =========================================================
   CITOCOL - Carrito (Elementor + Woo)
   Layout: (izq) texto + cupón proxy  | (der) totales
   Mobile: apila
   ========================================================= */

/* 1) GRID del panel derecho (texto + cupón proxy + totales) */
.woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column{
  display: grid !important;
  grid-template-columns: 1.35fr 1fr !important;
  gap: 60px !important;
  align-items: start !important;
  padding-top: 10px !important;
}

/* 2) TEXTO: arriba del cupón (columna izq) */
.woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .texto-cupon{
  grid-column: 1 !important;
  grid-row: 1 !important;
  margin-left: 10px !important;
}

/* 3) CUPÓN PROXY: debajo del texto (columna izq) */
.woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .coupon.citocol-coupon-proxy{
  grid-column: 1 !important;
  grid-row: 2 !important;
  width: 100% !important;
  margin: 0 !important;
}

/* 4) TOTALES: columna derecha alineado arriba */
.woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .e-cart-totals{
  grid-column: 2 !important;
  grid-row: 1 / span 2 !important;
  width: 100% !important;
  margin: 0 !important;
}

/* 4.1) Ajustes FINOS SOLO EN DESKTOP (tus márgenes negativos, pero acotados) */
@media (min-width: 768px){
  .woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .texto-cupon{
    margin-bottom: -80px !important;
  }
/* AREA DE CUPÓN */
  .woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .coupon.citocol-coupon-proxy{
    margin-top: -65px !important;
  }

  .woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .e-cart-totals{
    margin-top: -15px !important;
  }
}




/* EVITAR MOVIMIENTO DEL CUPON POR ALERTA/MENSAJE */
/* === CITOCOL: evitar que el mensaje del cupón empuje el layout === */

/* el contenedor que creamos debajo del cupón proxy */
.woocommerce-cart .coupon.citocol-coupon-proxy .citocol-proxy-coupon-notice{
  display: block;
  min-height: 60px;        /* reserva espacio aun cuando no hay mensaje */
  margin-top: 8px;         /* separación del cupón */
}

/* el <p> del mensaje: que no meta márgenes raros */
.woocommerce-cart .coupon.citocol-coupon-proxy .citocol-proxy-coupon-notice p{
  margin: 0;
}





/* 5) RESPONSIVE: apila + RESETEA márgenes negativos */
@media (max-width: 767px){
  .woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column{
    grid-template-columns: 1fr !important;
    gap: 18px !important;
    padding-top: 18px !important; /* aire arriba para que no quede pegado */
  }

  .woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .texto-cupon,
  .woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .coupon.citocol-coupon-proxy,
  .woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .e-cart-totals{
    grid-column: 1 !important;
    grid-row: auto !important;

    /* RESETEO clave: evita que se monten */
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    margin-left: 0 !important;
  }

  /* Opcional: centrar cupón en móvil si lo deseas */
  .woocommerce-cart .e-cart__column-end .e-cart__column-inner.e-sticky-right-column .coupon.citocol-coupon-proxy{
    justify-self: center;
    max-width: 460px;
  }
  
  /* Reduce espacio debajo de la tabla de productos */
.woocommerce-cart .woocommerce-cart-form{
  margin-bottom: -40px !important; /* prueba 0–15 */
 }

/* Reduce espacio después del último producto */
.woocommerce-cart .shop_table{
  margin-bottom: -40px !important;
 }

/* Reduce espacio arriba del botón */
.woocommerce-cart .wc-proceed-to-checkout{
  margin-top: 30px !important; /* prueba 10–20 */
 }

/* Reduce espacio final del carrito */
.woocommerce-cart .e-cart__column-end{
  padding-bottom: -40px !important;
}

/* Si Elementor agrega margen al widget */
.elementor-widget-woocommerce-cart{
  margin-bottom: -40px !important;
}

}

/* 6) Oculta el cupón REAL (sigue funcional para que el proxy lo use) */
.woocommerce-cart form.woocommerce-cart-form > .coupon{
  position: absolute !important;
  left: -9999px !important;
  top: auto !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  opacity: 0 !important;
  pointer-events: none !important;
}




/* FIX: que vuelvan a aparecer las miniaturas en móvil */
@media (max-width: 767px){
  .woocommerce-cart td.product-thumbnail,
  .woocommerce-cart .product-thumbnail{
    display: block !important;
    width: 100% !important;
    text-align: center;
    padding: 10px 0 !important;
  }

  /* Woo a veces mete el label con ::before y desordena */
  .woocommerce-cart td.product-thumbnail::before{
    content: "" !important;
    display: none !important;
  }

  .woocommerce-cart td.product-thumbnail img{
    display: inline-block !important;
    max-width: 120px !important;
    width: 120px !important;
    height: auto !important;
  }


  /* El td del basurero y la miniatura en la MISMA línea */
  .woocommerce-cart td.product-remove,
  .woocommerce-cart td.product-thumbnail{
    display: inline-block !important;
    float: none !important;
    width: auto !important;
    vertical-align: middle;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* Miniatura a la izquierda del basurero */
 .woocommerce-cart td.product-thumbnail{
  width: 100% !important;          /* <-- clave: ahora puede centrar */
  text-align: center !important;   /* centra el contenido dentro */
  margin: 10px 0 !important;       /* separa un poco arriba/abajo */
}


  /* Tamaño miniatura (pequeña, tipo “icono”) */
  .woocommerce-cart td.product-thumbnail img{
    width: 54px !important;
    max-width: 54px !important;
    height: auto !important;
    display: inline-block !important;
  }

  /* Asegura que el basurero no se vaya a otra línea */
  .woocommerce-cart td.product-remove{
    display: inline-block !important;
  vertical-align: middle;
  white-space: nowrap;
  margin-left: 10px !important;

  position: relative !important;
  top: 80px; /* 👈 ajusta: prueba 18px–30px */
}


  /* Quita el label “Thumbnail” si aparece */
  .woocommerce-cart td.product-thumbnail::before{
    content: "" !important;
    display: none !important;
  }
  
  /* Cantidad: label a la izquierda y valor a la derecha */
.woocommerce-cart td.product-quantity{
  text-align: right !important;
}

/* El valor (cantidad de productos) a la derecha */
.woocommerce-cart td.product-quantity .quantity,
.woocommerce-cart td.product-quantity .qty{
  margin-left: auto !important;
  text-align: right !important;
  /*display: inline-block !important;*/
 }

}







/* =========================================
   QTY (carrito): que el input SIEMPRE tenga caja visible
   ========================================= */

.woocommerce-cart td.product-quantity .quantity{
  display: inline-flex !important;
  align-items: stretch !important;
}

/* Caja del input */
.woocommerce-cart td.product-quantity .quantity input.qty{
  width: 65px !important;
  min-width: 65px !important;

  background: #fff !important;
  border: 1px solid #666 !important;        /* <-- el borde visible */
  /*border-right: 0 !important;*/               /* para que se una con botones */
  border-radius: 10px 0 0 10px !important;

  padding: 20.3px !important;
  line-height: 1 !important;
  height: auto !important;

  text-align: center !important;
  outline: none !important;                 /* quitamos el cuadrito raro */
  box-shadow: none !important;
}

/* En foco: que no se encoja ni cambie la caja */
.woocommerce-cart td.product-quantity .quantity input.qty:focus{
  border-color: #f7a31d !important;            /* o #f7a31d si quieres ya */
  outline: none !important;
  box-shadow: none !important;
}

/* Botonera: que se pegue perfecta */
.woocommerce-cart td.product-quantity .qty-buttons{
  border-radius: 0 10px 10px 0 !important;
  overflow: hidden !important;
}/* End custom CSS */
/* Start Custom Fonts CSS */@font-face {
	font-family: 'Mozilla Headline';
	font-style: normal;
	font-weight: bold;
	font-display: auto;
	src: url('https://colorantescitocol.com/wp-content/uploads/2025/12/MozillaHeadline-Bold.ttf') format('truetype');
}
@font-face {
	font-family: 'Mozilla Headline';
	font-style: normal;
	font-weight: 100;
	font-display: auto;
	src: url('https://colorantescitocol.com/wp-content/uploads/2025/12/MozillaHeadline-ExtraLight.ttf') format('truetype');
}
@font-face {
	font-family: 'Mozilla Headline';
	font-style: normal;
	font-weight: 200;
	font-display: auto;
	src: url('https://colorantescitocol.com/wp-content/uploads/2025/12/MozillaHeadline-Light.ttf') format('truetype');
}
@font-face {
	font-family: 'Mozilla Headline';
	font-style: normal;
	font-weight: 300;
	font-display: auto;
	src: url('https://colorantescitocol.com/wp-content/uploads/2025/12/MozillaHeadline-Medium.ttf') format('truetype');
}
@font-face {
	font-family: 'Mozilla Headline';
	font-style: normal;
	font-weight: normal;
	font-display: auto;
	src: url('https://colorantescitocol.com/wp-content/uploads/2025/12/MozillaHeadline-Regular.ttf') format('truetype');
}
@font-face {
	font-family: 'Mozilla Headline';
	font-style: normal;
	font-weight: 600;
	font-display: auto;
	src: url('https://colorantescitocol.com/wp-content/uploads/2025/12/MozillaHeadline-SemiBold.ttf') format('truetype');
}
/* End Custom Fonts CSS */