/* Shared small-screen refinements, loaded after each page's feature styles. */
@media (max-width: 1100px) {
    .portal-body .portal-shell,
    .portal-body.portal-sidebar-hidden .portal-shell {
        grid-template-columns: minmax(0, 1fr);
    }

    .portal-body .portal-sidebar {
        position: fixed;
        inset: 0 auto 0 0;
        z-index: 30;
        width: min(20rem, calc(100vw - 3rem));
        height: 100vh;
        height: 100dvh;
        overflow-x: hidden;
        overflow-y: auto;
        overscroll-behavior: contain;
        transform: translateX(-105%);
    }

    .portal-body .portal-sidebar.open { transform: translateX(0); }
    .portal-body .menu-toggle { display: inline-flex; min-width: 2.75rem; min-height: 2.75rem; }
    .portal-body .portal-rail-toggle { display: none; }
    .portal-body .portal-sidebar-backdrop {
        position: fixed;
        inset: 0;
        z-index: 20;
        display: block;
        border: 0;
        background: rgba(37, 23, 41, .46);
        opacity: 0;
        visibility: hidden;
        pointer-events: none;
        transition: opacity .2s ease, visibility .2s ease;
    }
    .portal-body.portal-mobile-menu-open .portal-sidebar-backdrop {
        opacity: 1;
        visibility: visible;
        pointer-events: auto;
    }
    .portal-body.portal-mobile-menu-open { overflow: hidden; }
    .portal-body .portal-main,
    .portal-body .portal-content { min-width: 0; }
}

@media (max-width: 800px) {
    .home-body .main-nav {
        max-height: calc(100dvh - 5rem);
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .home-body .main-nav a { min-height: 2.75rem; display: flex; align-items: center; }

    .portal-body .portal-topbar,
    .portal-body:has(.dashboard-v2) .portal-topbar {
        min-height: 4.5rem;
        height: auto;
        gap: .55rem;
        padding: .7rem 1rem;
    }

    .portal-body .portal-page-context { min-width: 0; flex: 1 1 auto; }
    .portal-body .portal-topbar-tools { gap: .4rem; flex: 0 0 auto; }
    .portal-body .portal-topbar-date { display: none; }
    .portal-body .portal-content { padding: clamp(.75rem, 2.5vw, 1.25rem); }
    .portal-body .metrics,
    .portal-body .billing-metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .portal-body .table-wrap,
    .portal-body .dashboard-table-wrap {
        max-width: 100%;
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
        overscroll-behavior-inline: contain;
    }

    .public-body .customer-store-nav .navbar-collapse {
        max-height: calc(100dvh - 5.5rem);
        overflow-y: auto;
        overscroll-behavior: contain;
    }
    .public-body .customer-store-nav .navbar-nav {
        flex-direction: column;
        align-items: stretch;
        gap: .3rem !important;
    }
    .public-body .customer-store-nav .nav-item { width: 100%; }
    .public-body .customer-store-nav .nav-link,
    .public-body .customer-store-nav .nav-action {
        display: flex;
        width: 100%;
        min-height: 2.75rem;
        justify-content: flex-start;
        padding: .65rem .8rem !important;
        margin: 0;
    }
    .public-body .customer-store-nav .store-language { width: 100%; }
    .public-body .customer-store-nav .store-language button { flex: 1; min-height: 2.75rem; }
    .public-body .customer-store-nav .store-profile { margin: 0; }
    .public-body .customer-store-nav .store-profile-trigger { width: 100%; max-width: none; min-height: 2.75rem; }
}

@media (max-width: 640px) {
    .portal-body .portal-topbar { padding-inline: .75rem; }
    .portal-body .portal-page-context { max-width: none; }
    .portal-body .portal-page-context h1 { overflow-wrap: anywhere; }
    .portal-body .page-heading,
    .portal-body .panel-head { align-items: stretch; flex-direction: column; }
    .portal-body .page-heading .button,
    .portal-body .panel-head .button { min-height: 2.75rem; }
    .portal-body .filters > :is(input, select, .button) { min-width: 0; flex: 1 1 10rem; }
    .portal-body .form-grid { grid-template-columns: minmax(0, 1fr); }
    .portal-body .form-grid .field.full { grid-column: auto; }
    .portal-body .panel { min-width: 0; padding: 1rem; }
    .portal-body .metrics,
    .portal-body .billing-metrics { grid-template-columns: minmax(0, 1fr); }
    .portal-body :is(input, select, textarea) { max-width: 100%; font-size: max(16px, 1em); }
    .portal-body :is(.button, button, summary) { touch-action: manipulation; }

    .customer-dashboard-body .customer-hero,
    .customer-dashboard-body .customer-dashboard-grid:not(.has-rail) .customer-hero {
        grid-template-columns: minmax(0, 1fr);
    }
    .customer-dashboard-body .featured-grid { gap: .65rem; }
    .customer-dashboard-body .featured-content h3 { white-space: normal; }
    .customer-dashboard-body .featured-content button { min-height: 2.75rem; }
    .public-body :is(input, select, textarea) { max-width: 100%; font-size: max(16px, 1em); }
    .public-body .orders-sections { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .public-body .orders-section-card { min-width: 0; }
    .public-body .orders-section-card > span:nth-child(2) { min-width: 0; }

    .auth-body .auth-shell,
    .auth-body .auth-panel,
    .auth-body .auth-card { min-width: 0; max-width: 100%; }
    .auth-body .auth-form-grid { grid-template-columns: minmax(0, 1fr); }
    .auth-body input:not([type="checkbox"]),
    .auth-body select,
    .auth-body textarea { max-width: 100%; font-size: 16px; }
}

@media (max-width: 420px) {
    .home-body .hero-buttons .button { min-height: 2.75rem; }
    .home-body .product-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .portal-body .portal-topbar { gap: .35rem; padding-inline: .55rem; }
    .portal-body .portal-page-context { padding-inline: .75rem; }
    .portal-body .portal-topbar-tools { gap: .25rem; }
    .portal-body .portal-content { padding: .65rem; }
    .portal-body .panel { padding: .8rem; }
    .customer-dashboard-body .customer-hero-copy { padding: 1.1rem; }
    .customer-dashboard-body .customer-hero h1 { font-size: clamp(1.8rem, 8vw, 2.15rem); }
    .customer-dashboard-body .customer-hero-mark { display: none; }
    .customer-dashboard-body .featured-content { padding: .65rem; }
    .customer-dashboard-body .featured-image { height: 110px; }
    .public-body .orders-section-card { padding: .75rem; }
    .public-body .orders-section-icon { width: 2rem; height: 2rem; flex-basis: 2rem; }
    .auth-body .auth-panel { padding: .6rem; }
    .auth-body .auth-card { padding: 1rem; }
}

@media (max-width: 360px) {
    .customer-dashboard-body .featured-grid,
    .public-body .orders-sections,
    .home-body .product-grid { grid-template-columns: minmax(0, 1fr); }
}

@media (prefers-reduced-motion: reduce) {
    .portal-body .portal-sidebar,
    .portal-body .portal-sidebar-backdrop { transition: none; }
}
