@media only screen and (max-width: 1800px) { }
@media only screen and (max-width: 1680px) { 
    .table-scroll-lg-xxl { width: 100%; overflow-x: scroll; /*display: flex; flex-wrap: wrap;*/}
    .table-scroll-lg-xxl table { width: 1800px; }
}
@media only screen and (max-width: 1660px) {
 }
@media only screen and (max-width: 1540px) {
    .table-scroll-lg-xl { width: 100%; overflow-x: scroll; /*display: flex; flex-wrap: wrap;*/}
    .table-scroll-lg-xl table { width: 1666px; }
 }
@media only screen and (max-width: 1440px) { 

    .card-header .page-title { flex-wrap:wrap;}
    .card-header .page-title h1 { width:100%; margin-bottom:10px;}

}
@media only screen and (max-width: 1439px) { 
    .table-scroll-lg-l { width: 100%; overflow-x: scroll; /*display: flex; flex-wrap: wrap;*/}
    .table-scroll-lg-l table { width: 1440px; }

    .theme-btn-list li { width: calc(100% / 2);}

}
@media only screen and (max-width: 1366px) {  }
@media only screen and (max-width: 1365px) { 
    .table-scroll-lg { width: 100%; overflow-x: scroll; /*display: flex; flex-wrap: wrap;*/}
    .table-scroll-lg table { width: 1366px; }
}
@media only screen and (max-width: 1281px) { 
    .header { background-color: var(--white);}
}
@media only screen and (max-width: 1280px) { }
@media only screen and (max-width: 1279px) { 
    .table-scroll-md { width: 100%; overflow-x: scroll; /*display: flex; flex-wrap: wrap;*/}
    .table-scroll-md table { width: 1280px;}

    .productPage .rightCol { /*display: none;*/ max-width: 100%; margin-top: 20px;}
    .productPage .leftCol { width: 100%; margin-right:0px;}

    .cartPage { justify-content: center; gap: 30px;}
    .cartPage .rightCol { max-width: 520px; width: 100%;}
    .cartPage .leftCol { width: 100%; margin-right: 0px;}

    .orderStatus.cartPage .rightCol { max-width: 100%; width: 100%;}
    
}
@media only screen and (max-width: 1180px) { }
@media only screen and (max-width: 1170px) { }
@media only screen and (max-width: 1024px) { }
@media only screen and (max-width: 1023px) { 
    .table-scroll-sm { width: 100%; overflow-x: scroll; /*display: flex; flex-wrap: wrap;*/}
    .table-scroll-sm table { width: 1024px;}


    /*  Product View Change  */
    table.productGridView thead tr { display:none;}
    table.productGridView tbody { width:100%; display:flex; flex-wrap:wrap; gap:12px;}
    table.productGridView tbody tr { width: calc(50% - 9px); display:flex; flex-wrap: wrap; border: 1px solid var(--borderColor); border-radius:5px;}
    table.productGridView tbody tr td { width:100%; border:0 none; padding:20px 15px 5px 15px; position:relative;}
    table.productGridView tbody tr td::before { content:attr(data-label); display:block; margin-left: 5px; color: #bbb; }

    table.productGridView tbody tr td.imgTD { width:94px; padding:10px; display:flex; justify-content:center;}
    table.productGridView tbody tr td.imgTD:before { display:none;}

    table.productListTbl tr td.imgTD img { width:72px; height:72px; object-fit:cover;}
    table.productListTbl tr td.imgTD a { width:74px; height:74px;}

    table.productGridView tbody tr td.productNameTD { width:calc(100% - 94px); padding:5px 10px; line-height:normal; font-weight:500; min-height:54px;}
    table.productGridView tbody tr td.productNameTD:before { display:none;}

    table.productGridView tbody tr td.itemsTD,
    table.productGridView tbody tr td.packTD,
    table.productGridView tbody tr td.priceTD,
    table.productGridView tbody tr td.orderCountTD,
    table.productGridView tbody tr td.orderAvgTD,
    table.productGridView tbody tr td.maxQtyTD { width: 50%;}
    table.productGridView tbody tr td.stockTD { width: 50%;}
    table.productGridView tbody tr td.maxQtyTD { text-align:left !important;}

    table.productGridView tbody tr td.qtyTD { width:60%; padding:5px 5px 5px 15px;}
    table.productGridView tbody tr td.btnTD { width:40%; padding:9px 15px 5px 5px;}

    table td .proDtlInfo .proInfo { min-width:auto; width:50%; flex-wrap:wrap; gap:0; display:none;}
    table td .proDtlInfo .packInfo, table td .proDtlInfo .sizeInfo { display:flex;}
    table td .proDtlInfo .proInfo label {width: 100%; display:block; font-size: var(--Fonts-size-12); font-weight: 500; color:#bbb; text-transform:uppercase; }

    /**/

    .card-header .page-title .card-flex { flex-wrap:wrap;}
    .card-header .page-title .catogaryBox,
    .card-header .page-title .categoryBox { width:100%;}

}
@media only screen and (max-width: 991px)  { }
@media only screen and (max-width: 960px)  { }
@media only screen and (max-width: 959px)  {
    .table-scroll-xs { width: 100%; overflow-x: scroll; /*display: flex; flex-wrap: wrap;*/}
    .table-scroll-xs table { width: 960px;}
 }
@media only screen and (max-width: 840px)  { /*iPad*/ 
    .header .logoBox { left: 70px;}

}
@media only screen and (max-width: 830px)  { 

}
@media only screen and (max-width: 800px)  { 
    .header .headerRight .selectCustomer .btn { font-size: 12px;}
    .table-scroll-xxs { width: 100%; overflow-x: scroll;}
    .table-scroll-xxs table { width: 801px;}
}
@media only screen and (max-width: 768px)  { }
@media only screen and (max-width: 767px)  { 
    .table-scroll-xxxs { width: 100%; overflow-x: scroll; /*display: flex; flex-wrap: wrap;*/}
    .table-scroll-xxxs table { width: 768px;}

    .headerLogoBox { gap: 20px;}
    .header .logo { width: auto; padding: 18px 12px;}
    .header .headerRight { gap: 15px;}
    .header .headerRight .cartBox { padding: 0 10px 0 12px;}
    .header .headerRight .selectCustomer .btn { font-size: 10px;}
    .popupBox .popupBg.large { margin-left:-47%;}

    .header .headerRight .currentDue { display:none;}

    table.productGridView tbody tr { width: calc(50% - 9px);}

}
@media only screen and (max-height: 720px) {}
@media only screen and (max-width: 640px)  {}
@media only screen and (max-width: 639px)  { 

    .WarehouseMain .rightCol { width: 100%;}
    .WarehouseMain.sliderPage .leftCol { width: 100%;}

    .WarehouseMain.sliderPage .carousel,
    .WarehouseMain.sliderPage .carousel-inner,
    .WarehouseMain.sliderPage .carousel-item,
    .WarehouseMain.sliderPage .carousel-item img { height: 240px; }
    .WarehouseMain.loginPageNew.sliderPage .cntBox { margin-top: 0 !important; margin-bottom: 30px;}

    .cardHeader-640 { flex-direction:column; flex-wrap:wrap; flex-grow:1;}
    .cardHeader-640 .productSearch select { width:110px;}
    .cardHeader-640 .searchBox input { min-width:auto;}
    .cardHeader-640 .dateRangFilter { flex-direction: column;}

    .header.salesHeader .logo { display:none;}

}
@media only screen and (max-width: 480px)  { }
@media only screen and (max-width: 479px)  {
    .WarehouseMain .rightCol { padding:40px 20px;}

    .nav.nav-tabs li button { padding: 12px 18px;}
    
    table.productGridView tbody tr { width:100%;}
    table.productGridView tbody tr td.productNameTD  { min-height:auto;}
    table.productGridView tbody tr td.itemsTD,
    table.productGridView tbody tr td.packTD,
    table.productGridView tbody tr td.priceTD,
    table.productGridView tbody tr td.orderCountTD,
    table.productGridView tbody tr td.orderAvgTD,
    table.productGridView tbody tr td.maxQtyTD { width: 50%;}
    table.productGridView tbody tr td.stockTD { width: 50%;}
    
}
@media only screen and (max-width: 428px)  { }
@media only screen and (max-width: 427px)  { }
@media only screen and (max-width: 414px)  { }
@media only screen and (max-width: 410px)  { }
@media only screen and (max-width: 400px)  { }
@media only screen and (max-width: 360px)  { }
@media only screen and (max-width: 320px)  { }