/* Ficha Atlas Rabbit: diseño optativo, aislado del catálogo y de las otras fichas. */
#productDetail .atlas-detail-aside,
#productDetail .atlas-product-rating,
#productDetail .atlas-trust-strip,
#productDetail .atlas-shipping-callout,
#productDetail .atlas-payment-methods,
#productDetail .atlas-reviews { display: none; }

html[data-product-detail-layout="atlas"] body.product-detail-open {
    background: #fafafa !important;
}
html[data-product-detail-layout="atlas"] body.product-detail-open #productDetail.product-detail-section.container {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0 0 32px;
    background: #fafafa;
    color: #161616;
    font-family: "Montserrat", system-ui, -apple-system, "Segoe UI", sans-serif;
}
/* La ficha original centraba todo el bloque verticalmente y añadía padding
   superior. Atlas necesita empezar justo debajo del header superpuesto. */
html[data-product-detail-layout="atlas"] body.product-detail-open #productDetail.product-detail-section.active {
    display: block;
    min-height: 0;
    justify-content: initial;
    padding-top: 0;
}
html[data-product-detail-layout="atlas"] #productDetail > .detail-breadcrumb { display: none !important; }
html[data-product-detail-layout="atlas"] #productDetail > .product-detail-card {
    display: grid !important;
    grid-template-columns: minmax(0, 32.3fr) minmax(0, 35.9fr) minmax(0, 31.8fr);
    align-items: stretch;
    gap: 0 !important;
    width: 100%;
    min-height: min(830px, calc(100dvh - 72px));
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    box-shadow: none;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-detail-aside {
    display: block;
    min-width: 0;
    padding: 82px clamp(16px, 5.2vw, 110px) 40px;
    background: linear-gradient(155deg, #fcfcfc 0%, #f1eff0 100%);
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-aside-inner {
    width: min(100%, 420px);
    margin: 0 auto;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-info-accordion {
    margin-bottom: 8px;
    border: 1px solid #e9e9e9;
    border-radius: 17px;
    background: #fff;
    overflow: hidden;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-info-accordion summary {
    display: flex;
    justify-content: space-between;
    align-items: center;
    min-height: 47px;
    padding: 13px 16px;
    list-style: none;
    cursor: pointer;
    font-size: 13px;
    font-weight: 750;
    letter-spacing: .025em;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-info-accordion summary::-webkit-details-marker { display: none; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-accordion-state::after { content: '+'; font-size: 20px; font-weight: 700; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-info-accordion[open] .atlas-accordion-state::after { content: '×'; font-size: 19px; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-accordion-body {
    padding: 12px 16px 26px;
    font-size: 12px;
    line-height: 1.65;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
    max-height: min(67dvh, 660px);
    overflow-y: auto;
    scrollbar-width: thin;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-accordion-body strong { font-weight: 750; }
html[data-product-detail-image-layout="atlas"] #productDetail .detail-gallery-column {
    display: block !important;
    position: relative;
    min-width: 0;
    width: 100%;
    height: min(900px, max(720px, calc(100dvh - 72px)));
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ececec;
    box-shadow: none !important;
    overflow: hidden;
}
/* PC: conservar SIEMPRE el alto original de la galería (720-900 px), y
   ampliarla solo si hace falta cubrir la primera pantalla. La altura auto
   sin mínimo la achicaba y adelantaba incorrectamente el bloque inferior. */
@media (min-width: 901px) {
    html[data-product-detail-image-layout="atlas"] body.product-detail-open #productDetail .detail-gallery-column {
        height: auto;
        min-height: max(
            min(900px, max(720px, calc(100dvh - 72px))),
            var(--product-detail-first-screen-height, 100dvh)
        );
        align-self: stretch;
    }
}
html[data-product-detail-image-layout="atlas"] #productDetail .product-detail-image {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100% !important;
    min-height: 0 !important;
    aspect-ratio: auto !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: #ececec;
    box-shadow: none !important;
}
html[data-product-detail-image-layout="atlas"] #productDetail .product-detail-image > img {
    position: absolute !important;
    inset: 0 !important;
    width: 100%;
    height: 100% !important;
    max-height: none !important;
    object-fit: cover !important;
    object-position: center;
    border-radius: 0 !important;
}
html[data-product-detail-image-layout="atlas"] #productDetail .detail-gallery-thumbnails {
    position: absolute !important;
    z-index: 8;
    left: 14px;
    bottom: 14px;
    top: auto;
    right: auto;
    display: flex !important;
    flex-direction: column !important;
    width: 54px;
    max-height: min(45%, 360px);
    gap: 6px;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: none;
}
html[data-product-detail-image-layout="atlas"] #productDetail .detail-gallery-thumbnails::-webkit-scrollbar { display: none; }
html[data-product-detail-image-layout="atlas"] #productDetail .detail-thumb,
html[data-product-detail-image-layout="atlas"] #productDetail .detail-thumb-more {
    flex: 0 0 62px;
    width: 52px;
    height: 62px;
    border: 1px solid rgba(255,255,255,.8);
    border-radius: 5px;
    background: rgba(255,255,255,.75);
    box-shadow: 0 2px 6px #0002;
}
html[data-product-detail-image-layout="atlas"] #productDetail .detail-thumb.active { border: 2px solid #fff; outline: 1px solid #333; outline-offset: -3px; }
html[data-product-detail-image-layout="atlas"] #productDetail .detail-thumb img { object-fit: cover; }
html[data-product-detail-image-layout="atlas"] #productDetail :is(.detail-gallery-arrow, .detail-zoom-hint, .product-detail-dots) { display: none !important; }
html[data-product-detail-layout="atlas"] #productDetail .product-detail-info {
    display: flex;
    align-self: center;
    justify-content: flex-start;
    flex-direction: column;
    min-width: 0;
    width: calc(100% - 28px);
    max-width: 448px;
    min-height: 0;
    margin: 18px auto;
    padding: clamp(20px, 2vw, 28px) 24px;
    border: 1px solid #e4e4e4;
    border-radius: 25px;
    background: rgba(255,255,255,.92);
    box-shadow: none;
}
/* PC con tres columnas: el borde derecho de INFORMACIÓN y el borde izquierdo
   de nombre/precio quedan exactamente a la misma distancia de la foto.
   Antes cada bloque se centraba dentro de columnas con paddings distintos. */
@media (min-width: 1200px) {
    html[data-product-detail-layout="atlas"] body.product-detail-open #productDetail > .product-detail-card {
        --atlas-image-card-gap: 24px;
    }
    html[data-product-detail-layout="atlas"] body.product-detail-open #productDetail .atlas-detail-aside {
        padding-right: var(--atlas-image-card-gap);
    }
    html[data-product-detail-layout="atlas"] body.product-detail-open #productDetail .atlas-aside-inner {
        margin-left: auto;
        margin-right: 0;
    }
    html[data-product-detail-layout="atlas"] body.product-detail-open #productDetail .product-detail-info {
        margin-left: var(--atlas-image-card-gap);
        margin-right: auto;
    }
}
html[data-product-detail-layout="atlas"] #productDetail .product-detail-title {
    margin: 0 0 6px;
    font-size: clamp(15px, 1vw, 19px);
    font-weight: 500;
    letter-spacing: 0;
    line-height: 1.35;
    text-transform: none;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-product-rating:not([hidden]) {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 7px;
    margin: 0 0 12px;
    font-size: 11px;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-stars { color: #f6a900; letter-spacing: 1px; font-size: 14px; }
html[data-product-detail-layout="atlas"] #productDetail #atlasRatingCount { color: #777; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-price-box {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
    padding: 11px 13px;
    border-radius: 12px;
    background: #f2f3f5;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-transfer-primary:not([hidden]) {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-transfer-primary strong {
    min-width: 0;
    font-size: 21px;
    line-height: 1.15;
    letter-spacing: -.02em;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-regular-price-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 8px;
    min-width: 0;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-transfer-primary span,
html[data-product-detail-layout="atlas"] #productDetail .atlas-normal-price-label {
    font-size: 9px;
    letter-spacing: .05em;
    text-align: right;
    white-space: nowrap;
    color: #555b64;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-price-box.has-atlas-transfer .product-detail-transfer { display: none !important; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-regular-price-row .product-detail-price {
    min-width: 0;
    margin: 0;
    gap: 3px;
}
html[data-product-detail-layout="atlas"] #productDetail .product-detail-price .price-new {
    font-size: 22px;
    font-weight: 700;
    color: #171717;
    letter-spacing: -.02em;
}
html[data-product-detail-layout="atlas"] #productDetail .product-detail-price .price-old { font-size: 11px; color: #666; }
html[data-product-detail-layout="atlas"] #productDetail .product-detail-price .price-off { font-size: 11px; color: #2b7e54; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-price-box.has-atlas-transfer .product-detail-price .price-new { font-size: 13px; font-weight: 400; color: #555; }
html[data-product-detail-layout="atlas"] #productDetail .product-detail-transfer {
    display: block;
    margin: 0;
    padding: 0;
    border: 0;
    border-radius: 0;
    background: transparent;
    color: #3d4148;
    font-size: 11px;
    font-weight: 500;
    line-height: 1.4;
    text-align: left;
    box-shadow: none;
}
html[data-product-detail-layout="atlas"] #productDetail .product-detail-transfer[style*="display: none"] { display: none !important; }
html[data-product-detail-layout="atlas"] #productDetail .product-detail-transfer::before,
html[data-product-detail-layout="atlas"] #productDetail .product-detail-transfer::after { display: none !important; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip {
    display: grid;
    grid-template-columns: repeat(3, minmax(0,1fr));
    gap: 8px;
    margin: 12px 0 10px;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip > span {
    display: flex;
    justify-content: center;
    align-items: center;
    min-width: 0;
    gap: 5px;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip .atlas-trust-label {
    display: block;
    min-width: 0;
    font-size: 9px;
    font-weight: 750;
    line-height: 1.25;
    letter-spacing: .01em;
    white-space: nowrap;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip i { flex: 0 0 auto; color: #1f3e65; font-size: 15px; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-shipping-callout {
    display: block;
    margin: 0 0 9px;
    padding: 9px 12px;
    border: 1px solid #dedede;
    border-radius: 14px;
    background: #f4f5f4;
    font-size: 12px;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-shipping-callout > div { display: flex; align-items: center; gap: 7px; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-shipping-callout i { color: #08aa5d; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-shipping-callout strong { font-size: 13px; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-shipping-callout p { margin: 4px 0 0; font-size: 11px; }
html[data-product-detail-layout="atlas"] #productDetail .product-detail-info > .detail-description-title,
html[data-product-detail-layout="atlas"] #productDetail .product-detail-info > .product-description { display: none !important; }
html[data-product-detail-layout="atlas"] #productDetail .detail-size-heading-row { margin: 4px 0 9px; }
html[data-product-detail-layout="atlas"] #productDetail .detail-size-heading-row .detail-block-title { margin: 0; font-size: 12px; font-weight: 500; }
/* El diseño anterior empujaba los talles y el botón al fondo de la ficha,
   y posicionaba la guía encima del título. Deshacerlo solo en Atlas. */
html[data-product-detail-layout="atlas"] #productDetail .product-detail-info > .detail-size-section,
html[data-product-detail-layout="atlas"] #productDetail .product-detail-info:has(> .detail-size-section:not([hidden])) > .detail-size-section {
    margin-top: 8px;
    padding-top: 0;
}
html[data-product-detail-layout="atlas"] #productDetail .product-detail-info > .detail-purchase-section,
html[data-product-detail-layout="atlas"] #productDetail .product-detail-info:has(> .detail-size-section:not([hidden])) > .detail-purchase-section {
    margin-top: 6px;
    padding-top: 0;
}
html[data-product-detail-layout="atlas"] #productDetail .detail-size-heading-row .product-size-guide-trigger:not([hidden]) {
    position: static;
    margin: 0;
}
html[data-product-detail-layout="atlas"] #productDetail .product-detail-info > .product-detail-title {
    padding-right: 0;
}
html[data-product-detail-layout="atlas"] #productDetail .size-options { gap: 5px; }
html[data-product-detail-layout="atlas"] #productDetail .size-option {
    flex: 0 0 auto;
    width: auto;
    min-width: 46px;
    max-width: 100%;
    min-height: 34px;
    height: auto;
    padding: 8px 12px;
    border: 1px solid #c6c6c6;
    border-radius: 9px;
    background: #fff;
    color: #171717;
    font-weight: 500;
    font-size: 11px;
    line-height: 1.2;
    white-space: normal;
    overflow-wrap: anywhere;
}
html[data-product-detail-layout="atlas"] #productDetail .size-option.active,
html[data-product-detail-layout="atlas"] #productDetail .size-option.active:hover { background: #1e1e1e; color: #fff; border-color: #1e1e1e; }
html[data-product-detail-layout="atlas"] #productDetail .size-option.sold-out { color: #999; background: #eee; }
html[data-product-detail-layout="atlas"] #productDetail .product-size-guide-trigger { font-size: 11px; }
html[data-product-detail-layout="atlas"] #productDetail .detail-purchase-section { margin-top: 6px; }
html[data-product-detail-layout="atlas"] #productDetail .detail-purchase-title { margin: 3px 0 6px; font-size: 11px; font-weight: 500; }
html[data-product-detail-layout="atlas"] #productDetail .detail-purchase-row { display: grid; grid-template-columns: 1fr; gap: 8px; }
html[data-product-detail-layout="atlas"] #productDetail .detail-quantity { width: 105px; height: 30px; border-radius: 8px; }
html[data-product-detail-layout="atlas"] #productDetail .detail-quantity button { min-width: 30px; }
html[data-product-detail-layout="atlas"] #productDetail .detail-actions { display: block; margin: 0; }
html[data-product-detail-layout="atlas"] #productDetail .detail-actions .btn-primary,
html[data-product-detail-layout="atlas"] #productDetail #detailAddToCart:not(:disabled),
html[data-product-detail-layout="atlas"] #productDetail #detailAddToCart:not(:disabled):is(:hover,:focus,:active) {
    width: 100%;
    min-height: 46px;
    border: 0 !important;
    border-radius: 24px;
    background: #213f68 !important;
    color: #fff !important;
    font-size: 13px;
    font-weight: 500;
}
html[data-product-detail-layout="atlas"] #productDetail #detailAddToCart .detail-action-svg { display: none; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-payment-methods:not(:empty) {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 4px;
    margin: 8px 0;
    overflow: hidden;
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-payment-methods img { width: 35px; height: 24px; object-fit: contain; }
/* PC: el panel de Atlas tiene scroll propio. Antes Flexbox podía aplastar los
   nueve logos (o recortarlos con overflow:hidden) cuando el producto tenía
   talles, guía y reseñas. Mantener una sola fila proporcional y sin shrink. */
@media (min-width: 901px) {
    html[data-product-detail-layout="atlas"] #productDetail .product-detail-info > .atlas-payment-methods:not(:empty) {
        display: grid;
        grid-template-columns: repeat(9, minmax(0, 1fr));
        align-items: center;
        justify-items: center;
        width: 100%;
        min-width: 0;
        min-height: 26px;
        box-sizing: border-box;
        gap: 4px;
        margin: 8px 0;
        flex: 0 0 auto;
        overflow: visible;
    }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-payment-methods img {
        display: block;
        width: 100%;
        max-width: 35px;
        min-width: 0;
        height: 24px;
        object-fit: contain;
        object-position: center;
    }
}
html[data-product-detail-layout="atlas"] #productDetail .atlas-reviews {
    display: block;
    margin-top: 4px;
    padding: 12px;
    border: 1px solid #ededed;
    border-radius: 17px;
    overflow: hidden;
}
html[data-product-detail-layout="atlas"] body.product-reviews-disabled #productDetail .atlas-reviews,
html[data-product-detail-layout="atlas"] #productDetail .atlas-reviews.atlas-reviews-disabled { display: none; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-reviews-heading { display: flex; justify-content: space-between; align-items: center; gap: 8px; margin-bottom: 9px; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-reviews-heading strong { font-size: 10px; font-weight: 650; letter-spacing: .08em; }
html[data-product-detail-layout="atlas"] #productDetail #atlasReviewBadge { font-size: 11px; color: #555; white-space: nowrap; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-reviews-items { display: flex; gap: 8px; overflow-x: auto; scrollbar-width: none; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-reviews-items::-webkit-scrollbar { display: none; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-mini-review { flex: 0 0 min(80%, 240px); padding: 10px; border-radius: 12px; background: #f4f5f6; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-mini-review-stars { color: #f3a300; letter-spacing: 1px; font-size: 11px; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-mini-review p { margin: 5px 0; font-size: 11px; line-height: 1.35; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-mini-review small { font-size: 10px; color: #444; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-reviews-items > p { margin: 3px 0; font-size: 11px; color: #777; }
html[data-product-detail-layout="atlas"] #productDetail .atlas-reviews-more { display: inline-block; margin-top: 8px; padding: 0; border: 0; background: none; color: #244970; cursor: pointer; font-size: 10px; text-decoration: underline; }
html[data-product-detail-layout="atlas"] #productDetail > .product-reviews-panel,
html[data-product-detail-layout="atlas"] #productDetail > .product-related-section,
html[data-product-detail-layout="atlas"] #productDetail > .product-whatsapp-help { width: min(1180px, calc(100% - 32px)); margin-inline: auto; }

@media (min-width: 901px) and (max-width: 1199px) {
    html[data-product-detail-layout="atlas"] #productDetail > .product-detail-card { grid-template-columns: minmax(0, 52fr) minmax(0, 48fr); }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-detail-aside { grid-row: 2; grid-column: 1 / -1; padding: 22px; }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-aside-inner { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; width: 100%; max-width: 980px; }
    html[data-product-detail-layout="atlas"] #productDetail .product-detail-info { max-width: 470px; }
}
/* Con fotos Atlas y una ficha de información clásica, la tarjeta derecha
   conserva su alto natural aunque la galería sea mucho más alta. */
@media (min-width: 901px) {
    html[data-product-detail-image-layout="atlas"]:not([data-product-detail-layout="atlas"]) #productDetail .product-detail-info {
        align-self: start;
    }
    /* Si se eligió la información Atlas pero fotos clásicas, no aplicar el
       contraste pensado para una gran foto centrada bajo el encabezado. */
    html[data-product-detail-layout="atlas"]:not([data-product-detail-image-layout="atlas"])[data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main .header-action,
    html[data-product-detail-layout="atlas"]:not([data-product-detail-image-layout="atlas"])[data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main .header-action svg {
        color: #171717 !important;
        filter: none !important;
    }
    html[data-product-detail-image-layout="atlas"]:not([data-product-detail-layout="atlas"])[data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main [data-header-zone="right"] .header-action,
    html[data-product-detail-image-layout="atlas"]:not([data-product-detail-layout="atlas"])[data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main [data-header-zone="right"] .header-action svg {
        color: #171717 !important;
        filter: none !important;
    }
}
@media (max-width: 900px) {
    html[data-product-detail-layout="atlas"] body.product-detail-open #productDetail.product-detail-section.container { padding: 0 0 26px; max-width: none; }
    html[data-product-detail-layout="atlas"] #productDetail > .product-detail-card {
        display: flex !important;
        flex-direction: column;
        min-height: 0;
    }
    html[data-product-detail-layout="atlas"] #productDetail .detail-gallery-column { order: 0; height: auto; min-height: 0; overflow: visible; }
    html[data-product-detail-image-layout="atlas"] #productDetail .product-detail-image {
        position: relative;
        width: 100%;
        height: auto !important;
        aspect-ratio: 4 / 5 !important;
    }
    html[data-product-detail-image-layout="atlas"] #productDetail .product-detail-image > img { position: absolute !important; height: 100% !important; object-fit: cover !important; }
    html[data-product-detail-image-layout="atlas"] #productDetail .detail-gallery-thumbnails {
        left: 10px;
        bottom: 10px;
        max-height: 250px;
        width: 47px;
    }
    html[data-product-detail-image-layout="atlas"] #productDetail .detail-thumb,
    html[data-product-detail-image-layout="atlas"] #productDetail .detail-thumb-more { width: 45px; height: 56px; flex-basis: 56px; }
    html[data-product-detail-layout="atlas"] #productDetail .product-detail-info {
        order: 1;
        width: calc(100% - 24px);
        max-width: 650px;
        min-height: 0;
        margin: 12px auto;
        padding: 20px clamp(14px, 4vw, 26px);
        border: 1px solid #e6e6e6;
        border-radius: 20px;
        background: #fff;
    }
    html[data-product-detail-layout="atlas"] #productDetail .product-detail-title { font-size: 19px; }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-detail-aside { order: 2; width: 100%; padding: 10px 12px 22px; background: transparent; }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-aside-inner { max-width: 650px; }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-accordion-body { max-height: none; }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-reviews-items { overflow-x: auto; }
    /* Cantidad y compra comparten una única fila proporcional en celular.
       Se limpia la cuadrícula antigua para evitar ubicaciones implícitas. */
    html[data-product-detail-layout="atlas"] #productDetail .detail-purchase-row {
        display: grid;
        grid-template-columns: clamp(96px, 30%, 115px) minmax(0, 1fr);
        grid-template-areas: none;
        align-items: center;
        width: 100%;
        min-width: 0;
        gap: 8px;
    }
    html[data-product-detail-layout="atlas"] #productDetail .detail-quantity {
        grid-area: auto;
        width: 100%;
        min-width: 0;
        height: 46px;
    }
    html[data-product-detail-layout="atlas"] #productDetail .detail-quantity button {
        min-width: 30px;
    }
    html[data-product-detail-layout="atlas"] #productDetail .detail-actions {
        display: block !important;
        width: 100%;
        min-width: 0;
        margin: 0;
    }
    html[data-product-detail-layout="atlas"] #productDetail #detailAddToCart {
        display: flex;
        grid-area: auto;
        width: 100% !important;
        max-width: none;
        min-height: 46px;
        margin: 0;
        padding: 0 8px;
        font-size: clamp(11px, 3.3vw, 13px);
        white-space: nowrap;
    }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-price-box {
        padding: 11px 12px;
    }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-transfer-primary strong {
        font-size: clamp(18px, 5vw, 21px);
    }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-transfer-primary span,
    html[data-product-detail-layout="atlas"] #productDetail .atlas-normal-price-label {
        font-size: 8.5px;
        letter-spacing: .025em;
    }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip {
        width: 100%;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 6px;
        margin: 12px 0;
    }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip > span {
        justify-content: center;
        gap: 5px;
        padding: 5px 2px;
    }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip > span:not(:last-child) {
        border-right: 1px solid #e1e5ea;
    }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip .atlas-trust-label {
        font-size: 9px;
        line-height: 1.3;
    }
}
@media (max-width: 390px) {
    html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip > span {
        flex-direction: column;
        gap: 4px;
        text-align: center;
    }
    html[data-product-detail-layout="atlas"] #productDetail .atlas-trust-strip .atlas-trust-label {
        text-align: center;
    }
}
@media (prefers-reduced-motion: reduce) {
    html[data-product-detail-image-layout="atlas"] #productDetail .product-detail-image > img { transition: none !important; }
}

/* Galería Atlas: desplazamiento vertical real de todas las fotos (rueda o dedo).
   La galería horizontal original permanece intacta para los otros diseños. */
#productDetail .atlas-gallery-roll { display: none; }
html[data-product-detail-image-layout="atlas"] body.product-detail-open #productDetail .atlas-gallery-roll.has-images {
    display: block;
    position: absolute;
    inset: 0;
    z-index: 4;
    overflow: hidden;
}
html[data-product-detail-image-layout="atlas"] body.product-detail-open #productDetail .detail-gallery-column.atlas-gallery-ready > .product-detail-image,
html[data-product-detail-image-layout="atlas"] body.product-detail-open #productDetail .detail-gallery-column.atlas-gallery-ready > #detailThumbnails { display: none !important; }
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-track {
    position: absolute;
    inset: 0;
    overflow-x: hidden;
    overflow-y: auto;
    scrollbar-width: none;
    scroll-snap-type: y proximity;
    overscroll-behavior-y: auto;
    overflow-anchor: none;
    touch-action: pan-y;
    -webkit-overflow-scrolling: touch;
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-track::-webkit-scrollbar { display: none; }
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-track > img {
    display: block;
    width: 100%;
    height: auto;
    min-height: 100%;
    max-height: none;
    scroll-snap-align: start;
    object-fit: contain;
    user-select: none;
    -webkit-user-drag: none;
    cursor: zoom-in;
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-progress {
    position: absolute;
    z-index: 5;
    top: 10%;
    bottom: 10%;
    right: 12px;
    width: 3px;
    border-radius: 4px;
    background: rgba(255,255,255,.45);
    pointer-events: none;
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-progress i {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    height: 20%;
    border-radius: inherit;
    background: #fff;
    box-shadow: 0 0 4px rgba(0,0,0,.45);
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-thumbs {
    position: absolute;
    z-index: 6;
    bottom: 14px;
    left: 12px;
    width: 44px;
    overflow: hidden;
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-thumbs-inner {
    display: flex;
    flex-direction: column;
    gap: 6px;
    transition: transform .3s ease;
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-thumbs button {
    display: block;
    flex: 0 0 55px;
    width: 44px;
    height: 55px;
    padding: 0;
    border: 1.5px solid rgba(255,255,255,.65);
    border-radius: 4px;
    overflow: hidden;
    background: #ddd;
    opacity: .8;
    cursor: pointer;
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-thumbs button img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-thumbs button.is-active {
    opacity: 1;
    border-color: #fff;
    box-shadow: inset 0 0 0 1px #171717;
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-thumbs button:focus-visible {
    outline: 2px solid #1c4067;
    outline-offset: 2px;
}
html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-roll:not(.has-multiple) :is(.atlas-gallery-thumbs, .atlas-gallery-progress) {
    display: none;
}
@media (max-width: 900px) {
    html[data-product-detail-image-layout="atlas"] body.product-detail-open #productDetail .detail-gallery-column {
        display: block !important;
        position: relative;
        height: min(85dvh, 125vw) !important;
        min-height: 320px !important;
        overflow: hidden !important;
        background: #e9e9e9;
    }
    html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-progress { right: 8px; }
    html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-thumbs { left: 10px; bottom: 10px; }
}
@media (prefers-reduced-motion: reduce) {
    html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-thumbs-inner { transition: none; }
    html[data-product-detail-image-layout="atlas"] #productDetail .atlas-gallery-track { scroll-behavior: auto; }
}

/* La referencia Atlas superpone el header: controles oscuros sobre las alas
   claras, marca blanca sobre la foto central. Solo si Apariencia lo activa. */
@media (min-width: 901px) {
    /* PC: altura natural, incluso dentro de la vista previa del panel o
       cuando cambia el zoom. La antigua altura basada en 100dvh y el
       scroll forzado dejaban media tarjeta vacía y recortaban su contenido. */
    html[data-product-detail-layout="atlas"] body.product-detail-open #productDetail .product-detail-info {
        position: relative;
        top: auto;
        align-self: start;
        justify-content: flex-start;
        height: auto;
        min-height: 0;
        max-height: none;
        overflow: visible;
        overscroll-behavior: auto;
        scrollbar-gutter: auto;
    }
    /* Restaurado al diseño anterior de PC: cantidad primero y el botón
       debajo a todo el ancho. No altera los controles de celular. */
    html[data-product-detail-layout="atlas"] #productDetail .size-options {
        display: flex;
        flex-wrap: wrap;
        align-items: stretch;
        gap: 6px;
    }
    html[data-product-detail-layout="atlas"] #productDetail .size-option {
        flex: 0 0 auto;
        width: auto;
        min-width: 48px;
        max-width: 100%;
        min-height: 34px;
        padding: 8px 12px;
        font-size: 12px;
    }
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main .header-action,
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main .header-action svg {
        color: #171717 !important;
        filter: none !important;
        text-shadow: none !important;
    }
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main .header-action-label {
        text-shadow: none !important;
    }
    /* No recolorear el logo subido por la tienda: brightness/invert lo
       convertía en una silueta blanca y destruía sus colores originales. */
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main .header-brand-logo {
        filter: none !important;
    }
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main .header-brand-text {
        color: #fff !important;
        text-shadow: 0 1px 3px rgba(0,0,0,.45);
    }
    /* Respetar también el color/tipo de logo de texto configurado en Apariencia. */
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main[data-header-logo-mode="text"] .header-brand-text {
        color: var(--appearance-logo-color) !important;
        text-shadow: var(--appearance-logo-text-shadow) !important;
    }
    /* Si la persona movió logo o acciones de zona en Apariencia, mantener
       contraste correcto respecto de la foto central y los laterales claros. */
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main :is([data-header-zone="left"],[data-header-zone="right"]) .header-brand-logo {
        filter: none !important;
    }
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main :is([data-header-zone="left"],[data-header-zone="right"]) .header-brand-text {
        color: #171717 !important;
        text-shadow: none !important;
    }
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main [data-header-zone="center"] .header-action,
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main [data-header-zone="center"] .header-action svg {
        color: #fff !important;
        filter: drop-shadow(0 1px 2px rgba(0,0,0,.55)) !important;
    }
}
@media (min-width: 901px) and (max-width: 1199px) {
    /* En la vista de dos columnas la foto ocupa el lado izquierdo. */
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main [data-header-zone="left"] .header-action,
    html[data-product-detail-layout="atlas"][data-product-detail-image-layout="atlas"][data-header-transparency-state="overlay"]
    .storefront-header-sticky header.header-main [data-header-zone="left"] .header-action svg {
        color: #fff !important;
        filter: drop-shadow(0 1px 2px rgba(0,0,0,.55)) !important;
    }
}
