.mm-cart-page {
  box-sizing: border-box;
  width: 100%;
  max-inline-size: 100%;
  min-inline-size: 0;
  overflow-x: clip;
}

/* Storefront ensancha los `.alignwide` con `margin: 0 calc(25% - 25vw)` desde
   gutenberg-blocks.css (@media >= 66.4989em). Dentro del shell eso saca al
   bloque fuera del contenedor y el `overflow-x: clip` de arriba se come lo que
   sobresale: 8px a 1440, 60px a 1680, 140px a 2000.
   Vale para el carrito y para el checkout —el wrapper del checkout también
   lleva `mm-cart-page`—, así que se acota al hijo directo y no al bloque por
   nombre.
   El `!important` es el único recurso que queda: la regla de Storefront tiene
   cinco clases y este archivo debe empezar todos sus selectores por el wrapper,
   así que no hay forma de ganarle por especificidad sin salirse del scope. */
.mm-cart-page > .alignwide {
  margin-left: 0 !important;
  margin-right: 0 !important;
  width: 100% !important;
  max-width: 100% !important;
}

.mm-cart-shell {
  --mm-cart-shell-ink: #171a16;
  --mm-cart-shell-dark: #171a16;
  --mm-cart-shell-muted: var(--muted, #596055);
  --mm-cart-shell-line: #d9d5c9;
  --mm-cart-shell-lime: #9bc51e;
  --mm-cart-shell-soft: #eef6d4;
  --mm-cart-shell-green: var(--focus, #315c27);
  --mm-cart-shell-amber: #b8791e;
  --mm-cart-shell-surface: #fffefa;
  --mm-cart-shell-paper: #f6f3ea;
  box-sizing: border-box;
  width: 100%;
  max-inline-size: 100%;
  min-inline-size: 0;
  overflow-x: clip;
  color: var(--mm-cart-shell-ink);
}

.mm-cart-shell *,
.mm-cart-shell *::before,
.mm-cart-shell *::after {
  box-sizing: border-box;
  min-inline-size: 0;
}

.mm-cart-shell.wc-block-cart {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 28rem);
  align-items: start;
  gap: clamp(24px, 4vw, 48px);
}

.mm-cart-shell.mm-cart-shell--ready.wc-block-cart {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(18rem, 28rem);
}

.mm-cart-shell.mm-cart-shell--ready .wc-block-cart__sidebar {
  display: flex;
  flex-direction: column;
}

.mm-cart-shell.mm-cart-shell--ready .wp-block-woocommerce-cart-order-summary-block {
  order: 1;
}

.mm-cart-shell.mm-cart-shell--ready .mm-cart-presentation__summary {
  order: 2;
}

.mm-cart-shell.mm-cart-shell--ready .wc-block-cart__submit,
.mm-cart-shell.mm-cart-shell--ready .wc-block-cart__submit-container {
  order: 3;
}

.mm-cart-shell.mm-cart-shell--ready .wp-block-woocommerce-cart-accepted-payment-methods-block {
  order: 4;
}

.mm-cart-shell.mm-cart-shell--ready .wp-block-woocommerce-cart-order-summary-shipping-block {
  display: none;
}

.mm-cart-shell .mm-cart-presentation__header {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 16px;
  margin-block-end: 20px;
}

.mm-cart-shell .mm-cart-presentation__title,
.mm-cart-shell .mm-cart-presentation__count,
.mm-cart-shell .mm-cart-presentation__delivery {
  margin: 0;
}

.mm-cart-shell .mm-cart-presentation__title {
  color: var(--mm-cart-shell-ink);
  font-family: "Arial Narrow", "Roboto Condensed", Arial, sans-serif;
  font-size: clamp(1.75rem, 3vw, 2.5rem);
  font-weight: 800;
  letter-spacing: -0.025em;
  line-height: 1.1;
}

.mm-cart-shell .mm-cart-presentation__count,
.mm-cart-shell .mm-cart-presentation__delivery {
  color: var(--mm-cart-shell-muted);
}

.mm-cart-shell .mm-cart-presentation__summary {
  display: grid;
  gap: 8px;
  margin-block-start: 20px;
  padding-block-start: 20px;
  border-block-start: 1px solid var(--mm-cart-shell-line);
}

.mm-cart-shell .mm-cart-presentation__delivery {
  margin-block-start: 8px;
  white-space: pre-line;
}

.mm-cart-shell .wc-block-cart__main,
.mm-cart-shell .wc-block-cart__sidebar,
.mm-cart-shell .wc-block-cart-items,
.mm-cart-shell .wc-block-cart__submit-container {
  width: 100%;
  max-inline-size: 100%;
  min-inline-size: 0;
}

.mm-cart-shell .wc-block-cart__main {
  grid-column: 1;
}

.mm-cart-shell .wc-block-cart__sidebar {
  grid-column: 2;
  align-self: start;
  color: var(--mm-cart-shell-ink);
}

.mm-cart-shell .wc-block-cart-items {
  table-layout: fixed;
  overflow-wrap: anywhere;
}

.mm-cart-shell .wc-block-cart__submit-container {
  overflow-wrap: anywhere;
}

.mm-cart-shell .wc-block-cart__submit-button {
  display: flex;
  align-items: center;
  justify-content: center;
  min-block-size: 52px;
  padding: 12px 18px;
  background: var(--mm-cart-shell-dark);
  color: var(--mm-cart-shell-surface);
  font-weight: 800;
  text-decoration: none;
}

.mm-cart-shell .wc-block-cart__main > *,
.mm-cart-shell .wc-block-cart__sidebar > * {
  max-inline-size: 100%;
}

.mm-cart-shell button,
.mm-cart-shell input,
.mm-cart-shell select,
.mm-cart-shell textarea,
.mm-cart-shell a {
  max-inline-size: 100%;
  font: inherit;
}

.mm-cart-shell button:focus-visible,
.mm-cart-shell input:focus-visible,
.mm-cart-shell select:focus-visible,
.mm-cart-shell textarea:focus-visible,
.mm-cart-shell a:focus-visible {
  outline: 3px solid var(--mm-cart-shell-lime);
  outline-offset: 2px;
}

.mm-cart-shell a {
  color: var(--mm-cart-shell-green);
  text-underline-offset: 3px;
}

.mm-cart-shell.mm-cart-shell--loading {
  border-block-start: 2px solid var(--mm-cart-shell-lime);
  background-color: var(--mm-cart-shell-paper);
}

.mm-cart-shell.mm-cart-shell--loading .wc-block-cart__main,
.mm-cart-shell.mm-cart-shell--loading .wc-block-cart__sidebar {
  min-inline-size: 0;
}

.mm-cart-page.mm-cart-shell--empty .wp-block-woocommerce-empty-cart-block {
  max-inline-size: 100%;
  min-inline-size: 0;
  padding: 24px;
  border: 1px solid var(--mm-cart-shell-line);
  background-color: var(--mm-cart-shell-paper);
  color: var(--mm-cart-shell-muted);
  overflow-wrap: anywhere;
}

.mm-cart-page .mm-cart-state {
  width: 100%;
  max-inline-size: 48rem;
  min-inline-size: 0;
  margin-block-start: 24px;
  padding: clamp(20px, 4vw, 32px);
  border: 1px solid var(--mm-cart-shell-line);
  border-inline-start: 4px solid var(--mm-cart-shell-lime);
  background-color: var(--mm-cart-shell-paper);
  color: var(--mm-cart-shell-ink);
  overflow-wrap: anywhere;
}

.mm-cart-page.mm-cart-shell--error .mm-cart-state {
  border-inline-start-color: #a64b25;
}

.mm-cart-page .mm-cart-state__title,
.mm-cart-page .mm-cart-state__copy {
  margin: 0;
}

.mm-cart-page .mm-cart-state__title {
  font-size: clamp(1.4rem, 3vw, 2rem);
  line-height: 1.15;
}

.mm-cart-page .mm-cart-state__copy {
  margin-block-start: 8px;
  color: var(--mm-cart-shell-muted);
}

.mm-cart-page .mm-cart-state__action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-block-size: 44px;
  margin-block-start: 20px;
  padding: 10px 18px;
  background-color: var(--mm-cart-shell-dark);
  color: var(--mm-cart-shell-surface);
  font-weight: 700;
  text-decoration: none;
}

.mm-cart-page .mm-cart-state__action:focus-visible,
.mm-cart-page .mm-cart-cross-sell__product:focus-visible {
  outline: 3px solid var(--mm-cart-shell-lime);
  outline-offset: 3px;
}

.mm-cart-page .mm-cart-cross-sell {
  width: 100%;
  max-inline-size: 48rem;
  min-inline-size: 0;
  margin-block-start: clamp(32px, 5vw, 56px);
  padding-block-start: 24px;
  border-block-start: 1px solid var(--mm-cart-shell-line);
}

.mm-cart-page .mm-cart-cross-sell__title,
.mm-cart-page .mm-cart-cross-sell__context,
.mm-cart-page .mm-cart-cross-sell__name,
.mm-cart-page .mm-cart-cross-sell__price {
  margin: 0;
}

.mm-cart-page .mm-cart-cross-sell__title {
  color: var(--mm-cart-shell-ink);
  font-size: clamp(1.4rem, 3vw, 2rem);
  line-height: 1.15;
}

.mm-cart-page .mm-cart-cross-sell__context {
  margin-block-start: 6px;
  color: var(--mm-cart-shell-muted);
}

.mm-cart-page .mm-cart-cross-sell__product {
  display: grid;
  grid-template-columns: minmax(0, 7rem) minmax(0, 1fr);
  align-items: center;
  gap: 8px 18px;
  margin-block-start: 18px;
  padding: 16px;
  border: 1px solid var(--mm-cart-shell-line);
  background-color: var(--mm-cart-shell-surface);
  color: var(--mm-cart-shell-ink);
  text-decoration: none;
  overflow-wrap: anywhere;
}

.mm-cart-page .mm-cart-cross-sell__image {
  grid-row: 1 / span 2;
}

.mm-cart-page .mm-cart-cross-sell__image img {
  width: 100%;
  max-inline-size: 7rem;
  block-size: auto;
}

.mm-cart-page .mm-cart-cross-sell__name {
  align-self: end;
  font-weight: 700;
}

.mm-cart-page .mm-cart-cross-sell__price {
  align-self: start;
  color: var(--mm-cart-shell-muted);
}

.mm-cart-page .mm-cart-appointment {
  margin-block-end: 24px;
  padding: clamp(16px, 2.4vw, 22px);
  border: 1px solid var(--mm-cart-shell-line);
  border-inline-start: 5px solid var(--mm-cart-shell-lime);
  background: var(--mm-cart-shell-surface);
  color: var(--mm-cart-shell-ink);
  min-inline-size: 0;
}

.mm-cart-page .mm-cart-appointment[data-state="active"] {
  border-inline-start-color: var(--mm-cart-shell-lime);
  background: var(--mm-cart-shell-surface);
}

.mm-cart-page .mm-cart-appointment[data-state="warning"] {
  border-inline-start-color: var(--mm-cart-shell-amber);
  background: #fff6e6;
}

.mm-cart-page .mm-cart-appointment[data-state="expired"],
.mm-cart-page .mm-cart-appointment[data-state="unverified"] {
  border-inline-start-color: var(--mm-cart-shell-amber);
  background: #fff6e6;
}

.mm-cart-page .mm-cart-appointment__summary {
  display: grid;
  grid-template-columns: minmax(0, 1.2fr) minmax(13rem, 0.9fr) auto;
  gap: 18px 28px;
  align-items: center;
}

.mm-cart-page .mm-cart-appointment__eyebrow,
.mm-cart-page .mm-cart-appointment__title,
.mm-cart-page .mm-cart-appointment__explanation,
.mm-cart-page .mm-cart-appointment__facts p,
.mm-cart-page .mm-cart-appointment__message,
.mm-cart-page .mm-cart-appointment__selector h3 {
  margin: 0;
}

.mm-cart-page .mm-cart-appointment__eyebrow {
  color: var(--mm-cart-shell-muted);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0.08em;
  text-transform: uppercase;
}

.mm-cart-page .mm-cart-appointment__title {
  margin-block-start: 5px;
  font-family: "Arial Narrow", "Roboto Condensed", Arial, sans-serif;
  font-size: clamp(1.25rem, 2.4vw, 1.75rem);
  font-weight: 800;
  letter-spacing: -0.018em;
  line-height: 1.15;
}

.mm-cart-page .mm-cart-appointment__explanation,
.mm-cart-page .mm-cart-appointment__facts {
  color: var(--mm-cart-shell-muted);
}

.mm-cart-page .mm-cart-appointment__explanation {
  margin-block-start: 7px;
  max-inline-size: 56ch;
}

.mm-cart-page .mm-cart-appointment__date,
.mm-cart-page .mm-cart-appointment__time {
  color: var(--mm-cart-shell-ink);
  font-weight: 800;
}

.mm-cart-page .mm-cart-appointment__countdown {
  margin-block-start: 7px;
  color: var(--mm-cart-shell-ink);
  font-variant-numeric: tabular-nums;
}

.mm-cart-page .mm-cart-appointment__actions,
.mm-cart-page .mm-cart-appointment__selector-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: flex-end;
}

.mm-cart-page .mm-cart-appointment button,
.mm-cart-page .mm-installation-day-card,
.mm-cart-page .mm-installation-slot {
  min-block-size: 44px;
  border: 1px solid var(--mm-cart-shell-ink);
  background: transparent;
  color: var(--mm-cart-shell-ink);
  font: inherit;
  font-weight: 750;
  cursor: pointer;
}

.mm-cart-page .mm-cart-appointment button:disabled {
  cursor: not-allowed;
  opacity: 0.48;
}

.mm-cart-page .mm-cart-appointment__change,
.mm-cart-page .mm-cart-appointment__confirm {
  padding: 10px 18px;
  background: var(--mm-cart-shell-ink);
  color: #fff;
}

.mm-cart-page .mm-cart-appointment__remove,
.mm-cart-page .mm-cart-appointment__close {
  padding: 10px 14px;
}

.mm-cart-page .mm-cart-appointment__selector {
  margin-block-start: 22px;
  padding-block-start: 22px;
  border-block-start: 1px solid var(--mm-cart-shell-line);
}

.mm-cart-page .mm-cart-appointment__selector-heading {
  display: flex;
  align-items: start;
  justify-content: space-between;
  gap: 16px;
}

.mm-cart-page .mm-cart-appointment__days,
.mm-cart-page .mm-cart-appointment__slots {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 10px;
  margin-block-start: 18px;
}

.mm-cart-page .mm-installation-day-card {
  display: grid;
  gap: 3px;
  min-inline-size: 0;
  padding: 12px;
  text-align: start;
}

.mm-cart-page .mm-installation-day-card[aria-pressed="true"],
.mm-cart-page .mm-installation-slot[aria-pressed="true"] {
  border-color: #315c27;
  box-shadow: inset 0 0 0 2px var(--mm-cart-shell-lime);
}

.mm-cart-page .mm-installation-day-card__relative,
.mm-cart-page .mm-installation-day-card__availability {
  color: var(--mm-cart-shell-muted);
  font-size: 0.82rem;
}

.mm-cart-page .mm-installation-slot {
  padding: 11px 10px;
  font-variant-numeric: tabular-nums;
}

.mm-cart-page .mm-cart-appointment__selector-actions,
.mm-cart-page .mm-cart-appointment__message {
  margin-block-start: 16px;
}

.mm-cart-page .mm-cart-appointment:focus-visible,
.mm-cart-page .mm-cart-appointment button:focus-visible {
  outline: 3px solid var(--mm-cart-shell-lime);
  outline-offset: 3px;
}

.mm-cart-page [aria-disabled="true"].wc-block-cart__submit-button {
  cursor: not-allowed;
  opacity: 0.55;
}

.mm-cart-page .mm-cart-resolution-action {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-block-size: 44px;
  padding: 10px 14px;
  border: 1px solid var(--mm-cart-shell-amber);
  background: #fff6e6;
  color: var(--mm-cart-shell-ink);
  font: inherit;
  font-weight: 800;
  cursor: pointer;
}

.mm-cart-page .mm-cart-resolution-action:focus-visible {
  outline: 3px solid var(--mm-cart-shell-lime);
  outline-offset: 3px;
}

/* H8 — el resumen del pedido se pisaba a sí mismo. Son DOS defectos con la
   misma causa, no uno: el item es un flex y sus columnas traen `flex-shrink: 1`
   con `min-width: 0`, así que se comprimen por debajo de su contenido y lo
   que sobra se derrama sobre el vecino.

   El checkout NO colapsa a una columna: a 810 px su barra lateral se queda en
   272 px y el item del resumen en 221. Ahí dentro, medido el 18/08:

   1. La caja de la miniatura se comprimía a 16,5 px, pero la `<img>` sigue
      clavada en 48 px por el CSS de WooCommerce. Tapaba la F de «Fender».
   2. La columna del precio se comprimía a 15 px para un texto de 52 px.
      Como va alineada a la derecha, el precio se derramaba 37 px hacia la
      IZQUIERDA, encima del nombre: solape real de 25×15 px.

   Arreglar solo (1) empeora (2) —la miniatura recupera sus 48 px y se los
   quita al texto—, así que las dos van juntas o ninguna.

   Van SIN media query a propósito: el defecto no depende del ancho de la
   pantalla sino de lo angosta que quede la barra lateral, así que la regla
   protege también si Woo mueve sus propios puntos de quiebre. */
.mm-cart-page .wc-block-components-order-summary-item__image {
  flex-shrink: 0;
  min-inline-size: 48px;
}

.mm-cart-page .wc-block-components-order-summary-item__total-price {
  flex-shrink: 0;
}

@media (max-width: 960px) {
  .mm-cart-shell.wc-block-cart,
  .mm-cart-shell.mm-cart-shell--ready.wc-block-cart {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  .mm-cart-shell .wc-block-cart__main,
  .mm-cart-shell .wc-block-cart__sidebar {
    grid-column: 1;
  }

  .mm-cart-shell .wc-block-cart__sidebar {
    position: static;
    inset: auto;
  }

  /* H7 — punto de quiebre intermedio para la franja de la cita.
     Las tres columnas del resumen (`1.2fr · minmax(13rem,.9fr) · auto`) solo
     colapsaban en ≤720, así que entre 721 y 960 seguían las tres. Medido a
     810 px el 18/08: la reja repartía 189 · 208 · 280 px, y la columna del
     TEXTO —declarada como la más ancha— quedaba en la más angosta de las
     tres, aplastada por el mínimo de 13rem del medio y los 280 px de los
     botones. «Instalación en MotoMundo» y «La instalación se paga en el
     local» partían en dos líneas cada una.
     Acá el texto y los datos van a mitades iguales (~352 px a 810) y los
     botones bajan a su propia fila. En ≤720 el bloque siguiente vuelve a
     colapsar todo a una sola columna. */
  .mm-cart-page .mm-cart-appointment__summary {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .mm-cart-page .mm-cart-appointment__actions {
    grid-column: 1 / -1;
    justify-content: flex-start;
  }
}

@media (max-width: 720px) {
  /* La compensación de la barra fija cuelga del BODY, no del carrito.
     Hasta el 13/08 vivía en `.mm-cart-page`. Como el pie del sitio va después
     de ese wrapper, el padding abría un hueco blanco a media página y dejaba
     los últimos 68 px del pie bajo la barra —medido en 360 y 390 durante R7—,
     con "Mi cuenta" y el copyright inalcanzables. En el body, el espacio queda
     al final del documento y todo el contenido puede subir por encima. */
  body[data-mm-cart-mobile-bar="active"] {
    padding-block-end: calc(12.5rem + env(safe-area-inset-bottom, 0px));
  }

  .mm-cart-shell.wc-block-cart,
  .mm-cart-shell.mm-cart-shell--ready.wc-block-cart {
    grid-template-columns: minmax(0, 1fr);
    gap: 24px;
  }

  .mm-cart-shell .wc-block-cart__main,
  .mm-cart-shell .wc-block-cart__sidebar {
    grid-column: 1;
  }

  .mm-cart-shell .wc-block-cart__sidebar {
    position: static;
    inset: auto;
  }

  .mm-cart-shell[data-mm-cart-mobile-bar="active"] .wc-block-cart__submit-container {
    position: fixed;
    z-index: 40;
    inset-inline: 0;
    inset-block-end: 0;
    width: 100%;
    margin: 0;
    padding: 8px max(16px, calc((100vw - 72rem) / 2)) calc(10px + env(safe-area-inset-bottom, 0px));
    background: var(--mm-cart-shell-surface);
  }

  .mm-cart-shell[data-mm-cart-mobile-bar="active"] .wc-block-components-totals-footer-item {
    position: fixed;
    z-index: 40;
    inset-inline: 0;
    inset-block-end: calc(70px + env(safe-area-inset-bottom, 0px));
    width: 100%;
    margin: 0;
    padding: 10px 16px 8px;
    border-block-start: 1px solid var(--mm-cart-shell-line);
    background: var(--mm-cart-shell-surface);
  }

  .mm-cart-shell[data-mm-cart-mobile-bar="active"] .wc-block-components-totals-footer-item .wc-block-components-totals-item {
    max-inline-size: 72rem;
    margin-inline: auto;
  }

  .mm-cart-shell[data-mm-cart-mobile-bar="active"] .wc-block-components-totals-footer-item .mm-cart-resolution-action {
    width: 100%;
    margin-block-start: 8px;
  }

  .mm-cart-shell[data-mm-cart-mobile-bar="active"] .wc-block-cart__submit-button {
    width: 100%;
    min-block-size: 52px;
    background: var(--mm-cart-shell-dark);
    color: var(--mm-cart-shell-surface);
  }

  .mm-cart-shell[data-mm-cart-mobile-bar="active"] .wc-block-cart__submit-container[data-mm-cart-blocked="true"] .wc-block-cart__submit-button {
    border: 1px solid var(--mm-cart-shell-line);
    background: var(--mm-cart-shell-paper);
    color: var(--mm-cart-shell-muted);
    opacity: 0.72;
  }

  .mm-cart-shell .wc-block-components-product-name {
    display: inline-flex;
    align-items: center;
    min-block-size: 44px;
    padding-block: 8px;
  }

  .mm-cart-shell .wc-block-cart-item__remove-link {
    display: inline-flex;
    align-items: center;
    min-block-size: 44px;
    padding-block: 8px;
  }

  .mm-cart-shell .wc-block-components-quantity-selector__input {
    min-inline-size: 44px;
    min-block-size: 44px;
  }

  .mm-cart-page .mm-cart-state,
  .mm-cart-page .mm-cart-cross-sell {
    max-inline-size: 100%;
  }

  .mm-cart-page .mm-cart-cross-sell__product {
    grid-template-columns: minmax(0, 5rem) minmax(0, 1fr);
  }

  .mm-cart-page .mm-cart-appointment__summary {
    grid-template-columns: minmax(0, 1fr);
  }

  .mm-cart-page .mm-cart-appointment__actions,
  .mm-cart-page .mm-cart-appointment__selector-actions {
    justify-content: flex-start;
  }

  .mm-cart-page .mm-cart-appointment__days,
  .mm-cart-page .mm-cart-appointment__slots {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}

@media (prefers-reduced-motion: reduce) {
  .mm-cart-shell,
  .mm-cart-shell * {
    animation-duration: 0.01ms;
    animation-iteration-count: 1;
    scroll-behavior: auto;
    transition-duration: 0.01ms;
  }
}