/*
| RR_PRODUCTS_TABLET_GRID_FIT_FINAL_V1
| Tablet product listing authority.
| Stops the third card from being cut by forcing a real 2-column grid and
| removes the side floating cart only on tablet product-listing screens.
*/
@media (min-width: 641px) and (max-width: 1100px) {
    html,
    body {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    html body:not(.admin) section.all-products-page,
    html body:not(.admin) main .all-products-page {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow-x: hidden !important;
        box-sizing: border-box !important;
    }

    html body:not(.admin) section.all-products-page *,
    html body:not(.admin) main .all-products-page * {
        box-sizing: border-box !important;
    }

    html body:not(.admin) section.all-products-page .all-products-shell,
    html body:not(.admin) main .all-products-page .all-products-shell {
        width: min(100%, calc(100vw - 28px)) !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow: visible !important;
    }

    html body:not(.admin) section.all-products-page .rr-products-filter-layout,
    html body:not(.admin) main .all-products-page .rr-products-filter-layout,
    html body:not(.admin) section.all-products-page .rr-products-listing-main,
    html body:not(.admin) main .all-products-page .rr-products-listing-main {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    html body:not(.admin) section.all-products-page .rr-products-filter-layout {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 12px !important;
    }

    html body:not(.admin) section.all-products-page button.rr-products-mobile-filter-toggle[data-rr-products-mobile-filter-toggle],
    html body:not(.admin) section.all-products-page button.rr-products-mobile-search-sort-toggle[data-rr-products-mobile-search-sort-toggle],
    html body:not(.admin) main .all-products-page button.rr-products-mobile-filter-toggle[data-rr-products-mobile-filter-toggle],
    html body:not(.admin) main .all-products-page button.rr-products-mobile-search-sort-toggle[data-rr-products-mobile-search-sort-toggle] {
        display: flex !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        height: 38px !important;
        min-height: 38px !important;
        margin: 0 !important;
        justify-content: center !important;
        align-items: center !important;
        flex: 0 0 auto !important;
    }

    html body:not(.admin) section.all-products-page #rrProductsFilterSidebar,
    html body:not(.admin) main .all-products-page #rrProductsFilterSidebar,
    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
    }

    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard.is-mobile-search-sort-open .all-products-filter-form,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard.is-mobile-search-sort-open .all-products-filter-form,
    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard form#allProductsDynamicFilter,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard form#allProductsDynamicFilter {
        display: flex !important;
        flex-direction: column !important;
        align-items: stretch !important;
        gap: 10px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard .all-products-field,
    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard .all-products-checkbox,
    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard .all-products-apply-wrap,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard .all-products-field,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard .all-products-checkbox,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard .all-products-apply-wrap {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        grid-column: auto !important;
        grid-row: auto !important;
    }

    html body:not(.admin) section.all-products-page.rr-products-filter-sidebar-v1 .rr-products-listing-main .all-products-grid,
    html body:not(.admin) section.all-products-page.rr-products-filter-sidebar-v1 .rr-products-listing-main .rr-central-products-grid,
    html body:not(.admin) section.all-products-page .all-products-grid.rr-central-products-grid,
    html body:not(.admin) main .all-products-page .all-products-grid.rr-central-products-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 16px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        overflow: visible !important;
        align-items: stretch !important;
    }

    html body:not(.admin) section.all-products-page .all-products-grid.rr-central-products-grid > .rr-central-product-card,
    html body:not(.admin) main .all-products-page .all-products-grid.rr-central-products-grid > .rr-central-product-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        justify-self: stretch !important;
        overflow: hidden !important;
    }

    html body:not(.admin) section.all-products-page .rr-central-product-media,
    html body:not(.admin) section.all-products-page .rr-central-product-image,
    html body:not(.admin) main .all-products-page .rr-central-product-media,
    html body:not(.admin) main .all-products-page .rr-central-product-image {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    html body:not(.admin):has(section.all-products-page) .rr-mobile-floating-cart,
    html body:not(.admin):has(main .all-products-page) .rr-mobile-floating-cart {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}

@media (min-width: 641px) and (max-width: 820px) {
    html body:not(.admin) section.all-products-page .all-products-shell,
    html body:not(.admin) main .all-products-page .all-products-shell {
        width: min(100%, calc(100vw - 20px)) !important;
    }

    html body:not(.admin) section.all-products-page.rr-products-filter-sidebar-v1 .rr-products-listing-main .all-products-grid,
    html body:not(.admin) section.all-products-page.rr-products-filter-sidebar-v1 .rr-products-listing-main .rr-central-products-grid,
    html body:not(.admin) section.all-products-page .all-products-grid.rr-central-products-grid,
    html body:not(.admin) main .all-products-page .all-products-grid.rr-central-products-grid {
        gap: 12px !important;
    }
}

/*
| RR_PRODUCTS_PORTRAIT_FILTERS_OPEN_FINAL_V1
| Portrait tablets / vertical monitors have enough height but limited horizontal
| confidence. Keep filters open instead of leaving an empty left-side button.
*/
@media (min-width: 900px) and (max-width: 1400px) and (orientation: portrait) {
    html body:not(.admin) section.all-products-page,
    html body:not(.admin) main .all-products-page {
        width: 100% !important;
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    html body:not(.admin) section.all-products-page .all-products-shell,
    html body:not(.admin) main .all-products-page .all-products-shell {
        width: min(100%, calc(100vw - 32px)) !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    html body:not(.admin) section.all-products-page .rr-products-filter-layout,
    html body:not(.admin) main .all-products-page .rr-products-filter-layout {
        display: grid !important;
        grid-template-columns: minmax(220px, 260px) minmax(0, 1fr) !important;
        gap: 22px !important;
        align-items: start !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.admin) section.all-products-page button.rr-products-mobile-filter-toggle[data-rr-products-mobile-filter-toggle],
    html body:not(.admin) main .all-products-page button.rr-products-mobile-filter-toggle[data-rr-products-mobile-filter-toggle] {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    html body:not(.admin) section.all-products-page #rrProductsFilterSidebar,
    html body:not(.admin) main .all-products-page #rrProductsFilterSidebar,
    html body:not(.admin) section.all-products-page .rr-products-filter-layout.is-mobile-filter-open #rrProductsFilterSidebar,
    html body:not(.admin) main .all-products-page .rr-products-filter-layout.is-mobile-filter-open #rrProductsFilterSidebar {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: sticky !important;
        top: 112px !important;
        width: 100% !important;
        min-width: 0 !important;
        max-width: 260px !important;
        margin: 0 !important;
        grid-column: 1 !important;
        grid-row: 1 / span 3 !important;
    }

    html body:not(.admin) section.all-products-page .rr-products-listing-main,
    html body:not(.admin) main .all-products-page .rr-products-listing-main {
        grid-column: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    html body:not(.admin) section.all-products-page .all-products-meta[data-rr-mobile-meta-compact="1"],
    html body:not(.admin) main .all-products-page .all-products-meta[data-rr-mobile-meta-compact="1"] {
        margin-top: 0 !important;
    }

    html body:not(.admin) section.all-products-page.rr-products-filter-sidebar-v1 .rr-products-listing-main .all-products-grid,
    html body:not(.admin) section.all-products-page.rr-products-filter-sidebar-v1 .rr-products-listing-main .rr-central-products-grid,
    html body:not(.admin) section.all-products-page .all-products-grid.rr-central-products-grid,
    html body:not(.admin) main .all-products-page .all-products-grid.rr-central-products-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.admin):has(section.all-products-page) .rr-mobile-floating-cart,
    html body:not(.admin):has(main .all-products-page) .rr-mobile-floating-cart {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}

/*
| RR_PRODUCTS_COMPACT_LANDSCAPE_GRID_FINAL_V1
| Fix Nest Hub Max / compact landscape tablet sizes such as 1280x800.
| Keep filters visible, stop 3-column clipping, and remove side cart overlap.
*/
@media (min-width: 1101px) and (max-width: 1400px) and (max-height: 900px) {
    html,
    body {
        max-width: 100% !important;
        overflow-x: hidden !important;
    }

    html body:not(.admin) section.all-products-page,
    html body:not(.admin) main .all-products-page {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        padding-left: 0 !important;
        padding-right: 0 !important;
        overflow-x: hidden !important;
    }

    html body:not(.admin) section.all-products-page .all-products-shell,
    html body:not(.admin) main .all-products-page .all-products-shell {
        width: min(100%, calc(100vw - 36px)) !important;
        max-width: 100% !important;
        margin-left: auto !important;
        margin-right: auto !important;
    }

    html body:not(.admin) section.all-products-page .rr-products-filter-layout,
    html body:not(.admin) main .all-products-page .rr-products-filter-layout {
        display: grid !important;
        grid-template-columns: minmax(230px, 280px) minmax(0, 1fr) !important;
        gap: 22px !important;
        align-items: start !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: visible !important;
    }

    html body:not(.admin) section.all-products-page button.rr-products-mobile-filter-toggle[data-rr-products-mobile-filter-toggle],
    html body:not(.admin) main .all-products-page button.rr-products-mobile-filter-toggle[data-rr-products-mobile-filter-toggle] {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }

    html body:not(.admin) section.all-products-page #rrProductsFilterSidebar,
    html body:not(.admin) main .all-products-page #rrProductsFilterSidebar {
        display: block !important;
        visibility: visible !important;
        opacity: 1 !important;
        position: sticky !important;
        top: 112px !important;
        width: 100% !important;
        max-width: 280px !important;
        min-width: 0 !important;
        margin: 0 !important;
        grid-column: 1 !important;
    }

    html body:not(.admin) section.all-products-page .rr-products-listing-main,
    html body:not(.admin) main .all-products-page .rr-products-listing-main {
        grid-column: 2 !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard form#allProductsDynamicFilter,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard form#allProductsDynamicFilter {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) minmax(145px, 170px) minmax(130px, 160px) !important;
        gap: 10px !important;
        align-items: stretch !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard .all-products-field,
    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard .all-products-checkbox,
    html body:not(.admin) section.all-products-page #allProductsMobileSearchSortCard .all-products-apply-wrap,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard .all-products-field,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard .all-products-checkbox,
    html body:not(.admin) main .all-products-page #allProductsMobileSearchSortCard .all-products-apply-wrap {
        min-width: 0 !important;
        max-width: 100% !important;
    }

    html body:not(.admin) section.all-products-page.rr-products-filter-sidebar-v1 .rr-products-listing-main .all-products-grid,
    html body:not(.admin) section.all-products-page.rr-products-filter-sidebar-v1 .rr-products-listing-main .rr-central-products-grid,
    html body:not(.admin) section.all-products-page .all-products-grid.rr-central-products-grid,
    html body:not(.admin) main .all-products-page .all-products-grid.rr-central-products-grid {
        display: grid !important;
        grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
        gap: 18px !important;
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        overflow: visible !important;
    }

    html body:not(.admin) section.all-products-page .all-products-grid.rr-central-products-grid > .rr-central-product-card,
    html body:not(.admin) main .all-products-page .all-products-grid.rr-central-products-grid > .rr-central-product-card {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        overflow: hidden !important;
    }

    html body:not(.admin):has(section.all-products-page) .rr-mobile-floating-cart,
    html body:not(.admin):has(main .all-products-page) .rr-mobile-floating-cart {
        display: none !important;
        visibility: hidden !important;
        opacity: 0 !important;
        pointer-events: none !important;
    }
}