/* =====================================================================
   PLAYBCN - CARRITO EN MÓVIL (30-10-2026)
   X de borrar grande (40px) y cada artículo como tarjeta en pantallas pequeñas.
   Solo afecta a #shoppingCartDefault. Para quitarlo, basta con borrar el archivo.
===================================================================== */
/* ======================= CARRITO MÓVIL ======================= */
/* ---------- Botón borrar artículo: X grande y fácil de pulsar ---------- */
#shoppingCartDefault td.cartRemoveItemDisplay { text-align: center !important; vertical-align: top !important; }
#shoppingCartDefault td.cartRemoveItemDisplay a {
  display: inline-flex !important; align-items: center; justify-content: center;
  width: 40px; height: 40px; border-radius: 50%; border: 1px solid #ddd; background: #fff;
  font-size: 0 !important; line-height: 1; text-decoration: none !important; color: #111 !important;
  transition: border-color .2s, background .2s;
}
#shoppingCartDefault td.cartRemoveItemDisplay a:before { content: "\00D7"; font-size: 24px; font-weight: 300; }
#shoppingCartDefault td.cartRemoveItemDisplay a:hover { border-color: #111; background: #f6f6f6; }
#shoppingCartDefault td.cartRemoveItemDisplay a img { display: none !important; }

/* ---------- Móvil: cada artículo como una tarjeta (sin columnas apretadas) ---------- */
@media only screen and (max-width: 600px) {
  #shoppingCartDefault #cartContentsDisplay,
  #shoppingCartDefault #cartContentsDisplay tbody { display: block !important; width: 100% !important; }
  #shoppingCartDefault #cartContentsDisplay tr.tableHeading { display: none !important; }
  #shoppingCartDefault #cartContentsDisplay tr.rowEven,
  #shoppingCartDefault #cartContentsDisplay tr.rowOdd {
    display: grid !important; grid-template-columns: 1fr auto; grid-template-areas: "prod del" "qty total";
    align-items: center; row-gap: 12px; column-gap: 10px;
    border-bottom: 1px solid #eee; padding: 16px 0 !important;
  }
  #shoppingCartDefault #cartContentsDisplay tr.rowEven td,
  #shoppingCartDefault #cartContentsDisplay tr.rowOdd td { display: block !important; border: 0 !important; padding: 0 !important; width: auto !important; }
  #shoppingCartDefault td.cartProductDisplay { grid-area: prod; }
  #shoppingCartDefault td.cartRemoveItemDisplay { grid-area: del; align-self: start; }
  #shoppingCartDefault td.cartQuantity { grid-area: qty; padding-left: 98px !important; }
  #shoppingCartDefault td.cartTotalDisplay { grid-area: total; text-align: right !important; white-space: nowrap; }
  #shoppingCartDefault #cartContentsDisplay tr td.cartQuantityUpdate,
  #shoppingCartDefault #cartContentsDisplay tr td.cartUnitDisplay { display: none !important; }
  #shoppingCartDefault #cartContentsDisplay tr.rowEven, #shoppingCartDefault #cartContentsDisplay tr.rowOdd { height: auto !important; min-height: 0 !important; }
  #shoppingCartDefault #cartContentsDisplay tr td { height: auto !important; margin: 0 !important; }
  #shoppingCartDefault #cartContentsDisplay tr td.cartProductDisplay { display: flow-root !important; }
  #shoppingCartDefault #cartProdTitle { max-height: none !important; word-break: normal !important; overflow-wrap: break-word; }
}