/* 27-oct-2026 PRUEBA responsive escritorio/tablet v2. Sin colores nuevos ni cambios de texto/lógica.
   --aw = ancho del contenedor de la tienda en cada tamaño (para centrar y ubicar el selector ES/EN). */
:root{--aw:100vw}
@media (min-width:481px){:root{--aw:480px}}
@media (min-width:900px) and (min-height:480px){:root{--aw:min(1040px,100vw)}}
@media (min-width:1280px) and (min-height:600px){:root{--aw:min(1280px,94vw)}}
@media (min-width:1700px) and (min-height:900px){:root{--aw:1440px}}

/* ===== Selector ES/EN: arriba a la derecha, junto a la lupa (todas las vistas) ===== */
html body .aldo-lang{left:auto!important;right:calc(max(0px,(100vw - var(--aw)) / 2) + 107px + env(safe-area-inset-right,0px))!important;top:calc(21px + env(safe-area-inset-top,0px))!important}
html body .aldo-lang button{position:relative}
html body .aldo-lang button::before{content:"";position:absolute;left:-4px;right:-4px;top:-10px;bottom:-10px}
@media (max-width:380px){html body .aldo-lang{right:calc(104px + env(safe-area-inset-right,0px))!important}html body .aldo-lang button{padding:6px 6px!important}}

/* ===== Tablet vertical / ventanas medianas (481-899): igual que el teléfono, en columna centrada ===== */
@media (min-width:481px){
  html.bn-amz #feed .feed-card .card-body{display:none!important}
  /* barra de scroll pegada al borde derecho: el feed ocupa todo el ancho y centra su contenido */
  html body #app #feed.feed{position:fixed!important;top:0;bottom:0;left:0;right:0;width:100vw!important;max-width:none!important;padding-left:calc((100vw - var(--aw)) / 2)!important;padding-right:calc((100vw - var(--aw)) / 2)!important;box-sizing:border-box!important;z-index:1}
  html body #app .app-header,html body #app .aldo-nav{z-index:20}
}

/* ===== Escritorio y tablet horizontal (>=900): foto a la izquierda, ficha completa (la misma del teléfono) a la derecha ===== */
@media (min-width:900px) and (min-height:480px){
  :root{--colw:60%}
  #app{max-width:var(--aw)}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.scrim{display:none}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery.gallery.gallery.gallery{position:absolute!important;left:0!important;top:0!important;bottom:0!important;right:auto!important;width:var(--colw)!important;height:100%!important;aspect-ratio:auto!important;margin:0!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery.gallery>.gallery-slide.gallery-slide.gallery-slide:not(.video-slide) img.feed-photo.feed-photo,
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery.gallery>.gallery-slide.gallery-slide.gallery-slide:not(.video-slide) img.bn-closing-img.bn-closing-img,
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery.gallery>.gallery-slide.gallery-slide.gallery-slide:not(.video-slide)>img{left:0!important;right:0!important;width:100%!important;max-width:100%!important;aspect-ratio:auto!important;height:calc(100% - var(--bn-top,102px) - var(--aldo-nav-h,58px) - 110px)!important;object-fit:contain!important;object-position:center!important;box-shadow:none!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery-dots{left:0!important;right:auto!important;width:var(--colw)!important;top:calc(var(--bn-top,102px) + 8px)!important}
  /* aviso de fotos/IA + WhatsApp debajo de la foto */
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.bn-disc{position:absolute!important;left:0;width:var(--colw);bottom:calc(var(--aldo-nav-h,58px) + 6px);top:auto!important;z-index:4;box-sizing:border-box;padding:0 18px;margin:0!important}
  /* corazón, compartir y oferta del día sobre la foto, como en el teléfono */
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.af-share{top:auto!important;left:calc(var(--colw) - 59px)!important;right:auto!important;bottom:calc(var(--aldo-nav-h,58px) + 118px + 54px)!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.af-heart{top:auto!important;left:calc(var(--colw) - 59px)!important;right:auto!important;bottom:calc(var(--aldo-nav-h,58px) + 118px)!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.dotd-cardtag{top:auto!important;left:calc(var(--colw) / 2 - 125px)!important;right:auto!important;bottom:calc(var(--aldo-nav-h,58px) + 118px)!important;transform:none!important}
  /* ficha (título, precio, comprar, agregar al carrito, Blue, regalo, envío FedEx, detalles) */
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.bn-amzinfo.bn-ni{position:absolute!important;left:var(--colw)!important;right:0!important;top:var(--bn-top,102px)!important;bottom:var(--aldo-nav-h,58px)!important;width:auto!important;margin:0!important;overflow-y:auto!important;overscroll-behavior:contain;z-index:3!important;box-sizing:border-box;padding:4px 28px 24px!important;border-left:1px solid rgba(0,0,0,.06)}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.bn-amzinfo.bn-ni>*{max-width:520px;margin-left:auto;margin-right:auto}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card .bn-amzinfo .bn-amz-btn{visibility:visible!important}
}
@media (min-width:1280px) and (min-height:600px){:root{--colw:62%}}

/* v3 2026-10-27: tablet vertical (481-899px) = layout de telefono a 480px.
   Antes, a >=768 la tarjeta medía 922px con overflow:hidden y cortaba detalles,
   pago seguro e iconos de pago; corazón/compartir quedaban bajo la barra. */
@media (min-width:481px) and (max-width:899px){
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed{scroll-snap-type:none!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card{height:auto!important;min-height:0!important;max-height:none!important;overflow:visible!important;--om-h:calc(var(--aw) * 5 / 4)!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery.gallery.gallery.gallery{top:0!important}
}
@media (min-width:481px){
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card{--om-h:calc(var(--aw) * 5 / 4)}
}

/* v4 2026-10-27: hoja "monedas de regalo" en tablet/desktop igual que en telefono
   (mismas reglas que ya usa el telefono; sin colores nuevos). */
@media (min-width:481px){
  .bn-coinsheet .bn-coingrid{display:grid!important;grid-template-columns:repeat(2,1fr);gap:12px}
  .bn-coinsheet .bn-coin{text-align:center;font-size:13px}
  .bn-coinsheet .bn-coin img,.bn-coinsheet .bn-coinph{display:block;width:100%!important;height:auto!important;max-width:100%!important;aspect-ratio:1;object-fit:contain;border-radius:12px;background:#f6f6f4;margin:0 0 6px;font-size:40px;line-height:2.5}
  .bn-coinsheet .bn-coin b{display:block}
}

/* v5 2026-10-27 (desk1027e): Safari con ventana baja. Sin scroll interno en la ficha: la tarjeta crece
   y se desplaza la pagina (barra al borde de la ventana). Foto entera arriba de la columna, oferta del dia
   debajo del aviso (no tapa la pieza). Banner MODO PRUEBA mas bajo para no tapar la corona. */
#pruebaBanner{padding:calc(env(safe-area-inset-top,0px) + 2px) 8px 2px!important;line-height:11px!important}
@media (min-width:900px) and (min-height:480px){
  :root{--colf:.6}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed{scroll-snap-type:none!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card{height:auto!important;max-height:none!important;overflow:visible!important;scroll-snap-align:none!important;
    --gh:min(calc((var(--aw) * var(--colf) - 32px) * 1.25),max(calc(100vh - var(--bn-top,102px) - 96px),600px));--gw:calc(var(--gh) * .8);--gl:calc((var(--aw) * var(--colf) - var(--gw)) / 2);
    min-height:max(100vh,calc(var(--bn-top,102px) + var(--gh) + 230px + var(--aldo-nav-h,58px)))!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery.gallery.gallery.gallery{top:var(--bn-top,102px)!important;bottom:auto!important;height:var(--gh)!important;left:var(--gl)!important;width:var(--gw)!important;background:transparent!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery-dots{left:var(--gl)!important;width:var(--gw)!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery.gallery>.gallery-slide.gallery-slide.gallery-slide:not(.video-slide) img.feed-photo.feed-photo,
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery.gallery>.gallery-slide.gallery-slide.gallery-slide:not(.video-slide) img.bn-closing-img.bn-closing-img,
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.gallery.gallery>.gallery-slide.gallery-slide.gallery-slide:not(.video-slide)>img{top:0!important;bottom:auto!important;height:100%!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.bn-disc{top:calc(var(--bn-top,102px) + var(--gh) + 8px)!important;bottom:auto!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.af-share{left:calc(var(--gl) + var(--gw) - 59px)!important;bottom:auto!important;top:calc(var(--bn-top,102px) + var(--gh) - 104px)!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.af-heart{left:calc(var(--gl) + var(--gw) - 59px)!important;bottom:auto!important;top:calc(var(--bn-top,102px) + var(--gh) - 50px)!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.dotd-cardtag{bottom:auto!important;top:calc(var(--bn-top,102px) + var(--gh) + 120px)!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card>.bn-amzinfo.bn-ni{position:relative!important;left:auto!important;right:auto!important;top:auto!important;bottom:auto!important;margin:0 0 0 var(--colw)!important;overflow:visible!important;overscroll-behavior:auto;padding:calc(var(--bn-top,102px) + 4px) 28px calc(var(--aldo-nav-h,58px) + 24px)!important}
}
@media (min-width:1280px) and (min-height:600px){:root{--colf:.62}}

/* v6 2026-10-27 (desk1027f): sin franja beige ni segunda barra en Safari. La pagina no se desplaza (solo #feed),
   y el aviso para lector de pantalla (#a11yLive) ya no queda 1px por debajo de la ventana. */
html body .a11y-sr{top:0!important;left:0!important}
@media (min-width:481px){html,body{height:100%;overflow:hidden!important}}

/* v7 2026-10-27 (desk1027g): sin franja dorada junto a la barra de scroll clasica (Safari/Chrome con barras visibles). */
@media (min-width:481px){
  html body #app{background:transparent!important}
  html body #app #feed.feed{scrollbar-gutter:stable;padding-left:calc((100% - var(--aw)) / 2)!important;padding-right:calc((100% - var(--aw)) / 2)!important}
}

/* v8 2026-10-27 (desk1027h): la ficha se alinea con el encabezado tambien con barra de scroll clasica (ancho real del feed). */
@media (min-width:481px){
  html body #app #feed.feed{padding-right:0!important}
  html.bn-amz body #app #feed#feed#feed#feed#feed.feed>article.feed-card.feed-card{width:min(var(--aw),100%)!important;max-width:min(var(--aw),100%)!important;box-sizing:border-box!important}
}