/* Quorlyx Revenue Engine: layout-specific rules for every offer type. */
.quorlyx-re-layout-grid .quorlyx-re-group-items,
.quorlyx-re-layout-showcase .quorlyx-re-group-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(170px, 1fr));
    align-items: stretch;
    justify-content: stretch;
}

.quorlyx-re-layout-grid .quorlyx-re-group-items > .quorlyx-re-fbt-item,
.quorlyx-re-layout-grid .quorlyx-re-group-items > .quorlyx-re-bundle-item,
.quorlyx-re-layout-showcase .quorlyx-re-group-items > .quorlyx-re-fbt-item,
.quorlyx-re-layout-showcase .quorlyx-re-group-items > .quorlyx-re-bundle-item {
    flex-direction: column;
    justify-content: flex-start;
    text-align: center;
}

.quorlyx-re-layout-grid .quorlyx-re-group-items > .quorlyx-re-plus,
.quorlyx-re-layout-grid .quorlyx-re-group-items > .quorlyx-re-group-total,
.quorlyx-re-layout-showcase .quorlyx-re-group-items > .quorlyx-re-plus,
.quorlyx-re-layout-showcase .quorlyx-re-group-items > .quorlyx-re-group-total {
    display: none;
}

.quorlyx-re-layout-showcase .quorlyx-re-group-items {
    grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
    gap: 18px;
}

.quorlyx-re-layout-showcase .quorlyx-re-group-items .quorlyx-re-thumb {
    width: 100%;
}

.quorlyx-re-layout-showcase .quorlyx-re-group-items .quorlyx-re-thumb img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1;
}

.quorlyx-re-layout-list .quorlyx-re-group-items,
.quorlyx-re-layout-compact .quorlyx-re-group-items {
    display: grid;
    grid-template-columns: 1fr;
    justify-content: stretch;
}

.quorlyx-re-layout-list .quorlyx-re-group-items > .quorlyx-re-plus,
.quorlyx-re-layout-list .quorlyx-re-group-items > .quorlyx-re-group-total,
.quorlyx-re-layout-compact .quorlyx-re-group-items > .quorlyx-re-plus,
.quorlyx-re-layout-compact .quorlyx-re-group-items > .quorlyx-re-group-total {
    display: none;
}

.quorlyx-re-layout-list .quorlyx-re-fbt-item,
.quorlyx-re-layout-list .quorlyx-re-bundle-item {
    width: 100%;
}

.quorlyx-re-layout-compact .quorlyx-re-fbt-item,
.quorlyx-re-layout-compact .quorlyx-re-bundle-item {
    min-height: 62px;
    padding: 7px;
}

.quorlyx-re-layout-compact .quorlyx-re-group-items .quorlyx-re-thumb img {
    width: 48px !important;
    height: 48px !important;
}

.quorlyx-re-layout-square .quorlyx-re-group-items,
.quorlyx-re-layout-tile_card .quorlyx-re-group-items {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    align-items: stretch;
    justify-content: stretch;
}

.quorlyx-re-layout-square .quorlyx-re-fbt-item,
.quorlyx-re-layout-square .quorlyx-re-bundle-item,
.quorlyx-re-layout-tile_card .quorlyx-re-fbt-item,
.quorlyx-re-layout-tile_card .quorlyx-re-bundle-item {
    flex-direction: column;
    justify-content: flex-start;
    text-align: center;
}

.quorlyx-re-layout-square .quorlyx-re-group-items .quorlyx-re-thumb,
.quorlyx-re-layout-tile_card .quorlyx-re-group-items .quorlyx-re-thumb {
    width: 100%;
}

.quorlyx-re-layout-square .quorlyx-re-group-items .quorlyx-re-thumb img,
.quorlyx-re-layout-tile_card .quorlyx-re-group-items .quorlyx-re-thumb img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1;
}

.quorlyx-re-layout-square .quorlyx-re-group-items > .quorlyx-re-plus,
.quorlyx-re-layout-square .quorlyx-re-group-items > .quorlyx-re-group-total,
.quorlyx-re-layout-tile_card .quorlyx-re-group-items > .quorlyx-re-plus,
.quorlyx-re-layout-tile_card .quorlyx-re-group-items > .quorlyx-re-group-total {
    display: none;
}

.quorlyx-re-layout-tile_card .quorlyx-re-fbt-footer,
.quorlyx-re-layout-tile_card .quorlyx-re-bundle-footer {
    justify-content: center;
    text-align: center;
}

.quorlyx-re-layout-collage .quorlyx-re-group-items > .quorlyx-re-plus,
.quorlyx-re-layout-collage .quorlyx-re-group-items > .quorlyx-re-group-total {
    display: none;
}

.quorlyx-re-layout-banner .quorlyx-re-group-items {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(120px, 1fr));
    align-items: stretch;
    justify-content: stretch;
}

.quorlyx-re-layout-banner .quorlyx-re-group-items > .quorlyx-re-fbt-item,
.quorlyx-re-layout-banner .quorlyx-re-group-items > .quorlyx-re-bundle-item {
    flex-direction: column;
    justify-content: flex-start;
    text-align: center;
}

.quorlyx-re-layout-banner .quorlyx-re-group-items > .quorlyx-re-plus,
.quorlyx-re-layout-banner .quorlyx-re-group-items > .quorlyx-re-group-total {
    display: none;
}

.quorlyx-re-layout-banner .quorlyx-re-group-items .quorlyx-re-thumb {
    width: 100%;
}

.quorlyx-re-layout-banner .quorlyx-re-group-items .quorlyx-re-thumb img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1;
}

.quorlyx-re-layout-carousel .quorlyx-re-group-items > .quorlyx-re-plus,
.quorlyx-re-layout-carousel .quorlyx-re-group-items > .quorlyx-re-group-total {
    display: none;
}

.quorlyx-re-layout-carousel .quorlyx-re-group-items > .quorlyx-re-fbt-item,
.quorlyx-re-layout-carousel .quorlyx-re-group-items > .quorlyx-re-bundle-item {
    flex: 0 0 min(230px, 76vw);
    flex-direction: column;
    justify-content: flex-start;
    text-align: center;
}

.quorlyx-re-layout-carousel .quorlyx-re-group-items .quorlyx-re-thumb {
    width: 100%;
}

.quorlyx-re-layout-carousel .quorlyx-re-group-items .quorlyx-re-thumb img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 1;
}

@media (max-width: 1024px) {
    .quorlyx-re-layout-square .quorlyx-re-group-items,
    .quorlyx-re-layout-tile_card .quorlyx-re-group-items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .quorlyx-re-layout-showcase .quorlyx-re-group-items {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    /* Grid and showcase keep their multi-column identity on phones instead of
       collapsing into a single list-like column. */
    .quorlyx-re-offer.quorlyx-re-layout-grid .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-grid .quorlyx-re-group-items {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .quorlyx-re-offer.quorlyx-re-layout-showcase .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-showcase .quorlyx-re-group-items {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }
}

@media (max-width: 380px) {
    .quorlyx-re-offer.quorlyx-re-layout-square .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-square .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-tile_card .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-tile_card .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-showcase .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-showcase .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-grid .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-grid .quorlyx-re-group-items {
        grid-template-columns: 1fr !important;
    }
}

/* Step 4 presentation controls. */
.quorlyx-re-card-elevated {
    box-shadow: 0 16px 38px rgba(15, 23, 42, .11) !important;
}

.quorlyx-re-card-bordered {
    border-width: 2px !important;
    box-shadow: none !important;
}

.quorlyx-re-card-flat {
    border-color: transparent !important;
    background: var(--qre-muted-surface) !important;
    box-shadow: none !important;
}

.quorlyx-re-align-start {
    text-align: start;
}

.quorlyx-re-align-center,
.quorlyx-re-align-center .quorlyx-re-product,
.quorlyx-re-align-center .quorlyx-re-fbt-item,
.quorlyx-re-align-center .quorlyx-re-bundle-item {
    text-align: center;
}

.quorlyx-re-align-center > .quorlyx-re-discount,
.quorlyx-re-align-center > .quorlyx-re-countdown {
    margin-inline: auto;
}

.quorlyx-re-align-center .quorlyx-re-fbt-footer,
.quorlyx-re-align-center .quorlyx-re-bundle-footer {
    justify-content: center;
}

.quorlyx-re-cta-outline .button,
.quorlyx-re-cta-outline .quorlyx-re-add,
.quorlyx-re-cta-outline .quorlyx-re-add-selected {
    background: transparent !important;
    color: var(--qre-primary) !important;
}

.quorlyx-re-cta-soft .button,
.quorlyx-re-cta-soft .quorlyx-re-add,
.quorlyx-re-cta-soft .quorlyx-re-add-selected {
    border-color: transparent !important;
    background: color-mix(in srgb, var(--qre-primary) 13%, #fff) !important;
    color: var(--qre-primary) !important;
}

.quorlyx-re-cta-outline .button:hover,
.quorlyx-re-cta-outline .button:focus-visible,
.quorlyx-re-cta-outline .quorlyx-re-add:hover,
.quorlyx-re-cta-outline .quorlyx-re-add-selected:hover,
.quorlyx-re-cta-soft .button:hover,
.quorlyx-re-cta-soft .button:focus-visible,
.quorlyx-re-cta-soft .quorlyx-re-add:hover,
.quorlyx-re-cta-soft .quorlyx-re-add-selected:hover {
    border-color: var(--qre-primary) !important;
    background: color-mix(in srgb, var(--qre-primary) 20%, #fff) !important;
    color: var(--qre-primary) !important;
}

.quorlyx-re-offer .quorlyx-re-add.is-added,
.quorlyx-re-offer .quorlyx-re-add-selected.is-added {
    border-color: var(--qre-success) !important;
    background: var(--qre-success) !important;
    color: #fff !important;
}

.quorlyx-re-cta-size-compact .button,
.quorlyx-re-cta-size-compact .quorlyx-re-add,
.quorlyx-re-cta-size-compact .quorlyx-re-add-selected {
    min-height: 34px;
    padding: 7px 12px !important;
    font-size: var(--qre-text-small) !important;
}

.quorlyx-re-cta-size-large .button,
.quorlyx-re-cta-size-large .quorlyx-re-add,
.quorlyx-re-cta-size-large .quorlyx-re-add-selected {
    min-height: 50px;
    padding: 13px 24px !important;
}

.quorlyx-re-cta-width-full .button,
.quorlyx-re-cta-width-full .quorlyx-re-add,
.quorlyx-re-cta-width-full .quorlyx-re-add-selected {
    width: 100% !important;
}

/* Grid: uniform cards with equal-height actions. */
.quorlyx-re-layout-grid .quorlyx-re-products {
    grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
    align-items: stretch;
}

.quorlyx-re-layout-grid .quorlyx-re-product,
.quorlyx-re-layout-grid .quorlyx-re-fbt-item,
.quorlyx-re-layout-grid .quorlyx-re-bundle-item {
    height: 100%;
    padding: 12px;
}

/* Square: strict equal tiles; compact text beneath a 1:1 image. */
.quorlyx-re-layout-square .quorlyx-re-products,
.quorlyx-re-layout-square .quorlyx-re-group-items {
    display: grid !important;
    grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
    align-items: stretch;
}

.quorlyx-re-layout-square .quorlyx-re-product,
.quorlyx-re-layout-square .quorlyx-re-fbt-item,
.quorlyx-re-layout-square .quorlyx-re-bundle-item {
    flex-direction: column;
    justify-content: flex-start;
    padding: 9px;
    text-align: center;
}

/* Tile card: a deliberately compact 2x2 merchandising unit. */
.quorlyx-re-layout-tile_card {
    max-width: var(--qre-card-max);
    margin-inline: auto;
}

.quorlyx-re-layout-tile_card .quorlyx-re-products,
.quorlyx-re-layout-tile_card .quorlyx-re-group-items {
    display: grid !important;
    grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    gap: 10px;
}

.quorlyx-re-layout-tile_card .quorlyx-re-product,
.quorlyx-re-layout-tile_card .quorlyx-re-fbt-item,
.quorlyx-re-layout-tile_card .quorlyx-re-bundle-item {
    padding: 8px;
    background: var(--qre-muted-surface);
}

.quorlyx-re-layout-tile_card .quorlyx-re-fbt-footer,
.quorlyx-re-layout-tile_card .quorlyx-re-bundle-footer {
    border: 1px solid var(--qre-line);
    border-radius: 12px;
    background: var(--qre-muted-surface);
    padding: 12px;
}

/* Collage: first item is the visual hero; remaining items are supporting tiles. */
.quorlyx-re-layout-collage .quorlyx-re-products,
.quorlyx-re-layout-collage .quorlyx-re-group-items {
    display: grid !important;
    grid-template-columns: minmax(0, 1.65fr) minmax(120px, 1fr) !important;
    align-items: stretch;
}

.quorlyx-re-layout-collage .quorlyx-re-product:first-child,
.quorlyx-re-layout-collage .quorlyx-re-bundle-item:first-of-type,
.quorlyx-re-layout-collage .quorlyx-re-fbt-item:first-of-type {
    grid-row: 1 / span 3;
    padding: 14px;
}

.quorlyx-re-layout-collage .quorlyx-re-product:not(:first-child),
.quorlyx-re-layout-collage .quorlyx-re-bundle-item:not(:first-of-type),
.quorlyx-re-layout-collage .quorlyx-re-fbt-item:not(:first-of-type) {
    flex-direction: row;
    text-align: start;
}

.quorlyx-re-layout-collage .quorlyx-re-product:not(:first-child) img,
.quorlyx-re-layout-collage .quorlyx-re-bundle-item:not(:first-of-type) img,
.quorlyx-re-layout-collage .quorlyx-re-fbt-item:not(:first-of-type) img {
    width: min(72px, var(--qre-tile)) !important;
    height: min(72px, var(--qre-tile)) !important;
}

/* Banner: message/CTA column beside a compact product rail. */
.quorlyx-re-layout-banner {
    grid-template-columns: minmax(190px, .85fr) minmax(0, 1.7fr) !important;
    padding: clamp(18px, 3vw, 30px);
    background: linear-gradient(135deg, var(--qre-muted-surface), var(--qre-surface)) !important;
}

.quorlyx-re-layout-banner .quorlyx-re-products,
.quorlyx-re-layout-banner .quorlyx-re-group-items {
    padding: 10px;
    border: 1px solid var(--qre-line);
    border-radius: 14px;
    background: var(--qre-surface);
}

/* List: clean horizontal rows separated by dividers. */
.quorlyx-re-layout-list .quorlyx-re-products,
.quorlyx-re-layout-list .quorlyx-re-group-items {
    gap: 0;
}

.quorlyx-re-layout-list .quorlyx-re-product,
.quorlyx-re-layout-list .quorlyx-re-fbt-item,
.quorlyx-re-layout-list .quorlyx-re-bundle-item {
    width: 100%;
    border: 0;
    border-bottom: 1px solid var(--qre-line);
    border-radius: 0;
    padding: 13px 4px;
    background: transparent;
}

/* Compact: dense, low-height rows for cart/checkout placements. */
.quorlyx-re-layout-compact {
    max-width: min(100%, 620px);
    padding: 12px !important;
}

.quorlyx-re-layout-compact .quorlyx-re-products,
.quorlyx-re-layout-compact .quorlyx-re-group-items {
    gap: 6px;
}

.quorlyx-re-layout-compact .quorlyx-re-product,
.quorlyx-re-layout-compact .quorlyx-re-fbt-item,
.quorlyx-re-layout-compact .quorlyx-re-bundle-item {
    min-height: 54px;
    padding: 6px;
}

.quorlyx-re-layout-compact .quorlyx-re-product img,
.quorlyx-re-layout-compact .quorlyx-re-thumb img {
    width: 44px !important;
    height: 44px !important;
}

/* Carousel: independent horizontal product cards with snap scrolling. */
.quorlyx-re-layout-carousel .quorlyx-re-products,
.quorlyx-re-layout-carousel .quorlyx-re-group-items {
    display: flex !important;
    flex-wrap: nowrap !important;
    overflow-x: auto;
    padding: 4px 2px 12px;
    scroll-padding-inline: 2px;
}

.quorlyx-re-layout-carousel .quorlyx-re-product,
.quorlyx-re-layout-carousel .quorlyx-re-fbt-item,
.quorlyx-re-layout-carousel .quorlyx-re-bundle-item {
    flex: 0 0 min(245px, 78vw) !important;
    flex-direction: column;
    align-items: stretch;
    text-align: center;
}

.quorlyx-re-layout-carousel .quorlyx-re-product-image,
.quorlyx-re-layout-carousel .quorlyx-re-thumb {
    width: 100%;
}

.quorlyx-re-layout-carousel .quorlyx-re-product img,
.quorlyx-re-layout-carousel .quorlyx-re-thumb img {
    width: 100% !important;
    height: auto !important;
    aspect-ratio: 4 / 3;
}

/* Showcase: roomy editorial cards with large media and stronger spacing. */
.quorlyx-re-layout-showcase {
    padding: clamp(22px, 4vw, 36px);
}

.quorlyx-re-layout-showcase .quorlyx-re-products,
.quorlyx-re-layout-showcase .quorlyx-re-group-items {
    grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)) !important;
    gap: 24px;
}

.quorlyx-re-layout-showcase .quorlyx-re-product,
.quorlyx-re-layout-showcase .quorlyx-re-fbt-item,
.quorlyx-re-layout-showcase .quorlyx-re-bundle-item {
    padding: 16px;
    border-radius: 18px;
}

@media (max-width: 1024px) {
    .quorlyx-re-layout-banner {
        display: block !important;
    }

    .quorlyx-re-layout-collage .quorlyx-re-products,
    .quorlyx-re-layout-collage .quorlyx-re-group-items {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    .quorlyx-re-layout-collage .quorlyx-re-product:first-child,
    .quorlyx-re-layout-collage .quorlyx-re-bundle-item:first-of-type,
    .quorlyx-re-layout-collage .quorlyx-re-fbt-item:first-of-type {
        grid-column: 1 / -1;
        grid-row: auto;
    }
}

/* Compact rows (per-offer "Mobile appearance" choice): on phones, collapse any
   layout's product presentation into slim horizontal rows with small
   thumbnails. Opt-in via .quorlyx-re-mobile-compact; the default is to keep
   the chosen layout's desktop structure, scaled to the phone width. */
@media (max-width: 1024px) {
    .quorlyx-re-offer.quorlyx-re-mobile-compact {
        padding: 12px;
    }

    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-bundle-items,
    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-fbt-items {
        display: grid !important;
        grid-template-columns: 1fr !important;
        gap: 8px;
        overflow-x: visible;
    }

    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-product,
    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-fbt-item,
    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-bundle-item {
        flex: 1 1 auto !important;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        grid-column: auto !important;
        grid-row: auto !important;
        width: 100%;
        min-height: 0;
        padding: 8px;
        text-align: start;
    }

    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-product-image,
    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-thumb {
        width: auto;
        flex: 0 0 auto;
    }

    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-product img,
    .quorlyx-re-offer.quorlyx-re-mobile-compact .quorlyx-re-thumb img {
        width: clamp(48px, 16vw, 64px) !important;
        height: clamp(48px, 16vw, 64px) !important;
        aspect-ratio: auto;
    }
}

/* Mobile multi-offer presentation (admin setting): how several offers sharing
   one placement behave on phones. Wrappers carry quorlyx-re-mobile-<mode>.
   Desktop is unaffected — everything lives behind the 600px media query. */
.quorlyx-re-show-more-offers {
    display: none;
}

@media (max-width: 1024px) {
    /* Carousel: offers side by side in a snap rail; one card ~88vw with a peek
       of the next, so total vertical space stays that of a single offer. */
    .quorlyx-re-offers-grid.quorlyx-re-mobile-carousel,
    .quorlyx-re-section-offers.quorlyx-re-mobile-carousel {
        display: flex !important;
        flex-wrap: nowrap;
        gap: 12px;
        overflow-x: auto;
        padding: 4px 2px 14px;
        scroll-snap-type: x mandatory;
        scroll-padding-inline: 2px;
        -webkit-overflow-scrolling: touch;
        scrollbar-width: thin;
        scrollbar-color: var(--qre-line) transparent;
    }

    .quorlyx-re-offers-grid.quorlyx-re-mobile-carousel > .quorlyx-re-offer,
    .quorlyx-re-section-offers.quorlyx-re-mobile-carousel > .quorlyx-re-offer {
        flex: 0 0 min(88%, 340px);
        margin: 0;
        scroll-snap-align: center;
    }

    /* Accordion: every offer collapses to its title bar; the first starts
       open. JS toggles qre-acc-open / qre-acc-closed. */
    .quorlyx-re-mobile-accordion > .quorlyx-re-offer > h3 {
        position: relative;
        cursor: pointer;
        padding-inline-end: 26px;
    }

    .quorlyx-re-mobile-accordion > .quorlyx-re-offer > h3::after {
        content: '';
        position: absolute;
        inset-inline-end: 4px;
        top: 50%;
        width: 9px;
        height: 9px;
        border-inline-end: 2px solid var(--qre-muted);
        border-block-end: 2px solid var(--qre-muted);
        transform: translateY(-70%) rotate(45deg);
        transition: transform .18s ease;
    }

    .quorlyx-re-mobile-accordion > .quorlyx-re-offer:has(> h3):not(.qre-acc-open):not(:first-child) > :not(h3),
    .quorlyx-re-mobile-accordion > .quorlyx-re-offer:has(> h3).qre-acc-closed > :not(h3) {
        display: none !important;
    }

    .quorlyx-re-mobile-accordion > .quorlyx-re-offer:has(> h3):not(.qre-acc-open):not(:first-child) > h3,
    .quorlyx-re-mobile-accordion > .quorlyx-re-offer:has(> h3).qre-acc-closed > h3 {
        margin: 0 !important;
    }

    .quorlyx-re-mobile-accordion > .quorlyx-re-offer:first-child:not(.qre-acc-closed) > h3::after,
    .quorlyx-re-mobile-accordion > .quorlyx-re-offer.qre-acc-open > h3::after {
        transform: translateY(-30%) rotate(-135deg);
    }

    /* Show more: only the first offer is visible until the reveal button
       (rendered server-side) is tapped. */
    .quorlyx-re-mobile-show_more:not(.qre-expanded) > .quorlyx-re-offer:nth-of-type(n+2) {
        display: none;
    }

    .quorlyx-re-mobile-show_more:not(.qre-expanded) > .quorlyx-re-show-more-offers {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 100%;
        min-height: 44px;
        padding: 10px 18px;
        border: 1px solid var(--qre-line);
        border-radius: 10px;
        background: var(--qre-muted-surface);
        color: var(--qre-text);
        font-family: inherit;
        font-size: var(--qre-text-size, 14px);
        font-weight: 700;
        cursor: pointer;
    }
}

/* RTL: a horizontal flex scroller with RTL direction leaks phantom scrollable
   area into the viewport (Chromium RTL scroller bug), letting the whole page
   pan sideways. Run rail mechanics LTR; each card keeps RTL content flow. */
[dir='rtl'] .quorlyx-re-layout-carousel .quorlyx-re-products,
[dir='rtl'] .quorlyx-re-layout-carousel .quorlyx-re-bundle-items,
[dir='rtl'] .quorlyx-re-layout-carousel .quorlyx-re-fbt-items {
    direction: ltr;
}

[dir='rtl'] .quorlyx-re-layout-carousel .quorlyx-re-product,
[dir='rtl'] .quorlyx-re-layout-carousel .quorlyx-re-bundle-item,
[dir='rtl'] .quorlyx-re-layout-carousel .quorlyx-re-fbt-item {
    direction: rtl;
}

@media (max-width: 1024px) {
    [dir='rtl'] .quorlyx-re-offers-grid.quorlyx-re-mobile-carousel,
    [dir='rtl'] .quorlyx-re-section-offers.quorlyx-re-mobile-carousel {
        direction: ltr;
    }

    [dir='rtl'] .quorlyx-re-offers-grid.quorlyx-re-mobile-carousel > .quorlyx-re-offer,
    [dir='rtl'] .quorlyx-re-section-offers.quorlyx-re-mobile-carousel > .quorlyx-re-offer {
        direction: rtl;
    }
}

/* Per-offer rail direction (offer editor → "Carousel scroll direction").
   scroll-rtl starts the rail at the right and scrolls leftwards; scroll-ltr
   forces the opposite. Must sit after the [dir='rtl'] workaround above so the
   explicit choice wins at equal specificity. The wrapper clips sideways
   overflow and the rail contains overscroll so the Chromium RTL phantom-area
   leak (see above) cannot pan the whole page. */
.quorlyx-re-offer.quorlyx-re-scroll-rtl,
.quorlyx-re-offer.quorlyx-re-scroll-ltr {
    overflow-x: clip;
}

.quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-products,
.quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-bundle-items,
.quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-fbt-items,
.quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-group-items {
    direction: rtl;
    overscroll-behavior-x: contain;
}

.quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-products,
.quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-bundle-items,
.quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-fbt-items,
.quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-group-items {
    direction: ltr;
    overscroll-behavior-x: contain;
}

/* Cards (and the bundle math chips) keep the page's text direction no matter
   which way the rail runs. */
.quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-product,
.quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-bundle-item,
.quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-fbt-item,
.quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-group-total,
.quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-product,
.quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-bundle-item,
.quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-fbt-item,
.quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-group-total {
    direction: ltr;
}

[dir='rtl'] .quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-product,
[dir='rtl'] .quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-bundle-item,
[dir='rtl'] .quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-fbt-item,
[dir='rtl'] .quorlyx-re-scroll-rtl.quorlyx-re-layout-carousel .quorlyx-re-group-total,
[dir='rtl'] .quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-product,
[dir='rtl'] .quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-bundle-item,
[dir='rtl'] .quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-fbt-item,
[dir='rtl'] .quorlyx-re-scroll-ltr.quorlyx-re-layout-carousel .quorlyx-re-group-total {
    direction: rtl;
}

/* Carousel-layout offers keep their horizontal product rail on phones — the
   chosen layout looks the same as on desktop, including inside the mobile
   multi-offer swipe presentation. Overscroll containment stops the inner
   rail's swipe from spilling into the outer offers rail mid-gesture. */
@media (max-width: 1024px) {
    .quorlyx-re-layout-carousel .quorlyx-re-products,
    .quorlyx-re-layout-carousel .quorlyx-re-bundle-items,
    .quorlyx-re-layout-carousel .quorlyx-re-fbt-items,
    .quorlyx-re-layout-carousel .quorlyx-re-group-items {
        overscroll-behavior-x: contain;
    }
}

/* Mobile media scale: product images render smaller than on desktop in every
   layout, by shrinking the tiles themselves so images shrink with them and
   each layout stays a proportionally smaller copy of its desktop structure
   (image keeps filling its tile — no empty side gaps). Fixed-thumb layouts
   shrink via the tile variable presets. An explicit custom pixel size set in
   the offer editor still wins (inline style). */
@media (max-width: 1024px) {
    .quorlyx-re-section,
    .quorlyx-re-offer,
    .quorlyx-re-offers-grid {
        --qre-tile: 64px;
    }

    .quorlyx-re-offer.quorlyx-re-size-xsmall { --qre-tile: 40px; }
    .quorlyx-re-offer.quorlyx-re-size-small  { --qre-tile: 50px; }
    .quorlyx-re-offer.quorlyx-re-size-large  { --qre-tile: 84px; }
    .quorlyx-re-offer.quorlyx-re-size-xlarge { --qre-tile: 104px; }

    /* Two-column tile layouts: columns cap at 140px and center, so tiles (and
       the images filling them) render clearly smaller than on desktop. */
    .quorlyx-re-offer.quorlyx-re-layout-grid .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-grid .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-square .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-square .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-tile_card .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-tile_card .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-showcase .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-showcase .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-collage .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-collage .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-banner .quorlyx-re-group-items {
        grid-template-columns: repeat(2, minmax(0, 140px)) !important;
        justify-content: center !important;
    }

    /* Carousel rail: smaller cards on phones — images fill them edge to edge
       and more cards fit the first screenful, mirroring the desktop rail. */
    .quorlyx-re-offer.quorlyx-re-layout-carousel .quorlyx-re-product,
    .quorlyx-re-offer.quorlyx-re-layout-carousel .quorlyx-re-bundle-item,
    .quorlyx-re-offer.quorlyx-re-layout-carousel .quorlyx-re-fbt-item {
        flex-basis: min(145px, 42vw) !important;
    }
}

@media (max-width: 380px) {
    /* Very narrow phones: a single centered tile column, still capped so the
       image never balloons to the full screen width. */
    .quorlyx-re-offer.quorlyx-re-layout-grid .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-grid .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-square .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-square .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-tile_card .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-tile_card .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-showcase .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-showcase .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-collage .quorlyx-re-products,
    .quorlyx-re-offer.quorlyx-re-layout-collage .quorlyx-re-group-items,
    .quorlyx-re-offer.quorlyx-re-layout-banner .quorlyx-re-group-items {
        grid-template-columns: minmax(0, 180px) !important;
        justify-content: center !important;
    }
}

/* Swipe affordance: every carousel rail shows a persistent slim scroll line —
   on phones and tablets too — so shoppers can tell more products/offers sit
   off-screen. The standard scrollbar-* properties are reset to auto because
   Chromium ignores ::-webkit-scrollbar styling when they are set, and mobile
   overlay scrollbars auto-hide. */
.quorlyx-re-layout-carousel .quorlyx-re-products,
.quorlyx-re-layout-carousel .quorlyx-re-bundle-items,
.quorlyx-re-layout-carousel .quorlyx-re-fbt-items,
.quorlyx-re-layout-carousel .quorlyx-re-group-items,
.quorlyx-re-offers-grid.quorlyx-re-mobile-carousel,
.quorlyx-re-section-offers.quorlyx-re-mobile-carousel {
    scrollbar-width: auto;
    scrollbar-color: auto;
}

.quorlyx-re-layout-carousel .quorlyx-re-products::-webkit-scrollbar,
.quorlyx-re-layout-carousel .quorlyx-re-bundle-items::-webkit-scrollbar,
.quorlyx-re-layout-carousel .quorlyx-re-fbt-items::-webkit-scrollbar,
.quorlyx-re-layout-carousel .quorlyx-re-group-items::-webkit-scrollbar,
.quorlyx-re-offers-grid.quorlyx-re-mobile-carousel::-webkit-scrollbar,
.quorlyx-re-section-offers.quorlyx-re-mobile-carousel::-webkit-scrollbar {
    height: 6px;
}

.quorlyx-re-layout-carousel .quorlyx-re-products::-webkit-scrollbar-track,
.quorlyx-re-layout-carousel .quorlyx-re-bundle-items::-webkit-scrollbar-track,
.quorlyx-re-layout-carousel .quorlyx-re-fbt-items::-webkit-scrollbar-track,
.quorlyx-re-layout-carousel .quorlyx-re-group-items::-webkit-scrollbar-track,
.quorlyx-re-offers-grid.quorlyx-re-mobile-carousel::-webkit-scrollbar-track,
.quorlyx-re-section-offers.quorlyx-re-mobile-carousel::-webkit-scrollbar-track {
    border-radius: 999px;
    background: var(--qre-muted-surface, #f1f5f9);
}

.quorlyx-re-layout-carousel .quorlyx-re-products::-webkit-scrollbar-thumb,
.quorlyx-re-layout-carousel .quorlyx-re-bundle-items::-webkit-scrollbar-thumb,
.quorlyx-re-layout-carousel .quorlyx-re-fbt-items::-webkit-scrollbar-thumb,
.quorlyx-re-layout-carousel .quorlyx-re-group-items::-webkit-scrollbar-thumb,
.quorlyx-re-offers-grid.quorlyx-re-mobile-carousel::-webkit-scrollbar-thumb,
.quorlyx-re-section-offers.quorlyx-re-mobile-carousel::-webkit-scrollbar-thumb {
    border-radius: 999px;
    background: color-mix(in srgb, var(--qre-muted, #61708a) 45%, #fff);
}