/**
 * Hanfu mobile viewport / overflow guard (design_theme).
 * Stops right-edge bleed on real phones: 100vw + flex/min-width offenders,
 * off-canvas carousel slides, and dense product shelves.
 */

@media (max-width: 768px) {
    html {
        overflow-x: clip;
    }

    body {
        overflow-x: clip;
        max-width: 100%;
    }

    /* Mega below category chips: keep panel under the trigger row; shrink height
       instead of letting viewport clamp cover All/Shop All/Women labels. */
    body:has(.weline-header.hanfu-atelier-chrome) > .header-category-panel.is-megamenu:not(.is-drawer-flyout)[data-state="open"] {
        animation: none;
        max-block-size: min(70dvh, calc(100dvh - 11rem));
    }

    body:has(.weline-header.hanfu-atelier-chrome) > .header-category-panel.is-megamenu:not(.is-drawer-flyout) .mega-menu-layout {
        min-height: 0;
        max-height: min(66dvh, calc(100dvh - 12rem));
    }

    body :is(
        .weline-header,
        .hanfu-atelier-chrome,
        .hanfu-full-header,
        .header-belt,
        .header-belt-row-1,
        .header-main,
        .header-search-wrapper,
        .header-search-form,
        .header-main-nav,
        .header-main-nav-inner,
        .header-nav,
        .w-container,
        .homepage-section,
        [data-widget-code]
    ) {
        max-width: 100%;
        box-sizing: border-box;
        min-width: 0;
    }

    /* Search row must shrink inside the belt; submit stays, type+input share remainder. */
    body .weline-header.hanfu-atelier-chrome .header-search-form {
        width: 100%;
        max-width: 100%;
        display: flex;
        min-width: 0;
    }

    body .weline-header.hanfu-atelier-chrome .header-search-form .search-input-wrapper {
        flex: 1 1 auto;
        min-width: 0;
    }

    body .weline-header.hanfu-atelier-chrome .header-search-form .search-submit-btn {
        flex: 0 0 auto;
    }

    /* Nav chips: scroll inside chrome, do not expand document width. */
    body .weline-header :is(.header-main-nav-inner, .header-nav, .nav-list, .header-nav-links-slot, .header-nav-extensions) {
        max-width: 100%;
        min-width: 0;
    }

    body .weline-header .header-main-nav-inner,
    body .weline-header .header-nav {
        overflow-x: auto;
        overscroll-behavior-x: contain;
        -webkit-overflow-scrolling: touch;
    }

    /* Prefer % over 100vw (scrollbar / safe-area inflate). */
    body:has(.weline-header.hanfu-atelier-chrome) .search-type-menu[data-w-menu-panel] {
        inline-size: min(var(--size-content-640), calc(100% - 2 * var(--weline-space-4)));
        max-inline-size: calc(100% - 2 * var(--weline-space-4));
    }

    body:has(.weline-header.hanfu-atelier-chrome) > .header-category-panel.is-drawer-flyout.is-mega-panel-split {
        --w-floating-inline-size: calc(100% - 2 * var(--weline-space-4));
        inline-size: calc(100% - 2 * var(--weline-space-4));
        max-inline-size: calc(100% - 2 * var(--weline-space-4)) !important;
    }

    /* Hero / carousel: off-screen slides must not widen the document. */
    body :is(.hero-slider, .hero-slider__viewport, .slides-wrapper, .carousel-viewport, .swiper, .swiper-wrapper) {
        max-width: 100%;
        overflow-x: hidden;
    }
}

@media (max-width: 559px) {
    body :is(
        [data-widget-code="deals-of-day"] .products-grid.columns-3,
        [data-widget-code="deals-of-day"] .products-grid.columns-4,
        [data-widget-code="deals-of-day"] .products-grid.columns-5,
        [data-widget-code="deals-of-day"] .products-grid.columns-6,
        [data-widget-code="bestsellers"] .products-grid.columns-4,
        [data-widget-code="bestsellers"] .products-grid.columns-5,
        [data-widget-code="bestsellers"] .products-grid.columns-6,
        [data-widget-code="new-arrivals"] .products-grid.columns-4,
        [data-widget-code="new-arrivals"] .products-grid.columns-5,
        [data-widget-code="new-arrivals"] .products-grid.columns-6,
        [data-widget-code="up-sell"] .products-grid.columns-4,
        [data-widget-code="featured-products"] .products-grid.columns-4,
        [data-widget-code="featured-products"] .products-grid.columns-5,
        [data-widget-code="featured-products"] .products-grid.columns-6,
        .homepage-section .products-grid.columns-4,
        .homepage-section .products-grid.columns-5,
        .homepage-section .products-grid.columns-6,
        .homepage-section--featured-lead .products-grid.columns-4
    ) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: var(--weline-space-3);
        max-width: 100%;
        min-width: 0;
    }

    body :is(
        [data-widget-code="category-grid"] .category-grid.columns-4,
        [data-widget-code="category-grid"] .category-grid.columns-5,
        [data-widget-code="category-grid"] .category-grid.columns-6,
        [data-widget-code="category-grid"] .category-grid.columns-7,
        [data-widget-code="category-grid"] .category-grid.columns-8,
        [data-widget-code="brand-logos"] .brands-grid.columns-4,
        [data-widget-code="brand-logos"] .brands-grid.columns-5,
        [data-widget-code="brand-logos"] .brands-grid.columns-6,
        [data-widget-code="brand-logos"] .brands-grid.columns-8,
        [data-widget-code="footer-links"] .columns-4
    ) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
    }

    /* 信任徽章 3 卡：禁止 2 列造成 2+1 歪 L；单列铺满。 */
    body :is(
        [data-widget-code="trust-badges"] .badges-grid,
        [data-widget-code="trust-badges"] .badges-grid.columns-2,
        [data-widget-code="trust-badges"] .badges-grid.columns-3,
        [data-widget-code="trust-badges"] .badges-grid.columns-4
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: var(--weline-space-3);
    }
}

@media (max-width: 360px) {
    body :is(
        [data-widget-code="deals-of-day"] .products-grid.columns-2,
        [data-widget-code="deals-of-day"] .products-grid.columns-3,
        [data-widget-code="deals-of-day"] .products-grid.columns-4,
        .homepage-section .products-grid.columns-2,
        .homepage-section .products-grid.columns-3,
        .homepage-section .products-grid.columns-4
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
    }
}

/**
 * ui-13 mobile home (390) — SoT: masters/ui-13-mobile-home.png
 * Compact chrome · 2-col form tiles · list product rows · journal stack.
 * Token-only; no Amazon mega-search main voice.
 */
@media (max-width: 430px) {
    body.hanfu-atelier[data-layout="homepage"] .weline-page-wrapper,
    body.hanfu-atelier .homepage-layout,
    body.hanfu-atelier .theme-layout-homepage {
        background: var(--hanfu-sot-paper, var(--color-bg-canvas));
    }

    /* Hero: tall mist panel + stacked CTAs (Shop Now / Explore). */
    body.hanfu-atelier :is(
        .hanfu-default-hero[data-site-block="hero"],
        .homepage-section--hero,
        [data-widget-code="hero-slider"],
        .hero-slider
    ) {
        margin-inline: var(--weline-space-4);
        max-width: calc(100% - 2 * var(--weline-space-4));
        border: var(--hanfu-rule-width, 1px) solid var(--hanfu-sot-rule, var(--color-border-subtle));
        border-radius: var(--hanfu-round, 3px);
        overflow: hidden;
        min-block-size: min(28rem, 70vh);
    }

    body.hanfu-atelier :is(
        .hanfu-default-hero .slide-cta,
        .hanfu-default-hero .hero-actions,
        .homepage-section--hero .cta-row
    ) {
        display: flex;
        flex-direction: column;
        gap: var(--weline-space-2);
        width: 100%;
        max-width: 100%;
        padding-inline: var(--weline-space-4);
    }

    body.hanfu-atelier :is(
        .hanfu-default-hero .slide-cta a,
        .hanfu-default-hero .hero-actions a,
        .homepage-section--hero .cta-row a,
        .hanfu-default-hero .btn
    ) {
        width: 100%;
        justify-content: center;
        min-block-size: 2.75rem;
        border-radius: var(--hanfu-round, 3px);
    }

    /* Trust micro-row under hero: 3 equal cells. */
    body.hanfu-atelier :is(
        [data-widget-code="trust-badges"] .badges-grid.columns-3,
        .homepage-section--trust .badges-grid,
        .hanfu-home-trust-row
    ) {
        display: grid !important;
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        gap: 0 !important;
        margin-inline: var(--weline-space-4);
        max-width: calc(100% - 2 * var(--weline-space-4));
        border: var(--hanfu-rule-width, 1px) solid var(--hanfu-sot-rule, var(--color-border-subtle));
        border-radius: var(--hanfu-round, 3px);
        overflow: hidden;
        background: color-mix(in srgb, var(--color-bg-primary) 96%, transparent);
    }

    body.hanfu-atelier :is(
        [data-widget-code="trust-badges"] .badge-item,
        .homepage-section--trust .badge-item
    ) {
        padding: var(--weline-space-3) var(--weline-space-2);
        border-inline-end: var(--hanfu-rule-width, 1px) solid var(--hanfu-sot-rule, var(--color-border-subtle));
        text-align: center;
        font-size: 0.65rem;
        line-height: 1.4;
    }

    body.hanfu-atelier :is(
        [data-widget-code="trust-badges"] .badge-item:last-child,
        .homepage-section--trust .badge-item:last-child
    ) {
        border-inline-end: 0;
    }

    /* Explore by form: keep 2×N tiles (ui-13), not single column. */
    body.hanfu-atelier :is(
        [data-widget-code="category-grid"] .category-grid,
        .homepage-section--forms .category-grid,
        .homepage-section--explore .category-grid
    ) {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: var(--weline-space-3);
        margin-inline: var(--weline-space-4);
        max-width: calc(100% - 2 * var(--weline-space-4));
    }

    /* Collection highlights: prefer horizontal product rows when present. */
    body.hanfu-atelier :is(
        .homepage-section--featured-lead .products-grid,
        .homepage-section--highlights .products-grid,
        [data-widget-code="featured-products"] .products-grid,
        [data-widget-code="new-arrivals"] .products-grid
    ) {
        grid-template-columns: minmax(0, 1fr) !important;
        gap: var(--weline-space-3);
        margin-inline: var(--weline-space-4);
        max-width: calc(100% - 2 * var(--weline-space-4));
    }

    body.hanfu-atelier :is(
        .homepage-section--featured-lead .product-card,
        .homepage-section--highlights .product-card,
        [data-widget-code="featured-products"] .product-card,
        [data-widget-code="new-arrivals"] .product-card
    ) {
        display: grid;
        grid-template-columns: 6.875rem minmax(0, 1fr);
        gap: var(--weline-space-3);
        align-items: stretch;
        padding: var(--weline-space-3);
        border: var(--hanfu-rule-width, 1px) solid var(--hanfu-sot-rule, var(--color-border-subtle));
        border-radius: var(--hanfu-round, 3px);
        background: color-mix(in srgb, var(--color-bg-primary) 98%, transparent);
    }

    body.hanfu-atelier :is(
        .homepage-section--featured-lead .product-image,
        .homepage-section--highlights .product-image,
        [data-widget-code="featured-products"] .product-image,
        [data-widget-code="new-arrivals"] .product-image
    ) {
        width: 6.875rem;
        min-height: 8rem;
        margin: 0;
    }

    /* Section titles: cinnabar caps with hairline rules. */
    body.hanfu-atelier .homepage-section :is(.section-title, .homepage-section__title, h2.section-heading) {
        display: flex;
        align-items: center;
        gap: var(--weline-space-3);
        justify-content: center;
        margin-inline: var(--weline-space-4);
        color: var(--hanfu-sot-cinnabar, var(--color-primary));
        font-family: var(--weline-font-ui);
        font-size: 0.7rem;
        letter-spacing: 0.16em;
        text-transform: uppercase;
        font-weight: var(--font-weight-medium);
    }

    body.hanfu-atelier .homepage-section :is(.section-title, .homepage-section__title, h2.section-heading)::before,
    body.hanfu-atelier .homepage-section :is(.section-title, .homepage-section__title, h2.section-heading)::after {
        content: "";
        flex: 1 1 auto;
        height: 1px;
        background: var(--hanfu-sot-rule, var(--color-border-subtle));
    }

    /* Locale/currency chips must remain visible (SPEC hard nail). */
    body.hanfu-atelier .weline-header :is(
        .header-top-bar-locale,
        .language-switcher,
        .currency-switcher,
        .header-site-notice-links
    ) {
        display: flex !important;
        visibility: visible !important;
        max-width: 100%;
        min-width: 0;
    }
}
