/* Sidebar headings fill their cards at every viewport size. */
.sidebar .sidebar-toggle {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px;
    width: 100%;
    box-sizing: border-box;
    border: 0;
}

/*RESPONSIVE*/
@media screen and (max-width: 1170px){
    .wp-inner{ width: 100%; padding-left: 10px; padding-right: 10px;}
}

@media screen and (max-width: 1024px){
    /*HEADER*/
    #head-body #search-wp{ padding: 22px 0px 22px 90px;}
    #advisory-wp{ padding: 15px 10px 15px 50px;}
    #cart-wp{ margin-left: 10px;}
    #btn-respon{ display: block; margin-left: 35px; font-size: 21px; padding: 27px 0px; color: #fff; cursor: pointer;}
    #site{ position: relative; overflow: hidden;}
    #container{ position: relative; right: 0px; transition: all .5s ease; -moz-transition: all .5s ease; -webkit-transition: all .5s ease; -o-transition: all .5s ease;}
    #menu-respon{  display: block; position: absolute; top: 0; right: -250px; width: 250px; height: 100%; background: #ddd; transition: all .5s ease; -moz-transition: all .5s ease; -webkit-transition: all .5s ease; -o-transition: all .5s ease;}
    #site.show-respon-menu #container{ right: 250px;}
    #site.show-respon-menu #menu-respon{ right: 0;}
    #main-menu-respon .sub-menu{ display: none;}
    #menu-respon .logo{ display: block; padding: 10px 0px; color: #07ADC6; text-align: center; text-transform: uppercase; font-family: 'Roboto Medium'; font-size: 24px; background: #F4FCFF;}
    #menu-respon .logo img{ display: inline-block;}
    #main-menu-respon li{ position: relative;}
    #main-menu-respon li a{ display: block; padding: 12px 15px; color: #000; line-height: normal; text-transform: uppercase;}
    #main-menu-respon > li > a{ border-top: 1px solid #fff; border-bottom: 1px solid #979797;}
    #main-menu-respon li .sub-menu li a{border-top: 1px solid #fff; border-bottom: 1px solid #979797; padding-left: 30px;}
    #main-menu-respon li .sub-menu li .sub-menu li a{ padding-left: 45px;}
    #main-menu-respon li .sub-menu li .sub-menu li .sub-menu li a{ padding-left: 60px;}
    #main-menu-respon > li:last-child > a, #main-menu-respon li:last-child .sub-menu > li:last-child > a{ border-bottom: none;}
    #main-menu-respon > li:hover > a, #main-menu-respon .sub-menu li a:hover{ background-color: #cacaca;}
    #main-menu-respon li .arrow{ position: absolute; top: 0px; right: 0px; padding: 14px 16px; cursor: pointer;}
    #main-menu-respon > li.open > .arrow, #main-menu-respon .sub-menu > li.open > .arrow{ transform: rotate(90deg); -moz-transform: rotate(90deg); -webkit-transform: rotate(90deg); -o-transform: rotate(90deg); -ms-transform: rotate(90deg);}
    #main-menu-respon li.open > .sub-menu{ display: block;}
    #cart-wp{ display: none;}
    #cart-respon-wp{ display: block;}
    /*MAIN CONTENT*/
    .sidebar{ display: none;}
    .main-content{ width: 100%; float: none; margin-left: 0;}
    /*DETAIL PRODUCT*/
    .thumb-wp{ display: none;}
    .thumb-respon-wp{ display: block;}
    /*FOOTER*/

    /*CHECK OUT*/
    #to-checkout-wp .shop-table tbody tr td{ white-space: nowrap;}
}

@media screen and (max-width: 800px){
    /*HEADER*/
    #head-body #search-wp{ padding: 22px 0px 22px 50px;}
    #head-body #search-wp #s{ width: 325px; padding: 8px 15px;}
    #head-body #search-wp ul#seach{width: 325px;}
    #head-body #search-wp #sm-s{ padding: 10px 15px;}
    #advisory-wp{ display: none;}
    #head-body #logo{ padding: 25px 0px; font-size: 28px;}
    #head-body #search-wp{ padding: 20px 0px 20px 50px;}
    #head-body #search-wp #s{ line-height: 18px;}
    #head-body #search-wp #sm-s{ line-height: 14px;}
    #cart-wp i{ font-size: 18px;}
    /*MAIN CONTENT*/
    #list-product-wp .section-detail .list-item li{ width: 32.666666666666664%; margin-right: 1%;}
    #list-product-wp .section-detail .list-item li:nth-child(4n){ margin-right: 1%!important;}
    #list-product-wp .section-detail .list-item li:nth-child(3n){ margin-right: 0}
    /*DETAIL PRODUCT*/
    #detail-product-wp .info{ padding-left: 25px;}
    #detail-product-wp .info .product-name{ line-height: normal;}
    /*FOOTER*/
    #footer-wp #foot-body .block{ width: 50%; height: 200px;}
    .policy{ padding-left: 0!important;}
    /*CART*/
    .table-responsive{ width: 100%; margin-bottom: 15px; overflow-y: hidden; -ms-overflow-style: -ms-autohiding-scrollbar; border: 1px solid #ddd;}
    .table-responsive>.table>thead>tr>th, .table-responsive>.table>tbody>tr>th, .table-responsive>.table>tfoot>tr>th, .table-responsive>.table>thead>tr>td, .table-responsive>.table>tbody>tr>td, .table-responsive>.table>tfoot>tr>td{ white-space: nowrap; display: table-cell; vertical-align: middle;}
    .cart-page #cart-wp table thead tr td{ font-size: 13px;}
    .cart-page #to-checkout-wp table{ margin: 15px 0px;}
    .cart-page #cart-wp table tfoot tr td #actions-cart a{ font-size: 12px; padding: 0px 15px;}
    .cart-page #to-checkout{ width: 50%; padding: 30px 15px;}
    /*CHECK OUT*/
    #customer-info-wp .form-row{ padding-bottom: 15px;}
    .checkout-page #main-content .section:nth-child(2){ padding-left: 20px;}
    #customer-info-wp .form-row .form-col{ padding-right: 10px;}
}

@media screen and (max-width: 600px){
    /*HEADER*/
    #search-wp{ display: none;}
    /*MAIN CONTENT*/
    #list-product-wp .section-detail .list-item li{ width: 49%; margin-right: 2%; margin-bottom: 2%;}
    #list-product-wp .section-detail .list-item li:nth-child(3n){ margin-right: 2%;}
    #list-product-wp .section-detail .list-item li:nth-child(4n){ margin-right: 2%;}
    #list-product-wp .section-detail .list-item li:nth-child(2n){ margin-right: 0!important;}
    /*DETAIL PRODUCT*/
    #detail-product-wp .add-cart{ font-size: 14px;}
    /*DETAIL BLOG*/
    #detail-blog-wp .section-title{ font-size: 21px;}
    /*FOOTER*/
    .menu-ft .title, #newfeed .title, #info-company .title{ margin-bottom: 15px;}
    #footer-wp #foot-body .block{ width: 100%; height: auto!important; padding-left: 0!important; margin-bottom: 35px;}
    /*DETAIL PRODUCT*/
    #same-category-wp .section-title:before, #same-category-wp .section-title:after{ display: none;}
    /*CART & CHECK OUT*/
    .cart-page .inf-cart-wp table tfoot tr td.actions{ padding: 15px 0px;}
    .table-responsive .table thead tr td, .table-responsive .table tfoot tr td{ padding: 15px 25px;}
    .cart-page #to-checkout{ width: 50%;}
    .cart-page .cart-wp table tbody tr td{ padding: 10px 0px;}
    #customer-info-wp .form-row{ padding-bottom: 20px;}
    #customer-info-wp .form-row:last-child{ padding-bottom: 0!important;}
    .checkout-page #main-content .section:nth-child(2){ padding-left: 0px; margin-top: 20px;}
    .checkout-page .section{ width: 100%!important;}
    #customer-info-wp{ margin-right: 0!important; padding-bottom: 50px;}
    #order-review-wp{ margin-left: 0!important;}
    /*DETAIL NEWS*/
    #list-news-wp .thumb{ width: 40%;}
    #list-news-wp .info{ width: 60%;}
    #list-news-wp .info .title{ font-size: 21px; line-height: 26px;}
    #list-news-wp .info .desc{ line-height: 24px;}
}

@media screen and (max-width: 414px){
    /*HEADER*/
    #main-menu-wp{ display: none;}
    /*MAIN CONTENT*/
    .home-page#main-content-wp{ padding-top: 0;}
    #slider-wp{ display: none;}
    #support-wp .section-detail .list-item li{ width: 100%; margin-bottom: 25px;}
    #support-wp .section-detail .list-item li:before{ display: none; }
    .home-page #main-content-wp{ padding-top: 0;}
    #main-content-wp{ padding-bottom: 50px;}
    #feature-product-wp .list-item li .action a, #list-product-wp .list-item li .action a, #same-category-wp .list-item li .action a{ padding: 2px 5px;}
    #feature-product-wp .list-item li .price, #list-product-wp .list-item li .price, #same-category-wp .list-item li .price{ font-size: 12px!important;}
    #feature-product-wp .list-item li .product-name, #list-product-wp .list-item li .product-name, #same-category-wp .list-item li .product-name{
        display: -webkit-box;
        -webkit-line-clamp: 1;
        -moz-line-clamp: 1;
        -o-line-clamp: 1;
        -webkit-box-orient: vertical;
        -moz-box-orient: vertical;
        -o-box-orient: vertical;
        max-height: 100%;
        overflow: hidden;
    }
    /*DETAIL PRODUCT*/
    .thumb-respon-wp{ width: 100%!important; margin-bottom: 15px;}
    #detail-product-wp .info{ padding-left: 0!important; width: 100%;}
    #detail-product-wp .info .num-product{ margin-bottom: 20px;}
    #detail-product-wp .info .price{ margin-bottom: 25px;}
    #detail-product-wp .add-cart{ padding: 10px 25px;}
    /*BLOG*/
    #list-blog-wp .info .title{ font-size: 16px; line-height: 24px; font-family: 'Roboto Medium';}
    #list-blog-wp .info .desc{ line-height: 21px;}
    #list-blog-wp .info{ padding-left: 15px;}
    /*DETAIL BLOG*/
    #detail-blog-wp .section-title{ font-size: 18px; line-height: 24px;}
    /*CHECKOUT*/
    #customer-info-wp .form-row .form-col input[type="text"], #customer-info-wp .form-row .form-col input[type="email"], #customer-info-wp .form-row .form-col input[type="tel"], #customer-info-wp .form-row:nth-child(3) .form-col textarea{ padding: 5px 10px;}
    #customer-info-wp .form-row{ padding-bottom: 15px;}
    /*FOOTER*/
    #footer-wp #foot-body{ padding: 30px 0px;}
    .menu-ft .title, #newfeed .title, #info-company .title{ font-size: 21px;}
}

@media screen and (max-width: 375px){
    /*HOME*/
    #list-product-wp .section-detail .list-item li{ width: 100%; margin-right: 0!important; margin-bottom: 4%;}
    #list-product-wp .section-detail .list-item li:last-child{ margin-bottom: 0!important;}
    #feature-product-wp .list-item li .action a, #list-product-wp .list-item li .action a, #same-category-wp .list-item li .action a{ padding: 5px 20px;}
    /*CATEGORY PRODUCT*/
    .filter-wp form select{ padding: 5px;}
    .filter-wp form button{ padding: 3px 10px;}
    /*FOOTER*/

    /*DETAIL PRODUCT*/
    #menu-price-fixed{ height: 115px;}
    #menu-price-fixed .info-product{ width: 100%; margin-bottom: 15px;}
    #menu-price-fixed .info-product .detail, #menu-price-fixed .function-button{ float: left!important;}
    #menu-price-fixed .function-button a{ font-size: 14px; padding: 10px 15px;}
    #tab-menu li a{ font-size: 13px; padding: 15px;}
    #detail-product-wp{ padding-top: 15px;}
    .detail-product-page #add-to-cart, .detail-product-page #buy-now{ font-size: 13px; padding: 13px 23px;}
    /*CART & CHECKOUT*/
    .place-order-wp input[type="submit"]{ padding: 15px 30px;}
}
/* Client mobile experience: these overrides intentionally apply below desktop widths only. */
@media screen and (max-width: 991px) {
    html, body { overflow-x: hidden; }
    .wp-inner { width: 100%; max-width: 1170px; padding-left: 16px; padding-right: 16px; }
    #main-content-wp { padding: 20px 0 44px; }
    #main-content-wp .section { margin-bottom: 18px !important; }
    #main-content-wp .section-detail { padding: 14px; }

    /* Keep all header actions available without the incomplete legacy drawer. */
    #head-top .wp-inner { display: block; padding: 0; }
    #head-top #payment-link { display: none; }
    #main-menu-wp, #head-top #main-menu { display: block !important; float: none !important; }
    #head-top #main-menu { display: flex !important; overflow-x: auto; -webkit-overflow-scrolling: touch; scrollbar-width: none; }
    #head-top #main-menu::-webkit-scrollbar { display: none; }
    #head-top #main-menu li { flex: 0 0 auto; float: none; }
    #head-top #main-menu li a { padding: 9px 13px; font-size: 13px; white-space: nowrap; }
    #head-top #main-menu li:last-child a { padding-right: 13px !important; }

    #head-body .wp-inner { display: flex !important; flex-wrap: wrap; min-height: 0; padding-top: 10px; padding-bottom: 12px; }
    #head-body #logo { order: 1; flex: 1 1 auto; min-width: 0; padding: 0; float: none !important; }
    #head-body #logo img { width: 40px !important; height: 40px !important; margin: 0 8px 0 0 !important; }
    #head-body #logo h2 { margin: 0 !important; font-size: 20px !important; white-space: nowrap; }
    #action-wp { order: 2; flex: 0 0 auto; float: none !important; align-items: center; }
    #auth-wp { padding: 0 10px !important; margin: 0 !important; white-space: nowrap; }
    #auth-wp .dropdown-toggle { max-width: 135px; overflow: hidden; text-overflow: ellipsis; }
    #btn-respon, #cart-respon-wp { display: none !important; }
    #cart-wp { display: block !important; margin: 0; padding: 3px 0 3px 10px; float: none !important; }
    #cart-wp #num { top: -7px; right: -8px; font-size: 12px; }
    #head-body #search-wp, #search-wp { order: 3; display: block !important; flex: 0 0 100%; width: 100%; padding: 12px 0 0 !important; float: none !important; }
    #search-wp form { width: 100%; height: 40px; }
    #head-body #search-wp #s { width: auto; min-width: 0; padding: 0 12px; }
    #head-body #search-wp #sm-s { left: 0; padding: 0 16px; line-height: 1; }
    #head-body #search-wp ul#seach { width: 100%; }

    #main-content-wp > .wp-inner, .checkout-page #wrapper { width: 100%; }
    .main-content, .sidebar { float: none !important; width: 100% !important; margin-left: 0 !important; }
    .sidebar { display: block; margin-top: 18px; }
    .sidebar #banner-wp { display: none; }
    #category-product-wp .list-item li .sub-menu { position: static; display: block; width: auto; border: 0; padding-left: 12px; }

    #list-product-wp .section-detail .list-item { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
    ul.flex-product li, #list-product-wp .section-detail .list-item li, #feature-product-wp .section-detail .list-item li, #same-category-wp .section-detail .list-item li { float: none !important; width: auto !important; min-width: 0; margin: 0 !important; padding: 0 !important; }
    .premium-product-card { border-radius: 8px; }
    .premium-product-card .info-wrap { padding: 12px; }
    .premium-product-card .product-name { font-size: 14px; min-height: 40px; }
    .premium-product-card .product-des { display: none; }
    .premium-product-card .price-new { font-size: 15px; }
    .premium-product-card .price-old { font-size: 12px; }
    .premium-product-card .btn-add-cart { padding: 9px 6px; font-size: 11px; }
    .premium-product-card .discount-badge { top: 8px; right: 8px; padding: 3px 7px; font-size: 11px; }

    #slider-wp .item img, .home-page #slider-wp .item img { height: 300px !important; }
    #support-wp .section-detail .list-item { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 18px 8px; }
    #support-wp .section-detail .list-item li { float: none; width: auto; margin: 0; }
    #support-wp .section-detail .list-item li:before { display: none; }
    #support-wp .section-detail .list-item li .title { font-size: 14px; }

    .premium-toolbar, .filter-wp form { align-items: stretch; }
    .premium-toolbar { gap: 12px; }
    .filter-wp .desc { text-align: left; }
    .filter-wp form select, .filter-wp form button { min-height: 40px; }

    .product-detail-container { padding: 18px !important; }
    .product-image-gallery { margin-bottom: 20px; }
    .product-title { font-size: 26px !important; line-height: 1.25 !important; }
    .product-pricing { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
    .price-current { font-size: 25px !important; }
    .product-actions, .product-actions form { width: 100%; }
    .btn-add-to-cart { width: 100%; min-height: 46px; }
    .content-detail, .content-detail img { max-width: 100% !important; height: auto !important; }

    .table-responsive, .cart-page .section-detail, #order-review-wp .section-detail { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .cart-page table, #order-review-wp .shop-table { min-width: 620px; }
    .cart-page #to-checkout { width: 100%; max-width: 360px; padding: 22px 16px; }
    .checkout-page #wrapper { display: block; padding-left: 16px; padding-right: 16px; }
    #customer-info-wp, #order-review-wp { width: 100% !important; margin: 0 0 18px !important; padding: 0 !important; }
    #customer-info-wp .form-row { margin-left: 0; margin-right: 0; }
    #customer-info-wp .form-col { padding-left: 0; padding-right: 0; }
    #payment_methods label { min-width: 0; line-height: 1.35; }
    .place-order-wp input[type="submit"] { width: 100%; min-height: 48px; }

    #my-orders-wp .card-header, #my-orders-wp .card-body > .d-flex, #my-orders-wp .product-list + .d-flex { gap: 12px; }
    #my-orders-wp .product-price { width: auto !important; min-width: 90px; }
    .orders-list .order-item { border-radius: 8px !important; }

    .page-hero { min-height: 230px !important; padding: 36px 22px !important; }

    .about-text, .about-image { width: auto !important; }
    .premium-blog-list { gap: 16px !important; }
    .premium-blog-card { grid-template-columns: 190px minmax(0, 1fr) !important; }

    .auth-container { width: min(100%, 460px) !important; margin: 34px auto !important; padding: 28px 22px !important; }
    .success-wrapper { padding: 24px 16px !important; }
    .success-card { width: 100% !important; }
    .order-info-grid { gap: 12px !important; }
}

@media screen and (max-width: 640px) {
    .wp-inner { padding-left: 12px; padding-right: 12px; }
    #main-content-wp { padding-top: 14px; }
    #head-top #main-menu li a { padding: 8px 11px; font-size: 12px; }
    #auth-wp { padding-left: 6px !important; padding-right: 6px !important; }
    #auth-wp .mx-2 { margin-left: 5px !important; margin-right: 5px !important; }
    #auth-wp .dropdown-toggle { max-width: 96px; }
    #head-body #logo h2 { font-size: 18px !important; }

    ul.flex-product, #list-product-wp .section-detail .list-item { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    .section-detail { padding: 12px !important; }
    .premium-product-card .info-wrap { padding: 10px; }
    .premium-product-card .unit { margin-left: 0; }
    #slider-wp .item img, .home-page #slider-wp .item img { height: 210px !important; }
    #support-wp .section-detail .list-item { grid-template-columns: repeat(2, minmax(0, 1fr)); }

    .premium-toolbar, .filter-wp form { display: flex; flex-direction: column; }
    .premium-toolbar .section-head, .filter-wp, .filter-wp form, .filter-wp form select, .filter-wp form button { width: 100%; }
    .filter-wp form button { left: 0; }
    #breadcrumb-wp { overflow-x: auto; white-space: nowrap; }

    .product-detail-container { padding: 14px !important; }
    .product-title { font-size: 22px !important; }
    .product-short-desc { font-size: 14px; }
    .section-premium { padding: 16px !important; }

    #my-orders-wp .card-header, #my-orders-wp .card-body > .d-flex, #my-orders-wp li.d-flex { flex-direction: column; align-items: flex-start !important; }
    #my-orders-wp .order-status, #my-orders-wp .product-price, #my-orders-wp .total-price { text-align: left !important; }
    #my-orders-wp .product-price { min-width: 0; }
    #my-orders-wp .btn { margin: 8px 0 0 !important; }


    .page-hero { min-height: 190px !important; padding: 28px 18px !important; }
    .page-hero h1 { font-size: 28px !important; }
    .premium-blog-card { display: block !important; }
    .premium-blog-card .thumb { display: block; margin-bottom: 14px; }
    .premium-blog-card .info { padding-left: 0 !important; }

    .order-info-grid { grid-template-columns: 1fr !important; }
    .order-info-grid .info-item, .order-info-grid .info-item[style*="grid-column"] { grid-column: auto !important; }
    .order-info-grid .info-item[style*="display: flex"] { display: block !important; }
    .order-info-grid .info-item[style*="display: flex"] .info-value { margin-top: 8px; }
    .product-item { align-items: flex-start !important; gap: 10px; }
    .product-item img { width: 54px !important; height: 54px !important; }
    .product-item .product-price { min-width: 76px; text-align: right; }
    .action-buttons { display: grid !important; grid-template-columns: 1fr; gap: 10px; }
    .action-buttons .btn-custom { width: 100%; }

    #footer-wp { padding-top: 30px !important; }
    #foot-body .wp-inner { display: grid !important; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 24px 16px; }
    #foot-body .block, #info-company, .menu-ft, #newfeed { width: auto !important; padding: 0 !important; margin: 0 !important; }
    #info-company { grid-column: 1 / -1; }
    #foot-body .title { font-size: 15px !important; margin-bottom: 14px !important; }
    #foot-body .desc, #foot-body p, #foot-body a { font-size: 13px !important; }
    #form-reg form { height: 42px; }
    #foot-bot { margin-top: 30px !important; padding: 14px 0 !important; }
}

@media screen and (max-width: 390px) {
    #head-body #logo img { width: 34px !important; height: 34px !important; }
    #head-body #logo h2 { font-size: 16px !important; }
    #auth-wp a { font-size: 12px !important; }
    #cart-wp i { width: 32px; height: 32px; line-height: 28px; font-size: 16px; }
    .premium-product-card .product-name { font-size: 13px; }
    .premium-product-card .btn-add-cart { font-size: 10px; }
    #slider-wp .item img, .home-page #slider-wp .item img { height: 180px !important; }
    #foot-body .wp-inner { grid-template-columns: 1fr; }
    #info-company { grid-column: auto; }
}

@media screen and (max-width: 640px) {


    .about-section { padding: 22px 16px !important; margin-bottom: 20px !important; }
    .about-section h3 { font-size: 20px !important; }
    .premium-blog-card .info { width: 100% !important; padding: 18px !important; }
    .premium-blog-card .title { font-size: 19px !important; }
    .success-header { padding: 28px 18px !important; }
    .success-body { padding: 24px 16px !important; }
    .success-title { font-size: 23px !important; }
}

/* Home: focus the mobile viewport on products, not promotional decoration. */
@media screen and (max-width: 640px) {
    .home-page #slider-wp,
    .home-page #support-wp { display: none !important; }

    /* Bootstrap's clearfix pseudo-elements otherwise become empty CSS Grid cells. */
    #list-product-wp .section-detail .list-item.clearfix::before,
    #list-product-wp .section-detail .list-item.clearfix::after { content: none; display: none; }

    /* Featured and related products are Owl carousels; never turn their wrappers into grids. */
    #feature-product-wp ul.flex-product,
    #same-category-wp ul.flex-product { display: block !important; }
    #feature-product-wp .owl-wrapper-outer,
    #same-category-wp .owl-wrapper-outer { overflow: hidden; }
    .home-page #feature-product-wp { margin-top: 0 !important; }
}

/* Compact mobile filters and navigation panels. */
@media screen and (max-width: 991px) {
    .sidebar .section { margin-bottom: 10px !important; }
    .sidebar .section-head { margin: 0; }
    .sidebar .sidebar-toggle {
        display: flex;
        align-items: center;
        justify-content: space-between;
        width: 100%;
        min-height: 50px;
        padding: 13px 15px !important;
        border: 0;
        border-radius: 0 !important;
        background: #2e7d32 !important;
        color: #fff !important;
        font: inherit;
        font-size: 14px !important;
        font-weight: 700;
        line-height: 1.2;
        text-align: left;
        text-transform: uppercase;
    }
    .sidebar .sidebar-toggle:focus { outline: 3px solid rgba(76, 175, 80, 0.35); outline-offset: -3px; }
    .sidebar .sidebar-toggle .fa { font-size: 13px; transition: transform 0.2s ease; }
    .sidebar .section > .section-detail { display: none; padding: 12px !important; }
    .sidebar .section.is-expanded > .section-detail { display: block; }
    .sidebar .section.is-expanded .sidebar-toggle .fa { transform: rotate(180deg); }
    .sidebar #category-product-wp .section-detail { max-height: 55vh; overflow-y: auto; }
    .sidebar #filter-product-wp .premium-filter-form { padding: 0; }
    .sidebar #selling-wp .section-detail { max-height: 55vh; overflow-y: auto; }
}

/* A short, useful footer for phone screens. */
@media screen and (max-width: 640px) {
    #footer-wp { border-top-width: 3px !important; padding-top: 24px !important; }
    #foot-body .wp-inner { display: block !important; }
    #foot-body .block { width: 100% !important; }
    #footer-wp .policy,
    #footer-wp #newfeed,
    #footer-wp #payment { display: none !important; }
    #footer-wp #info-company { margin-bottom: 18px !important; }
    #footer-wp #info-company .title { font-size: 17px !important; margin-bottom: 8px !important; padding-bottom: 0 !important; }
    #footer-wp #info-company .title::after { display: none; }
    #footer-wp #info-company .desc {
        display: -webkit-box;
        margin: 0 !important;
        overflow: hidden;
        -webkit-box-orient: vertical;
        -webkit-line-clamp: 2;
    }
    #footer-wp #info-shop { padding-top: 16px !important; border-top: 1px solid rgba(255, 255, 255, 0.16); }
    #footer-wp #info-shop .title { margin-bottom: 10px !important; padding-bottom: 0 !important; }
    #footer-wp #info-shop .title::after { display: none; }
    #footer-wp #info-shop .list-item { display: grid; gap: 5px; }
    #footer-wp #info-shop .list-item li { margin: 0; }
    #footer-wp #info-shop .list-item li p { line-height: 1.5; }
    #foot-bot { margin-top: 22px !important; }
    #foot-bot #copyright { font-size: 12px !important; line-height: 1.5; }
}

/* Shared client layout: desktop rules above remain unchanged. */
@media screen and (max-width: 991px) {
    #header-wp { position: relative; z-index: 100; }
    #head-top { display: none; position: absolute; top: 100%; left: 0; right: 0; box-shadow: 0 8px 16px #0002; }
    #header-wp.mobile-menu-open #head-top { display: block; }
    #head-top #main-menu { display: flex !important; flex-direction: column; padding: 8px 12px; }
    #head-top #main-menu li a { display: block; padding: 14px 16px; font-size: 16px; border-radius: 6px; }
    #head-top #main-menu li a:focus-visible { outline: 2px solid white; outline-offset: -2px; }
    #btn-respon { display: inline-flex !important; align-items: center; justify-content: center; width: 44px; height: 44px; padding: 0; margin: 0 0 0 8px; border: 1px solid #ffffff70; border-radius: 8px; background: transparent; color: white; order: 3; }
    #btn-respon:focus-visible { outline: 2px solid white; outline-offset: 2px; }
    #auth-wp .dropdown-menu { left: auto; right: 0; }
    #action-wp { gap: 4px; }
    #head-body #logo { flex-basis: 0; }
    #list-product-wp .list-item.clearfix::before,
    #list-product-wp .list-item.clearfix::after { display: none; content: none; }
    #feature-product-wp ul.flex-product, #same-category-wp ul.flex-product { display: block !important; }
    #feature-product-wp .owl-wrapper-outer, #same-category-wp .owl-wrapper-outer { overflow: hidden; }
    .premium-product-card .price-box { min-height: 62px; align-content: flex-start; }
    #btn-top { bottom: 84px; right: 20px; }
    .premium-toolbar > *, .product-info, .info-wrap { min-width: 0; }
    .content-detail, .premium-article, .contact-info, .order-info-grid { overflow-wrap: anywhere; }
    .content-detail iframe, .content-detail video, .premium-article img { max-width: 100%; }
    #order-review-wp .shop-table { min-width: 0; width: 100%; table-layout: fixed; }
    #order-review-wp .shop-table td { white-space: normal; overflow-wrap: anywhere; padding: 12px 8px; }
    #order-review-wp .shop-table td:last-child { width: 38%; }
    #customer-info-wp .form-col { margin-bottom: 12px; }
    .client-chat-panel { right: 12px !important; bottom: 80px !important; width: min(350px, calc(100vw - 24px)) !important; height: min(500px, calc(100dvh - 110px)) !important; }
    .client-chat-toggle { bottom: 20px !important; right: 16px !important; }
    .client-chat-panel input { min-width: 0; }
    .client-chat-panel button { flex-shrink: 0; }
}
@media screen and (max-width: 640px) {
    #auth-wp > .mx-2, #auth-wp > a:last-child:not(:first-child) { display: none; }
    #head-body #logo h2 { font-size: 16px !important; }
    #head-body #logo img { width: 32px !important; height: 32px !important; margin-right: 6px !important; }
    #auth-wp { padding: 0 4px !important; }
    #auth-wp > a { font-size: 13px !important; }
    #main-content-wp input:not([type="checkbox"]):not([type="radio"]),
    #main-content-wp select, #main-content-wp textarea, .auth-container input { font-size: 16px; }
    .auth-container { width: calc(100% - 24px) !important; }
    .sidebar #selling-wp { display: none; }
    .pagination { flex-wrap: wrap; gap: 4px; }
    .premium-product-card .btn-add-cart { min-height: 44px; white-space: normal; }
    .cart-page #info-cart-wp .section-detail { overflow: visible; border: 0; }
    .cart-page table.table { display: block; min-width: 0 !important; min-height: 0 !important; width: 100%; }
    .cart-page table.table thead { display: none; }
    .cart-page table.table tbody, .cart-page table.table tfoot { display: block; width: 100%; }
    .cart-page table.table tbody tr { display: grid; grid-template-columns: 80px minmax(0, 1fr); gap: 8px; padding: 14px 0; border-bottom: 1px solid #e5e7eb; }
    .cart-page #info-cart-wp table.table tbody td { display: block; padding: 4px !important; white-space: normal; border: 0 !important; box-shadow: none !important; text-align: left; overflow-wrap: anywhere; }
    .cart-page table.table tbody td:first-child { grid-column: 1 / -1; color: #64748b; font-size: 12px; }
    .cart-page table.table tbody td:nth-child(2) { grid-row: span 2; }
    .cart-page table.table tbody td:nth-child(5)::before { content: 'Số lượng '; font-size: 12px; }
    .cart-page table.table tbody td:nth-child(6)::before { content: 'Thành tiền: '; font-size: 12px; }
    .cart-page table.table tbody td:nth-child(6) { align-self: center; }
    .cart-page #info-cart-wp table.table tbody tr { grid-template-columns: 80px minmax(0, 1fr) 44px; }
    .cart-page #info-cart-wp table.table tbody td:nth-child(2) { grid-column: 1; grid-row: 2 / 4; }
    .cart-page #info-cart-wp table.table tbody td:nth-child(3) { grid-column: 2; grid-row: 2; }
    .cart-page #info-cart-wp table.table tbody td:nth-child(4) { grid-column: 2 / -1; grid-row: 3; }
    .cart-page #info-cart-wp table.table tbody td:nth-child(5) { grid-column: 1; grid-row: 4; }
    .cart-page #info-cart-wp table.table tbody td:nth-child(6) { grid-column: 2 / -1; grid-row: 4; }
    .cart-page #info-cart-wp table.table tbody td:last-child:not([colspan]) { grid-column: 3; grid-row: 2; justify-self: end; align-self: start; }
    .cart-page table.table tbody td[colspan] { grid-column: 1 / -1; }
    .cart-page #info-cart-wp table tbody tr td .thumb { width: 72px; min-height: 0; border: 0; border-radius: 8px; }
    .cart-page #info-cart-wp .thumb img { width: 72px; height: 72px; }
    .cart-page #info-cart-wp .section-detail { margin-bottom: 0; }
    .cart-page #info-cart-wp .cart-summary-box { padding: 12px 0; margin-top: 0; box-shadow: none; }
    .cart-page #info-cart-wp table tbody tr td .num-order { width: 64px; height: 44px; }
    .cart-page #info-cart-wp table tbody tr:hover { transform: none; }
    .cart-page table.table tfoot tr, .cart-page table.table tfoot td { display: block; padding: 12px 0 !important; white-space: normal; width: 100%; }
    .cart-page .checkout-summary { padding: 16px !important; }
    .cart-page #voucher-form { flex-wrap: wrap; }
    .cart-page #voucher-form input { flex: 1 1 150px; min-width: 0; }
    .cart-page#main-content-wp #action-cart-wp { display: flex; flex-direction: column; align-items: stretch; gap: 12px; padding: 16px; }
    .cart-page #action-cart-wp a { margin: 0; text-align: center; }
    #my-orders-wp .card-header, #my-orders-wp .card-body { padding: 16px; }
    .product-item { flex-wrap: wrap; }
    .product-item > * { min-width: 0; }
}

@media screen and (min-width: 641px) and (max-width: 991px) {
    .cart-page #info-cart-wp table.table { min-width: 0; table-layout: fixed; width: 100%; }
    .cart-page table.table td { white-space: normal; overflow-wrap: anywhere; padding: 10px 6px; }
    .cart-page .thumb img { max-width: 100%; height: auto; }
}
@media screen and (max-width: 991px) {
    #main-content-wp .contact-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; }
    #main-content-wp .contact-wrapper { padding: 20px 14px; }
    #main-content-wp .contact-info-card, #main-content-wp .contact-form-card { padding: 18px 14px; min-width: 0; }
    #main-content-wp .contact-header { margin-bottom: 24px; }
    #main-content-wp .contact-header h1 { font-size: 26px; }
    #main-content-wp .contact-grid .info-text { min-width: 0; overflow-wrap: anywhere; }
    #main-content-wp .contact-grid .info-icon { width: 36px; height: 36px; margin-right: 12px; font-size: 17px; }
}

/* Product detail uses a regular grid, not the homepage carousel. */
@media screen and (max-width: 991px) {
    #related-products-wp > .section-detail { padding: 0 !important; }
    #related-products-wp .list-item {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 14px;
        margin: 0;
    }
    #related-products-wp .list-item::before,
    #related-products-wp .list-item::after { display: none; content: none; }
    #related-products-wp .list-item > li { width: auto; min-width: 0; padding: 0; margin: 0 !important; }
    #related-products-wp .list-item > .related-products-empty { grid-column: 1 / -1; }
    #related-products-wp .premium-product-card { width: 100%; }
    #related-products-wp .price-box { display: grid; grid-template-columns: minmax(0, 1fr); gap: 4px; min-height: 82px; }
    #related-products-wp .unit { justify-self: start; margin: 0; }
    #related-products-wp .btn-add-cart { margin-top: auto; }
}
@media screen and (max-width: 640px) {
    #related-products-wp .list-item { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
    #related-products-wp .section-premium-title { font-size: 18px; }
    #related-products-wp .info-wrap { padding: 10px 8px; }
    #related-products-wp .product-name { font-size: 13px; min-height: 37px; }
    #related-products-wp .price-new { font-size: 14px; }
    #related-products-wp .price-old { font-size: 11px; }
    #related-products-wp .btn-add-cart { font-size: 10px; padding: 10px 4px; }
}

/* Mobile category navigation precedes the catalog; other pages use the header menu. */
@media screen and (max-width: 991px) {
    #main-content-wp .sidebar { display: none; }
    #main-content-wp.home-page .sidebar,
    #main-content-wp.category-product-page .sidebar { display: block; margin-top: 0; margin-bottom: 8px; }
    #main-content-wp.home-page .sidebar #selling-wp { display: none; }
}
