/** Shopify CDN: Minification failed

Line 9:0 Unexpected "{"
Line 9:1 Expected identifier but found "%"
Line 162:0 Unexpected "{"
Line 162:1 Expected identifier but found "%"

**/
{% stylesheet %}
/* =========================
   CART — FIGMA OVERRIDES
   ========================= */

/* Ancho y respiración tipo Figma */
.section--page-width .cart-page{
  max-width: 1200px;
  margin: 0 auto;
}

/* Quitar el sidebar look si no lo quieres “panel” */
.cart-page__summary{
  background: transparent !important;
}

/* ----- TABLA: cabecera visual (Producto / Tamaño / Cantidad / Precio) ----- */
/* Horizon oculta thead; creamos una “falsa cabecera” usando :before */
.cart-items__table{
  position: relative;
}

.cart-items__wrapper:not(:has(.cart-items__empty-button)) .cart-items__table::before{
  content: "PRODUCTO                           TAMAÑO                 CANTIDAD                 PRECIO";
  display: block;
  font-size: 11px;
  letter-spacing: .04em;
  text-transform: uppercase;
  color: rgba(0,0,0,.65);
  padding: 12px 0 10px;
  border-bottom: 1px solid rgba(0,0,0,.12);
}

/* ----- FILAS ----- */
.cart-items__table-row{
  border-bottom: 1px solid rgba(0,0,0,.12);
  padding: 18px 0;
  margin: 0;
}

/* Desktop: 4 columnas como Figma */
@media (min-width: 750px){
  .cart-items__table-row{
    grid-template-columns: 120px 1fr 170px 120px;
    grid-template-areas: "media details quantity price";
    column-gap: 24px;
    align-items: start;
  }

  .cart-items__media{ align-self: start; }
  .cart-items__details{ align-self: start; }
  .cart-items__quantity{ justify-self: start; }
  .cart-items__price{ justify-self: end; text-align: right; }
}

/* Imagen y título como en Figma */
.cart-items__media-container{
  border-radius: 0 !important;
}
.cart-items__title{
  font-weight: 700;
  font-size: 12px;
  text-transform: uppercase; /* si en Figma está en mayúsculas */
  letter-spacing: .02em;
}

/* Variantes (tamaño) que aparezcan como “TAMAÑO 250ml” */
.cart-items__variants-wrapper{
  color: rgba(0,0,0,.65);
  font-size: 12px;
}

/* Botón eliminar: más discreto */
.cart-items__remove{
  opacity: .6;
}
.cart-items__remove:hover{
  opacity: 1;
}

/* ----- RESUMEN / TOTAL ----- */
.cart-page__summary{
  padding-top: 0;
}
.cart__summary-totals{
  border: 0;
}
.cart__total-container{
  align-items: flex-end;
}
.cart__total-label{
  font-size: 12px;
  text-transform: uppercase;
  letter-spacing: .04em;
}
.cart__total-value{
  font-size: 14px;
  font-weight: 700;
}

/* Botón continuar (checkout) estilo Figma (negro, ancho fijo) */
.cart__ctas .button,
.cart__checkout-button{
  border-radius: 0 !important;
  background: #000 !important;
  color: #fff !important;
  text-transform: uppercase;
  font-size: 11px;
  letter-spacing: .06em;
  padding: 14px 22px;
  width: 220px;
  justify-self: end;
}

/* ----- EMPTY CART (cuando está vacío) ----- */
.cart-page--empty{
  align-items: flex-start;
}
.cart-page--empty .cart-title{
  text-align: left;
}
.cart-items__empty-button{
  border-radius: 0 !important;
  background:#000 !important;
  color:#fff !important;
}

/* ----- MOBILE: se apila como tu Figma móvil ----- */
@media (max-width: 749px){
  .cart-items__table::before{
    content: "PRODUCTO";
  }

  .cart-items__table-row{
    grid-template-columns: 90px 1fr;
    grid-template-areas:
      "media details"
      "media quantity"
      "media price";
    column-gap: 16px;
  }

  .cart-items__price{
    text-align: left;
    justify-self: start;
  }

  .cart__ctas .button,
  .cart__checkout-button{
    width: 100%;
    justify-self: stretch;
  }
}
{% endstylesheet %}