/**
 * El Fallero — carrito en móvil/tablet (layout apilado, <992px).
 *
 * En escritorio el carrito usa una rejilla de 4 columnas por línea
 * (título · desglose · acciones · precio) que en móvil quedaba apretada
 * (foto 1). Aquí lo reorganizamos como tarjeta vertical limpia (foto 2):
 * imagen pequeña + título + precio + fila de acciones (cantidad e icono de
 * papelera), y añadimos las garantías de confianza bajo el resumen.
 * El cupón se mantiene tal cual dentro del resumen.
 */

/* Garantías de confianza: ocultas en escritorio (allí ya se esconde el
   blockreassurance de relleno), visibles solo en el layout apilado. */
.fa-cart-trust {
  display: none;
}

/* Acción secundaria del resumen: conserva el tamaño del CTA de pago, pero
   invierte sus colores para distinguir claramente ambas decisiones. */
.page-cart .cart-grid__aside .fa-cart-summary-continue {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 50px;
  margin-top: 8px;
  padding: 12px 18px;
  border: 1px solid var(--accent);
  border-radius: 8px !important;
  background: #fff;
  color: var(--accent) !important;
  font-family: var(--sans) !important;
  font-size: 14px;
  font-weight: 800 !important;
  line-height: 1.2;
  text-align: center;
  text-decoration: none !important;
}

.page-cart .cart-grid__aside .fa-cart-summary-continue:hover,
.page-cart .cart-grid__aside .fa-cart-summary-continue:focus-visible {
  background: #eef6ff;
  color: var(--accent) !important;
}

/* El CTA del resumen es un enlace con artículos, pero PrestaShop lo cambia por
   un botón deshabilitado cuando el carrito está vacío. Conservamos la misma
   proporción del CTA para que no se convierta en una pequeña etiqueta. */
.page-cart .cart-summary__actions.checkout .btn {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 50px;
  padding: 12px 18px;
  border-radius: 9px !important;
  font-family: var(--sans) !important;
  font-size: 15px;
  font-weight: 800 !important;
  line-height: 1.2;
  text-decoration: none !important;
}

.page-cart .cart-summary__actions.checkout .btn:disabled,
.page-cart .cart-summary__actions.checkout .btn.disabled {
  border-color: #c7d2df !important;
  background: #e8eef5 !important;
  color: #718096 !important;
  cursor: not-allowed;
  opacity: 1 !important;
}

/* La línea de carrito comparte espacio con el resumen lateral en escritorio.
   La rejilla anterior exigía dos columnas centrales con mínimos muy grandes:
   al estrecharse esa zona, el importe o el selector de cantidad se salían del
   contenedor. El título y el desglose son los únicos elementos elásticos; el
   selector y el total conservan siempre el espacio que necesitan. */
.page-cart .product-line__content {
  grid-template-columns: minmax(0, 1fr) max-content max-content;
  grid-template-areas:
    "left actions price"
    "details actions price";
  gap: 12px 18px;
}

.page-cart .product-line__content-right {
  min-width: max-content;
}

.page-cart .product-line__actions,
.page-cart .product-line__quantity-button {
  min-width: 0;
}

.page-cart .product-line__quantity-button .quantity-button__group,
.page-cart .product-line__quantity-button .input-group,
.page-cart .product-line__actions .bootstrap-touchspin {
  display: inline-flex !important;
  width: 100px !important;
  min-width: 100px !important;
  max-width: none !important;
}

.page-cart .product-line__quantity-button .quantity-button__group .btn,
.page-cart .product-line__actions .bootstrap-touchspin .btn,
.page-cart .product-line__actions .bootstrap-touchspin button {
  flex: 0 0 30px;
}

.page-cart .product-line__quantity-button .js-cart-line-product-quantity,
.page-cart .product-line__actions .js-cart-line-product-quantity {
  flex: 0 0 38px;
}

@media (max-width: 991.98px) {
  /* ---- Resumen de importes ----
     En móvil conserva la misma tarjeta y jerarquía del resumen de escritorio:
     evita la versión compacta sin marco, que hacía los importes demasiado
     pequeños y visualmente desconectados del carrito. */
  .page-cart .cart-grid__aside-wrapper {
    margin-top: 0;
  }

  .page-cart .cart-summary {
    padding: 22px;
    border: 1px solid var(--rule);
    border-radius: 12px !important;
    background: #fff;
  }

  .page-cart .fa-cart-summary-title,
  .page-cart .cart-summary .cart-voucher,
  .page-cart .cart-summary .cart-voucher__accordion {
    display: none !important;
  }

  .page-cart .cart-detailed-totals .card-block {
    padding: 16px 0 14px;
    border-top: 1px solid var(--rule);
    border-bottom: 1px solid var(--rule);
  }

  .page-cart .cart-summary-line,
  .page-cart .cart-summary__line {
    min-height: 24px;
    margin: 0;
    color: var(--ink-2);
    font-size: 14px;
    line-height: 1.45;
  }

  .page-cart .cart-summary-line .value,
  .page-cart .cart-summary__value {
    font-weight: 700;
  }

  .page-cart .cart-total,
  .page-cart .cart-summary__line--bold {
    margin: 18px 0 0;
    padding: 0;
    border: 0;
    font-size: 18px;
  }

  .page-cart .cart-total .value,
  .page-cart .cart-summary__line--bold .cart-summary__value {
    font-size: 24px;
  }

  .page-cart .cart-detailed-actions,
  .page-cart .checkout {
    margin-top: 12px;
  }

  .page-cart .cart-detailed-actions .btn,
  .page-cart .cart-detailed-actions a,
  .page-cart .cart-detailed-actions button,
  .page-cart .checkout a,
  .page-cart .checkout button,
  .page-cart .fa-cart-summary-continue {
    width: 100%;
    min-height: 38px;
    border-radius: 5px !important;
    font-size: 10px;
    font-weight: 800 !important;
    letter-spacing: 0;
    text-transform: uppercase;
  }

  .page-cart .cart-detailed-actions a::after,
  .page-cart .checkout a::after {
    content: none;
  }

  .page-cart .cart-grid__aside .fa-cart-summary-continue {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    margin-top: 8px;
    border: 1px solid var(--accent);
    background: #fff;
    color: var(--accent) !important;
    font-size: 10px;
    text-decoration: none;
  }

  .page-cart .cart-grid__content .cart__continue-shopping {
    display: none;
  }

  /* La referencia solo muestra el resumen y sus dos acciones. */
  .page-cart .fa-cart-trust {
    display: none;
  }

  /* El subtotal es una línea de texto, no una insignia. */
  .page-cart #cart-subtotal-products .label,
  .page-cart .cart-summary-line .label {
    display: block !important;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    color: var(--ink-2) !important;
    font-size: 14px !important;
    font-weight: 400 !important;
  }

  .page-cart .cart-summary-line,
  .page-cart .cart-summary__line--bold {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
    gap: 12px !important;
  }

  .page-cart .fa-cart-tax-note {
    font-size: 8px;
    font-weight: 400;
  }

  /* ---- Tarjeta de producto ---- */
  .page-cart .product-line {
    grid-template-columns: 96px minmax(0, 1fr);
    gap: 14px;
    align-items: start;
  }

  .page-cart .product-line__image {
    width: 96px;
  }

  .page-cart .product-line-grid-left img,
  .page-cart .product-image img,
  .page-cart .cart-item img,
  .page-cart .product-line__img {
    width: 96px;
    height: 96px;
    /* Aprovecha el marco sin recortar el producto. */
    padding: 4px;
  }

  /* La rejilla horizontal de escritorio pasa a pila vertical. */
  .page-cart .product-line__content {
    grid-template-columns: minmax(0, 1fr);
    grid-template-areas:
      "title"
      "price"
      "actions";
    gap: 8px;
    align-items: stretch;
  }

  .page-cart .product-line__content-left {
    grid-area: title;
  }

  .page-cart .product-line__title {
    font-size: 15px;
    line-height: 1.3;
  }

  /* Un único precio (el total de la línea), en negrita a la izquierda.
     El desglose "Precio unitario" se omite en móvil para aligerar. */
  .page-cart .product-line__content-right {
    grid-area: price;
    justify-items: start;
    align-self: start;
  }

  .page-cart .product-line__price {
    font-size: 18px;
  }

  .page-cart .product-line__item-price.fa-cart-price-breakdown {
    display: none !important;
  }

  /* Fila de acciones: cantidad a la izquierda, papelera a la derecha. */
  .page-cart .product-line__actions {
    grid-area: actions;
    display: flex;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: space-between;
    justify-self: stretch;
    width: 100%;
    gap: 12px;
    min-width: 0;
  }

  /* "Quitar" pasa a icono de papelera. El texto se oculta (font-size:0),
     el aria-label del enlace conserva la etiqueta accesible. */
  .page-cart .product-line__actions a.js-remove-from-cart,
  .page-cart .product-line__actions a.remove-from-cart {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 40px;
    height: 40px;
    padding: 0;
    border: 1.5px solid var(--rule-2);
    border-radius: 8px;
    font-size: 0 !important;
    line-height: 1;
  }

  .page-cart .product-line__actions a.js-remove-from-cart::before,
  .page-cart .product-line__actions a.remove-from-cart::before {
    content: "\E872"; /* delete / papelera */
    font-family: "Material Icons";
    font-size: 21px;
    line-height: 1;
    color: var(--muted);
  }

  .page-cart .product-line__actions a.js-remove-from-cart:hover::before,
  .page-cart .product-line__actions a.remove-from-cart:hover::before {
    color: var(--accent);
  }

  /* ---- Botones a ancho completo ---- */
  .page-cart .cart__continue-shopping {
    width: 100%;
    justify-content: center;
  }

  /* ---- Garantías de confianza ---- */
  .fa-cart-trust {
    display: grid;
    gap: 14px;
    margin-top: 18px;
    padding-top: 18px;
    border-top: 1px solid var(--rule);
  }

  .fa-cart-trust__item {
    display: grid;
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 13px;
    align-items: center;
  }

  .fa-cart-trust__icon {
    display: grid;
    place-items: center;
    width: 40px;
    height: 40px;
    border-radius: 11px;
    color: var(--accent);
    background: var(--paper-2);
  }

  .fa-cart-trust__icon svg {
    width: 22px;
    height: 22px;
  }

  .fa-cart-trust__body {
    min-width: 0;
  }

  .fa-cart-trust__title {
    color: var(--dark);
    font-family: var(--sans);
    font-size: 14px;
    font-weight: 800;
    line-height: 1.2;
  }

  .fa-cart-trust__desc {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.35;
  }

  .fa-cart-trust__desc--accent {
    color: #227a3d;
    font-weight: 700;
  }

  .page-cart .fa-cart-trust {
    display: none;
  }
}
