/*
 * VEIKY V114 — homepage mobile, based on the approved mobile mockup.
 * Loaded only by the homepage. The desktop and checkout/cart are unaffected.
 * Keep carousel hooks, links and real inventory content in their existing components.
 */
@media (max-width: 767px) {
    /* Compact controls over the campaign artwork, rather than large square buttons. */
    [data-hero-slider] .veiky-container.pointer-events-none.absolute {
        bottom: calc(10px + env(safe-area-inset-bottom, 0px));
        gap: 10px;
        padding-left: max(14px, env(safe-area-inset-left, 0px));
        padding-right: max(14px, env(safe-area-inset-right, 0px));
    }
    [data-hero-slider] [role="tablist"][aria-label="Selecionar banner"] {
        min-width: 0;
        gap: 3px;
        align-items: center;
    }
    [data-hero-slider] [data-hero-dot] {
        min-width: 26px;
        height: 40px;
        gap: 0;
        padding: 0 3px;
        justify-content: center;
    }
    [data-hero-slider] [data-hero-dot-line] {
        width: 19px;
        height: 2px;
        border-radius: 2px;
        background: rgba(255,255,255,.48);
        box-shadow: 0 1px 5px rgba(0,0,0,.55);
    }
    [data-hero-slider] [data-hero-dot][aria-selected="true"] [data-hero-dot-line] {
        width: 25px;
        background: #dab68f;
    }
    [data-hero-slider] [data-hero-dot-label] {
        display: none;
    }
    [data-hero-slider] :is([data-hero-prev], [data-hero-next], [data-hero-autoplay-toggle]) {
        display: inline-flex;
        width: 40px;
        height: 40px;
        min-width: 40px;
        min-height: 40px;
        border: 1px solid rgba(218,182,143,.55);
        border-radius: 9999px;
        background: rgba(12,11,10,.56);
        color: #fff;
        box-shadow: 0 2px 12px rgba(0,0,0,.2);
        backdrop-filter: blur(4px);
        -webkit-backdrop-filter: blur(4px);
    }
    [data-hero-slider] :is([data-hero-prev], [data-hero-next], [data-hero-autoplay-toggle]) svg {
        width: 16px;
        height: 16px;
    }
    [data-hero-slider] [data-hero-autoplay-toggle] {
        width: 36px;
        min-width: 36px;
        height: 36px;
        min-height: 36px;
        border-color: rgba(255,255,255,.26);
    }
    [data-hero-slider] [data-hero-autoplay-icon] {
        font-size: 10px;
        letter-spacing: -1px;
    }
    [data-hero-slider] [data-hero-prev]:focus-visible,
    [data-hero-slider] [data-hero-next]:focus-visible,
    [data-hero-slider] [data-hero-autoplay-toggle]:focus-visible {
        outline: 2px solid #dab68f;
        outline-offset: 2px;
    }
    [data-hero-slider] [data-hero-dot]:focus-visible {
        outline: 2px solid #dab68f;
        outline-offset: -2px;
    }

    /* One centered benefit, with a subtle glimpse of adjacent cards. */
    #home-benefits {
        overflow: hidden;
        border-bottom-width: 1px;
    }
    #home-benefits [data-home-benefits-track] {
        display: flex;
        gap: 12px;
        width: 100%;
        padding: 11px calc((100% - min(78vw, 350px)) / 2) 7px;
        scroll-padding-inline: calc((100% - min(78vw, 350px)) / 2);
        scroll-snap-type: x mandatory;
        scrollbar-width: none;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-x: contain;
    }
    #home-benefits [data-home-benefits-track]::-webkit-scrollbar { display: none; }
    #home-benefits [data-home-benefits-track] > :is(div, a) {
        display: flex;
        flex: 0 0 min(78vw, 350px);
        width: min(78vw, 350px);
        min-width: 0;
        height: 88px;
        min-height: 88px;
        border-radius: 12px;
        padding: 12px 14px;
        gap: 11px;
        scroll-snap-align: center;
        justify-content: center;
        box-shadow: 0 3px 16px rgba(0,0,0,.055);
    }
    #home-benefits [data-home-benefits-track] > :is(div, a) > span.inline-flex {
        width: 45px;
        height: 45px;
        flex: 0 0 45px;
        border-radius: 9999px;
    }
    #home-benefits [data-home-benefits-track] > :is(div, a) > span.inline-flex svg {
        width: 27px;
        height: 27px;
    }
    #home-benefits [data-home-benefits-track] > :is(div, a) p:first-child {
        font-size: 11px;
        letter-spacing: .13em;
    }
    #home-benefits [data-home-benefits-track] > :is(div, a) p:last-child {
        font-size: 11px;
        line-height: 1.45;
        margin-top: 3px;
    }
    #home-benefits [aria-label="Navegação dos benefícios"] {
        height: 30px;
        padding-bottom: 8px;
        gap: 1px;
    }
    #home-benefits [data-home-benefits-indicator] {
        width: 26px;
        height: 26px;
        padding: 0;
        display: inline-flex;
        align-items: center;
        justify-content: center;
    }
    #home-benefits [data-home-benefits-indicator] > span {
        position: static;
        display: block;
        width: 7px;
        height: 7px;
        border-radius: 9999px;
        background: rgba(165,151,137,.42);
        transform: none;
        overflow: hidden;
    }
    #home-benefits [data-home-benefits-indicator] [data-home-benefits-fill] {
        display: none;
        animation: none !important;
    }
    #home-benefits [data-home-benefits-indicator][aria-current="true"] > span {
        width: 8px;
        height: 8px;
        background: #b78a59;
    }
    html[data-store-theme='light'] #home-benefits [data-home-benefits-indicator][aria-current="true"] > span {
        background: #b78a59;
    }
    html[data-store-theme='light'] #home-benefits [data-home-benefits-track] > :is(div, a) {
        background: #fffefc;
        color: #27211c;
        border: 1px solid #e6ded5;
    }
    html[data-store-theme='light'] #home-benefits [data-home-benefits-track] > :is(div, a) > span.inline-flex {
        background: #f7f0e8;
        border-color: #ecddca;
        color: #8b6847;
    }
    html[data-store-theme='dark'] #home-benefits [data-home-benefits-track] > :is(div, a) {
        background: #171614;
        border: 1px solid rgba(218,182,143,.20);
    }
    html[data-store-theme='dark'] #home-benefits [data-home-benefits-track] > :is(div, a) > span.inline-flex {
        background: rgba(218,182,143,.08);
        border-color: rgba(218,182,143,.20);
        color: #dab68f;
    }

    /* Tighter passage from the benefits to the launch shelf. */
    #novidades > .veiky-wide-container {
        padding-top: 25px;
        padding-bottom: 30px;
    }
    #novidades > .veiky-wide-container > div:first-child {
        margin-bottom: 17px;
        gap: 10px;
        align-items: end;
    }
    #novidades h2 {
        font-size: clamp(1.85rem, 7.25vw, 2.55rem);
        line-height: .98;
        letter-spacing: -.05em;
    }
    #novidades .veiky-v114-view-all {
        white-space: nowrap;
        align-self: end;
        margin-bottom: 2px;
    }

    /* Compact customer support bubble; button and panel retain their JS hooks. */
    .veiky-assistance {
        top: auto;
        bottom: calc(17px + env(safe-area-inset-bottom, 0px));
        right: calc(13px + env(safe-area-inset-right, 0px));
        transform: none;
        z-index: 48;
    }
    .veiky-assistance-tab {
        min-width: 49px;
        min-height: 49px;
        width: 49px;
        height: 49px;
        padding: 0;
        border-radius: 50%;
        border: 1px solid #a88154;
        box-shadow: 0 5px 22px rgba(0,0,0,.23);
    }
    .veiky-assistance-tab-mobile {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        gap: 0;
        font-size: 0;
    }
    .veiky-assistance-tab-mobile svg { width: 22px; height: 22px; }
    .veiky-assistance-tab::after {
        content: '';
        position: absolute;
        top: 3px;
        right: 2px;
        width: 9px;
        height: 9px;
        border: 2px solid #181613;
        border-radius: 50%;
        background: #dab68f;
    }
    .veiky-assistance-panel {
        right: 0;
        bottom: calc(100% + 10px);
        top: auto;
        transform: none;
        width: min(345px, calc(100vw - 26px));
        max-height: min(480px, calc(100dvh - 110px));
    }
}
@media (max-width: 359px) {
    #novidades h2 { font-size: 1.74rem; }
    #novidades .veiky-v114-view-all { font-size: 9px; }
    #home-benefits [data-home-benefits-track] > :is(div, a) {
        padding-inline: 9px;
        gap: 8px;
    }
}
@media (prefers-reduced-motion: reduce) {
    #home-benefits [data-home-benefits-track] { scroll-behavior: auto; }
    [data-hero-slider] :is([data-hero-prev], [data-hero-next], [data-hero-autoplay-toggle]),
    .veiky-assistance-tab { transition: none; }
}