/**
 * PageBuilder Product Grid - 5 Columns Responsive Styles
 * Supports displaying products in 5 columns per row
 */

/* Large desktop: 5 columns (≥992px) */
@media (min-width: 992px) {
    .module-line .row > .col-lg-2-4 {
        flex: 0 0 auto;
        width: 20%;
    }
}

/* Tablet landscape: 4 columns (768px - 991px) */
@media (max-width: 991px) and (min-width: 768px) {
    .module-line .row > .col-lg-2-4 {
        flex: 0 0 auto;
        width: 25%;
    }
}

/* Tablet portrait: 2 columns (577px - 767px) */
@media (max-width: 767px) and (min-width: 577px) {
    .module-line .row > .col-lg-2-4 {
        flex: 0 0 auto;
        width: 50%;
    }
}

/* Mobile: 2 columns (≤576px) - Override Bootstrap col-6 */
@media (max-width: 576px) {
    .module-line .row > .col-lg-2-4 {
        flex: 0 0 calc(50% - 5px) ;
        width: 50% ;
        max-width: 50% ;
    }
    
    /* .module-line .row {
        gap: 0.5rem !important;
        margin-left: -0.25rem !important;
        margin-right: -0.25rem !important;
    } */
    
    .module-line .row > .col-lg-2-4 {
        padding-left: 0.25rem ;
        padding-right: 0.25rem ;
    }
}
