/*
 * PPS Products Store v12.5 — PPS Sidebar layout fix.
 * Fixes the two-column/extra-row appearance caused by .clearfix pseudo-elements
 * becoming unintended CSS Grid items. Keeps the same compact three-card sidebar
 * presentation on the single-product page and all other PPS pages.
 */

/* .clearfix is useful for float layouts, but its generated cells must not enter
 * the sidebar product grids. */
.pps-container .pps-sidebar .pps-wd-products::before,
.pps-container .pps-sidebar .pps-wd-products::after,
.pps-container .pps-v11-lower-sidebar .pps-wd-products::before,
.pps-container .pps-v11-lower-sidebar .pps-wd-products::after,
.pps-container .pps-sidebar .pps-top-widget-catalog .pps-products-grid::before,
.pps-container .pps-sidebar .pps-top-widget-catalog .pps-products-grid::after,
.pps-container .pps-v11-lower-sidebar .pps-top-widget-catalog .pps-products-grid::before,
.pps-container .pps-v11-lower-sidebar .pps-top-widget-catalog .pps-products-grid::after{
    content:none !important;
    display:none !important;
}

/* Native sidebar product widgets: always three equal cards on desktop. */
@media (min-width: 992px){
    .pps-container .pps-sidebar .pps-wd-products,
    .pps-container .pps-v11-lower-sidebar .pps-wd-products,
    .pps-container .pps-sidebar .pps-top-widget-catalog .pps-products-grid,
    .pps-container .pps-v11-lower-sidebar .pps-top-widget-catalog .pps-products-grid{
        display:grid !important;
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        grid-auto-flow:row !important;
        align-items:start !important;
        column-gap:7px !important;
        row-gap:7px !important;
    }
}

/* Do not let the catalog renderer's generic .pps-row margins create a visual
 * offset inside the fixed-width sidebar. */
.pps-container .pps-sidebar .pps-top-widget-catalog .pps-products,
.pps-container .pps-v11-lower-sidebar .pps-top-widget-catalog .pps-products{
    margin-left:0 !important;
    margin-right:0 !important;
}

/* Top Phones View All belongs in the widget heading area, not underneath the
 * final product row. */
.pps-container .pps-sidebar .widget:has(.pps-top-widget-view-all),
.pps-container .pps-v11-lower-sidebar .widget:has(.pps-top-widget-view-all){
    position:relative !important;
}
.pps-container .pps-sidebar .pps-top-widget-catalog + .pps-top-widget-view-all,
.pps-container .pps-v11-lower-sidebar .pps-top-widget-catalog + .pps-top-widget-view-all{
    position:absolute !important;
    top:0 !important;
    right:0 !important;
    width:auto !important;
    margin:0 !important;
    padding:2px 0 0 8px !important;
    background:transparent !important;
    border:0 !important;
    box-shadow:none !important;
    color:#3f4d5c !important;
    font-size:10px !important;
    line-height:1.3 !important;
    font-weight:700 !important;
    text-decoration:none !important;
    z-index:8 !important;
}
.pps-container .pps-sidebar .pps-top-widget-catalog + .pps-top-widget-view-all:hover,
.pps-container .pps-v11-lower-sidebar .pps-top-widget-catalog + .pps-top-widget-view-all:hover{
    color:#1683f4 !important;
}

/* Keep product cards from being clipped when a title wraps to two lines. */
.pps-container .pps-sidebar .pps-wd-products > li,
.pps-container .pps-v11-lower-sidebar .pps-wd-products > li,
.pps-container .pps-sidebar .pps-top-widget-catalog .pps-products-grid > li,
.pps-container .pps-v11-lower-sidebar .pps-top-widget-catalog .pps-products-grid > li{
    overflow:visible !important;
}

@media (max-width: 991px){
    .pps-container .pps-sidebar .pps-wd-products,
    .pps-container .pps-v11-lower-sidebar .pps-wd-products,
    .pps-container .pps-sidebar .pps-top-widget-catalog .pps-products-grid,
    .pps-container .pps-v11-lower-sidebar .pps-top-widget-catalog .pps-products-grid{
        display:grid !important;
        grid-template-columns:repeat(3,minmax(0,1fr)) !important;
        grid-auto-flow:row !important;
    }
}

@media (max-width: 420px){
    .pps-container .pps-sidebar .pps-top-widget-catalog + .pps-top-widget-view-all,
    .pps-container .pps-v11-lower-sidebar .pps-top-widget-catalog + .pps-top-widget-view-all{
        font-size:9px !important;
    }
}
