/*
 * Dueño: C2-Bb. El carrito de NOCTTIVO: la página /cart (sections/at-bb-carrito.liquid), el cajón
 * (sections/at-bb-cajon.liquid), los renglones y el resumen que comparten (snippets/at-bb-renglones y
 * at-bb-resumen) y la lista de productos de abajo (sections/at-bb-lista-productos.liquid).
 * Escrito de cero para Antropify con las medidas de la tienda de la marca (cliente-1/referencia).
 * El layout (C2-Ba) carga esta hoja en todas las páginas: el cajón está en todas, menos en /cart.
 */

/* ── Lo común ──────────────────────────────────────────────────────────────────────────────────────── */
.at-carrito,
.at-cajon__ventana,
.at-lista {
  color: #000;
  font-family: var(--at-fuente-cuerpo, Inter, sans-serif);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
}
:where(.at-carrito, .at-cajon__ventana) .at-oculto {
  position: absolute !important;
  width: 1px;
  height: 1px;
  margin: -1px;
  padding: 0;
  overflow: hidden;
  clip: rect(0 0 0 0);
  white-space: nowrap;
  border: 0;
}
:where(.at-carrito, .at-cajon__ventana) a { color: currentColor; text-decoration-color: transparent; text-decoration-thickness: .075em; text-underline-offset: .125em; }

/* El botón negro (Seguir comprando, Aplicar, Pagar): radio 14, 14 px. */
.at-carrito__seguir,
.at-cajon__seguir,
.at-descuento__boton,
.at-resumen__boton {
  display: grid;
  align-content: center;
  justify-items: center;
  margin: 0;
  border: 0;
  border-radius: var(--at-boton-radio, 14px);
  background: #000;
  color: #fff;
  font-family: var(--at-fuente-cuerpo, Inter, sans-serif);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.6;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  transition: background-color .125s ease-in-out;
}
.at-carrito__seguir:hover,
.at-cajon__seguir:hover,
.at-descuento__boton:hover,
.at-resumen__boton:hover { background: #262626; }

/* ── La página del carrito ─────────────────────────────────────────────────────────────────────────── */
.at-carrito {
  --at-carrito-margen: var(--at-margen-pagina, 16px);
  position: relative;
  display: grid;
  grid-template-columns: minmax(var(--at-carrito-margen), 1fr) min(1440px, calc(100% - var(--at-carrito-margen) * 2)) minmax(var(--at-carrito-margen), 1fr);
  width: 100%;
  background: #fff;
}
@media (min-width: 750px) { .at-carrito { --at-carrito-margen: var(--at-margen-pagina, 40px); } }

.at-carrito__pagina {
  grid-column: 2;
  display: grid;
  grid-template-columns: 1fr;
  column-gap: 48px;
  padding-top: 20px;
}
@media (min-width: 990px) { .at-carrito__pagina { padding-top: 24px; } }
@media (min-width: 750px) {
  .at-carrito__pagina:not(.at-carrito__pagina--vacia) {
    grid-column: 2 / 4;
    grid-template-columns: 1fr minmax(25rem, calc((100vw - 1520px) / 2 + 25rem));
    grid-template-rows: min-content min-content 1fr;
  }
}
.at-carrito__pagina--vacia { display: flex; flex-direction: column; align-items: center; justify-content: center; }
.at-carrito__pagina--vacia .at-carrito__titulo,
.at-carrito__pagina--vacia .at-carrito__mas { margin-top: 80px; }
.at-carrito__mas { width: 100%; }

.at-carrito__titulo { text-align: left; }
.at-carrito__pagina--vacia .at-carrito__titulo { text-align: center; }
.at-carrito__titulo h1 {
  display: inline-flex;
  align-items: center;
  gap: 11.2px;
  margin: 0;
  color: #000;
  font-family: var(--at-fuente-titulo, Inter, sans-serif);
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}
.at-carrito__burbuja {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 26px;
  height: 26px;
  padding: 4.8px;
  border-radius: 50%;
  line-height: normal;
}
.at-carrito__burbuja-fondo { position: absolute; inset: 0; border-radius: 50%; background: rgb(0 0 0 / .1); }
.at-carrito__burbuja-numero {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #000;
  font-family: var(--at-fuente-cuerpo, Inter, sans-serif);
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
}
.at-carrito__titulo + .at-carrito__renglones { margin-top: 16px; }
.at-carrito__renglones { grid-column: 1; }

.at-carrito__vacio { display: flex; flex-direction: column; align-items: center; text-align: center; }
.at-carrito__seguir { margin-top: 12.8px; margin-inline: auto; padding: 16px 32px; }

/* El resumen: abajo en el celular; en la compu, columna gris que llega al borde de la página. */
.at-carrito__resumen { position: relative; padding-top: 20px; }
.at-carrito__resumen-interior { position: sticky; top: 0; display: flex; flex-direction: column; align-items: center; gap: 32px; }
@media (min-width: 750px) {
  .at-carrito__resumen {
    grid-column: 2;
    grid-row: 1 / -1;
    display: grid;
    grid-template-rows: subgrid;
    height: 100%;
    align-self: stretch;
    padding-top: 0;
    background: var(--at-borde, #dfdfdf);
  }
  .at-carrito__resumen-interior { grid-row: 2 / -1; align-self: start; width: 25rem; padding: 12.8px var(--at-carrito-margen) 32px; }
}

/* ── Los renglones (página y cajón) ────────────────────────────────────────────────────────────────── */
.at-renglones__formulario { display: block; margin: 0; }
.at-renglones__caja { container: at-renglones / inline-size; width: 100%; }
.at-renglones { width: 100%; border-spacing: 0; border-collapse: separate; }
.at-renglones * { margin: 0; }
.at-renglones tbody { display: table-row-group; }
.at-renglones thead tr { display: grid; }
.at-renglon {
  display: grid;
  grid-template-columns: clamp(2.5rem, 15cqi, 7.5rem) minmax(0, 1fr) minmax(6rem, auto);
  grid-template-areas: "foto detalles total" "foto cantidad total" "foto error error";
  column-gap: 14.4px;
  align-items: start;
  padding-bottom: 24px;
  margin-bottom: 16px;
}
.at-renglon:last-child { padding-bottom: 0; }
.at-renglones--pagina .at-renglon { border-bottom: 1px solid rgb(0 0 0 / .1); margin-bottom: 24px; }
.at-renglones--pagina .at-renglon:last-of-type { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }

.at-renglon__foto { grid-area: foto; padding: 0; }
.at-renglon__foto a { position: relative; display: flex; width: 100%; aspect-ratio: .8; overflow: hidden; }
.at-renglones--cajon .at-renglon__foto a { aspect-ratio: 1; }
.at-renglon__foto img { display: block; width: 100%; height: auto; aspect-ratio: inherit; object-fit: cover; object-position: center center; }

.at-renglon__detalles { grid-area: detalles; min-width: 0; color: rgb(0 0 0 / .7); }
.at-renglon__detalles * { font-size: 14px; }
.at-renglon__detalles a { text-decoration: none; }
.at-renglon__info { min-width: 0; }
.at-renglon__fila-titulo { display: inline-flex; align-items: center; gap: 8px; max-width: 100%; min-width: 0; }
.at-renglon__titulo { display: block; min-width: 0; color: #000; font-size: 16px; overflow-wrap: break-word; }
.at-renglon__detalles .at-renglon__titulo { font-size: 16px; }
.at-renglon__variantes { margin-top: 2px; }
.at-renglon__variantes dl { display: block; }
.at-renglon__variante { display: inline; }
.at-renglon__variante dt,
.at-renglon__variante dd { display: inline; margin: 0; }
.at-renglon__unitario { margin-top: 2px; }
.at-renglon__tachado { color: rgb(0 0 0 / .8); white-space: nowrap; text-decoration-line: line-through; text-decoration-thickness: 1.5px; text-decoration-color: rgb(0 0 0 / .3); }

.at-renglon__cantidad { grid-area: cantidad; display: flex; align-items: center; justify-content: flex-start; gap: 8px; width: fit-content; margin-top: 8px; }
.at-renglon__controles { display: flex; flex-shrink: 0; align-items: center; justify-content: flex-start; gap: 8px; width: fit-content; }
.at-renglon__selector { display: flex; flex-shrink: 0; flex-wrap: wrap; align-items: center; gap: 5.6px; }
@media (min-width: 750px) { .at-renglon__selector { gap: 11.2px; } }
.at-renglon__numero {
  --at-numero-ancho: 124px;
  display: inline-flex;
  flex: 0 0 auto;
  align-items: center;
  justify-content: space-between;
  border: 1px solid var(--at-borde, #dfdfdf);
  border-radius: var(--at-campo-radio, 4px);
  background: #fff;
  color: #333;
  font-size: 14px;
}
.at-renglon__boton {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  background: transparent;
  color: #333;
  cursor: pointer;
}
.at-renglon__boton .at-icono.at-icono { width: 13.6px; height: 13.6px; }
.at-renglon__boton:active .at-icono { transform: scale(.9); }
.at-renglon__numero input {
  max-width: calc(var(--at-numero-ancho) - 88px);
  margin: 0;
  padding: 1px 2px;
  border: 0;
  border-radius: 14px;
  background: transparent;
  color: #333;
  font: inherit;
  font-size: 16px;
  text-align: center;
  -webkit-appearance: textfield;
  appearance: textfield;
}
.at-renglon__numero input::-webkit-inner-spin-button,
.at-renglon__numero input::-webkit-outer-spin-button { -webkit-appearance: none; margin: 0; }
@media (min-width: 750px) {
  .at-renglon__numero { --at-numero-ancho: 105px; width: 105px; height: 36px; }
  .at-renglon__boton { width: 36px; height: 36px; }
  .at-renglon__numero input { max-width: calc(var(--at-numero-ancho) - 88px); font-size: 14px; }
}
.at-renglon__boton[disabled] { opacity: .5; cursor: not-allowed; }
.at-renglon__sacar {
  display: grid;
  flex-shrink: 0;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 0;
  border-radius: var(--at-boton-radio, 14px);
  background: transparent;
  color: #000;
  cursor: pointer;
}
.at-renglon__error { grid-area: error; display: flex; align-items: flex-start; width: 100%; margin-top: 8px; }
.at-renglon__error[hidden] { display: none; }
.at-renglon__error > div { display: flex; align-items: flex-start; width: 100%; padding-block: 4px; font-size: 14px; }
.at-renglon__total {
  grid-area: total;
  display: block;
  min-width: 6rem;
  text-align: end;
  font-size: 14px;
  font-weight: 500;
  line-height: 1;
}
.at-renglon__total span { display: inline-block; position: relative; line-height: 1; }

/* Con más de 720 px de ancho (la página en la compu), cuatro columnas: foto, detalles, cantidad, total. */
@container at-renglones (min-width: 720px) {
  .at-renglon {
    grid-template-columns: 7.5rem 1fr 1fr minmax(6rem, auto);
    grid-template-rows: min-content 1fr;
    grid-template-areas: "foto detalles cantidad total" "foto detalles error error";
  }
  .at-renglon__cantidad { margin-top: 0; }
  .at-renglon__total { display: flex; flex-direction: column; align-items: flex-end; min-height: 44px; }
}

/* En el cajón, el pack, el precio y la cantidad debajo del título, de borde a borde. */
.at-renglones--cajon .at-renglon {
  grid-template-columns: clamp(2.5rem, 15cqi, 7.5rem) minmax(0, 1fr) auto;
  grid-template-rows: repeat(4, min-content) 1fr;
  grid-template-areas: "foto detalles total" "foto variantes variantes" "foto unitario unitario" "foto cantidad cantidad" "foto error error";
  padding-bottom: 20px;
  margin-bottom: 20px;
  border-bottom: 1px solid rgb(0 0 0 / .1);
}
.at-renglones--cajon .at-renglon:last-child { border-bottom: none; padding-bottom: 0; margin-bottom: 0; }
.at-renglones--cajon .at-renglon__detalles { display: contents; }
.at-renglones--cajon .at-renglon__info { grid-area: detalles; }
.at-renglones--cajon .at-renglon__variantes { grid-area: variantes; }
.at-renglones--cajon .at-renglon__unitario { grid-area: unitario; font-size: 14px; }
.at-renglones--cajon .at-renglon__total { min-width: auto; width: max-content; }
.at-renglones--cajon .at-renglon__info,
.at-renglones--cajon .at-renglon__variantes,
.at-renglones--cajon .at-renglon__unitario { color: rgb(0 0 0 / .7); }

/* ── El resumen (página y cajón) ───────────────────────────────────────────────────────────────────── */
.at-resumen__totales { display: flex; flex-direction: column; gap: 20px; width: 100%; }
.at-resumen__acciones { display: flex; flex-direction: column; margin-top: 2px; border-block: 1px solid rgb(0 0 0 / .1); }
.at-descuento { width: 100%; }
.at-descuento__resumen {
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 44px;
  padding-block: 11.2px;
  padding-inline: 0;
  line-height: 1.2;
  list-style: none;
  cursor: pointer;
}
.at-descuento__resumen::-webkit-details-marker { display: none; }
.at-descuento__resumen:hover { color: rgb(0 0 0 / .8); }
.at-descuento__etiqueta { display: flex; align-items: flex-start; gap: 4.8px; font-size: 12px; font-weight: 400; line-height: 1.2; }
.at-descuento__resumen .at-descuento__icono { display: block; width: 13.6px; height: 13.6px; margin: 0; transition: transform .125s ease-in-out; }
.at-descuento__contenido { height: calc(44px + 4px + 11.2px); }
.at-descuento__formulario { display: flex; align-items: center; gap: 12.8px; height: 100%; padding-block: 4px 11.2px; }
.at-descuento__campo {
  flex-grow: 1;
  min-width: 0;
  height: 100%;
  padding: 11.2px 12.8px;
  border: 1px solid var(--at-borde, #dfdfdf);
  border-radius: var(--at-campo-radio, 4px);
  background: #fff;
  color: #333;
  font-family: inherit;
  font-size: 14px;
  line-height: 1.6;
}
.at-descuento__campo::placeholder { color: rgb(51 51 51 / .8); }
.at-descuento__boton { height: 100%; padding: 16px 24px; }
.at-descuento__error { display: flex; align-items: center; width: 100%; padding-block: 4px 11.2px; }
.at-descuento__error[hidden] { display: none; }
.at-descuento__error .at-icono.at-icono { flex-shrink: 0; width: 13.6px; height: 13.6px; margin-inline: 2px 8px; color: #e00; background: currentColor; }
.at-descuento__error-texto { margin-top: 2px; font-size: 11.6667px; line-height: 1.6; }
.at-descuento__error-texto[hidden] { display: none; }

.at-resumen__cuenta { display: flex; flex-direction: column; row-gap: 8px; }
.at-resumen__cuenta::after { content: ""; order: 1; }
.at-resumen__total { display: flex; align-items: baseline; justify-content: space-between; }
.at-resumen__total-etiqueta { font-size: 14px; }
.at-resumen__total-valor { display: block; position: relative; font-size: 14px; font-weight: 500; line-height: 1; }
@media (max-width: 749px) { .at-resumen__total-valor { font-size: 18px; } }
.at-resumen__nota { order: 2; display: flex; align-items: center; justify-content: space-between; color: rgb(0 0 0 / .8); }
.at-resumen__nota small { display: block; font-size: 12px; line-height: 1.6; }
.at-resumen__nota a { color: rgb(0 0 0 / .8); text-decoration-line: underline; text-decoration-color: currentColor; }
.at-resumen__nota a:hover { text-decoration-color: transparent; }
.at-resumen__pagar { display: grid; grid-template-columns: 1fr; gap: 10px; width: 100%; }
.at-resumen__boton { width: 100%; height: 52px; padding: 16px 32px; }

/* ── El cajón ──────────────────────────────────────────────────────────────────────────────────────── */
.at-cajon { display: contents; }
.at-cajon__ventana {
  position: fixed;
  inset: unset;
  top: 0;
  right: -480px;
  z-index: 9;
  display: none;
  flex-direction: column;
  width: 480px;
  max-width: 100%;
  height: 100dvh;
  max-height: none;
  margin: 0;
  padding: 0;
  overflow: visible;
  border: 0;
  border-left: 1px solid var(--at-borde, #dfdfdf);
  background: #fff;
  color: #000;
}
.at-cajon__ventana[open] { display: flex; right: 0; }
.at-cajon__ventana::backdrop { background: transparent; }
.at-cajon__ventana.at-cajon--entrando { animation: at-cajon-entra .125s cubic-bezier(.16, 1, .3, 1); }
.at-cajon__ventana.at-cajon--saliendo { animation: at-cajon-sale .125s cubic-bezier(.4, 0, .2, 1) forwards; }
@keyframes at-cajon-entra { from { right: -480px; } }
@keyframes at-cajon-sale { to { right: -480px; } }
.at-cajon__interior { display: flex; flex-direction: column; height: 100%; overflow: hidden; }
.at-cajon__cabecera { display: flex; flex-shrink: 0; align-items: center; justify-content: space-between; padding: 20px; color: #000; }
.at-cajon__titulo {
  display: flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  color: #000;
  font-family: var(--at-fuente-titulo, Inter, sans-serif);
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
}
.at-cajon__cantidad {
  display: flex;
  flex-shrink: 0;
  align-items: center;
  justify-content: center;
  min-width: 22px;
  height: 22px;
  aspect-ratio: 1;
  padding-inline: 2.6px;
  border-radius: 16px;
  background: rgb(0 0 0 / .1);
  color: #000;
  font-family: var(--at-fuente-cuerpo, Inter, sans-serif);
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
}
.at-cajon__cerrar {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 34px;
  height: 34px;
  margin-left: auto;
  padding: 1px 6px;
  border: 1px solid rgb(0 0 0 / .06);
  border-radius: 34px;
  background: #fff;
  box-shadow: 0 2px 6px 0 rgb(0 0 0 / .06);
  color: rgb(0 0 0 / .5);
  cursor: pointer;
  transition: color .15s cubic-bezier(.25, 0, .1, 1), background-color .15s cubic-bezier(.25, 0, .1, 1);
}
.at-cajon__cerrar:hover { color: rgb(0 0 0 / .7); background: #f0f0f0; }
.at-cajon__cerrar .at-icono { width: 20px; height: 20px; }

/* Lleno: los renglones arriba (se desplazan) y el resumen fijo abajo. */
.at-cajon__cuerpo { display: flex; flex-direction: column; flex-grow: 1; min-height: 0; overflow-y: auto; background: #fff; }
.at-cajon__renglones { display: flex; flex-direction: column; padding-inline: 20px; overflow-y: auto; }
/* Cuando los renglones no entran (lo mide at-carrito.js con --at-bb-avance, de 0 % a 100 %), la punta que todavía
   esconde algo se apaga: la de abajo en su último 10 %; la de arriba, apenas se bajó (se corta en el primer 1 % y
   se enciende hasta el 10 %). Al llegar al final la de abajo ya no se apaga. */
.at-cajon__cuerpo[data-at-desborda],
.at-cajon__renglones[data-at-desborda] {
  --at-bb-mascara: linear-gradient(to bottom,
    transparent min(var(--at-bb-avance, 0%) * 100, 1%),
    #000 min(var(--at-bb-avance, 0%), 10%),
    #000 max(var(--at-bb-avance, 0%), 90%),
    transparent 100%);
  -webkit-mask-image: var(--at-bb-mascara);
  mask-image: var(--at-bb-mascara);
}
.at-cajon__resumen {
  position: sticky;
  bottom: 0;
  z-index: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 20px;
  margin-top: auto;
  padding: 16px;
  background: #fff;
  -webkit-mask-image: linear-gradient(to bottom, transparent, black 16px);
  mask-image: linear-gradient(to bottom, transparent, black 16px);
}
@media (min-width: 750px) {
  .at-cajon__resumen {
    padding: 24px;
    -webkit-mask-image: linear-gradient(to bottom, transparent, black 24px);
    mask-image: linear-gradient(to bottom, transparent, black 24px);
  }
}
/* En el cajón los botones y la cantidad van con interlineado 1 */
.at-cajon__ventana .at-resumen__boton,
.at-cajon__ventana .at-cajon__seguir,
.at-cajon__ventana .at-descuento__boton { line-height: 1; }
.at-cajon__ventana .at-renglon__boton,
.at-cajon__ventana .at-renglon__sacar { line-height: 1; }

/* Vacío: el título y «Seguir comprando» centrados en el alto que queda. */
.at-cajon__cuerpo--vacio { align-items: center; justify-content: center; text-align: center; }
.at-cajon__vacio { display: flex; flex-direction: column; align-items: center; justify-content: center; text-align: center; }
.at-cajon__seguir { margin-top: 12.8px; margin-inline: auto; padding: 16px 32px; }

/* ── La lista de productos («You may also like» / «Discover something new») ────────────────────────── */
.at-lista {
  --at-lista-margen: var(--at-margen-pagina, 16px);
  display: grid;
  grid-template-columns: minmax(var(--at-lista-margen), 1fr) min(1440px, calc(100% - var(--at-lista-margen) * 2)) minmax(var(--at-lista-margen), 1fr);
  row-gap: max(24px, calc(var(--at-lista-hueco, 28px) * .7));
  padding-block: calc(var(--at-lista-arriba, 48px) * .7) calc(var(--at-lista-abajo, 48px) * .7);
  background: #fff;
}
@media (min-width: 750px) { .at-lista { --at-lista-margen: var(--at-margen-pagina, 40px); } }
@media (min-width: 990px) {
  .at-lista { row-gap: var(--at-lista-hueco, 28px); padding-block: var(--at-lista-arriba, 48px) var(--at-lista-abajo, 48px); }
}
.at-lista > * { grid-column: 2; }
.at-lista__cabecera { display: flex; align-items: last baseline; justify-content: var(--at-lista-alineacion, flex-start); gap: 12px; }
.at-lista__titulo { display: flex; flex-direction: column; }
.at-lista__titulo :is(h3, p) {
  margin: 0;
  color: #000;
  font-family: var(--at-fuente-titulo, Inter, sans-serif);
  font-size: 24px;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0;
  text-align: left;
  text-wrap: pretty;
}
.at-lista__grilla {
  display: grid;
  grid-template-columns: repeat(var(--at-lista-columnas-celular, 2), minmax(0, 1fr));
  gap: calc(var(--at-lista-hueco-filas, 24px) / 2) var(--at-lista-hueco-columnas, 8px);
}
@media (min-width: 750px) {
  .at-lista__grilla { grid-template-columns: repeat(var(--at-lista-columnas, 4), minmax(0, 1fr)); row-gap: var(--at-lista-hueco-filas, 24px); }
}
.at-lista__item { min-width: 0; }

/* ── Íconos (dibujados para Antropify) ─────────────────────────────────────────────────────────────── */
:where(.at-carrito, .at-cajon__ventana) .at-icono { display: inline-flex; flex-shrink: 0; width: 20px; height: 20px; background: currentColor; -webkit-mask: var(--at-icono) center / contain no-repeat; mask: var(--at-icono) center / contain no-repeat; }
:where(.at-carrito, .at-cajon__ventana) .at-icono--mas { --at-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='%23000'%3E%3Cpath d='M7 2.6V11.4M2.6 7.2H11.4' stroke-width='1.3' stroke-linecap='round'/%3E%3C/svg%3E"); }
:where(.at-carrito, .at-cajon__ventana) .at-icono--menos { --at-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='%23000'%3E%3Cpath d='M2.2 7.2H11.8' stroke-width='1.2' stroke-linecap='round'/%3E%3C/svg%3E"); }
:where(.at-carrito, .at-cajon__ventana) .at-icono--cruz { --at-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23000'%3E%3Cpath d='M5 5L15 15M15 5L5 15' stroke-width='1.5'/%3E%3C/svg%3E"); }
:where(.at-carrito, .at-cajon__ventana) .at-icono--tacho { --at-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20' fill='none' stroke='%23000'%3E%3Cpath d='M3.8 6H16.2' stroke-width='1.7' stroke-linecap='round'/%3E%3Cpath d='M7.75 5.6V4.5Q7.75 3.5 9 3.5H11Q12.25 3.5 12.25 4.5V5.6' stroke-width='1.5'/%3E%3Cpath d='M5.75 7.2V13.9Q5.75 16.25 8.1 16.25H11.9Q14.25 16.25 14.25 13.9V7.2' stroke-width='1.5'/%3E%3Cpath d='M8.5 8.9V12.7M11.5 8.9V12.7' stroke-width='1.5' stroke-linecap='round'/%3E%3C/svg%3E"); }
:where(.at-carrito, .at-cajon__ventana) .at-icono--alerta { --at-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14'%3E%3Ccircle cx='7' cy='7' r='6.5' fill='%23000'/%3E%3Cpath d='M7 3.6v4.2' stroke='%23fff' stroke-width='1.5' stroke-linecap='round'/%3E%3Ccircle cx='7' cy='10.2' r='.9' fill='%23fff'/%3E%3C/svg%3E"); }

/* Con el cajón abierto la página de atrás no se desplaza. */
html[data-at-cajon-abierto],
html[data-at-cajon-abierto] .page-wrapper { overflow: hidden; }

:where(.at-carrito, .at-cajon__ventana) .at-icono--desplegar { --at-icono: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='%23000'%3E%3Cpath d='M6.8 2V12M2 7.2H12' stroke-width='1.5'/%3E%3C/svg%3E"); }