/* DIENMAYVIP.COM MEGA RESPONSIVE FIX v3.0 — 26/04/2026 */
/* Cập nhật: 26/04/2026 06:50 (VN) */
/* Removed: rule#11 red border, rule#25 44px touch, rule#14 aggressive container */

/* [1] Banner slider */
[class*="banner"] img, .slider-item img, .owl-carousel img { max-width:100%!important; height:auto!important; object-fit:cover!important; }

/* [2] Menu scroll mobile */
@media(max-width:768px){
  [class*="menu-top"], [class*="menu-main"], .box-menu-top, nav ul { overflow-x:auto!important; white-space:nowrap!important; display:flex!important; flex-wrap:nowrap!important; -webkit-overflow-scrolling:touch!important; scrollbar-width:none!important; }
  [class*="menu-top"]::-webkit-scrollbar, nav ul::-webkit-scrollbar { display:none!important; }
  [class*="menu-top"] a, nav ul li { flex-shrink:0!important; font-size:11px!important; padding:6px 10px!important; }
}

/* [3] Header flex mobile */
@media(max-width:768px){
  [class*="header-top"], [class*="header-main"], .header-top { display:flex!important; flex-direction:column!important; flex-wrap:wrap!important; }
  [class*="logo"] img { max-height:40px!important; width:auto!important; }
  [class*="search"] input, .box-search, #search-input { width:100%!important; max-width:100%!important; box-sizing:border-box!important; }
}

/* [4] Float buttons scale mobile */
@media(max-width:768px){
  [class*="float"], [class*="hotline-float"], .box-hotline-float, .contact-float, [id*="zalo"] { transform:scale(0.7)!important; transform-origin:bottom right!important; right:2px!important; }
}

/* [5] Slider dots */
.owl-dots .owl-dot span, .slick-dots li button { width:10px!important; height:10px!important; opacity:0.8!important; }

/* [6] Banner title mobile */
@media(max-width:768px){
  h2[class*="banner"], [class*="banner"] h1, [class*="banner"] h2 { font-size:clamp(14px,4vw,28px)!important; line-height:1.3!important; }
}

/* [7] Product grid 2col mobile */
@media(max-width:768px){
  [class*="product-grid"], .product-list, .pro-pm { grid-template-columns:repeat(2,1fr)!important; gap:8px!important; display:grid!important; }
}

/* [8] Price wrap */
[class*="price"] { word-wrap:break-word!important; overflow-wrap:break-word!important; }

/* [9] Product images */
img[class*="product"], img[class*="thumb"] { max-width:100%!important; height:auto!important; object-fit:contain!important; }

/* [10] No horizontal scroll */
body { overflow-x:hidden!important; }
*, *::before, *::after { box-sizing:border-box!important; }

/* [11] REMOVED - was: red border on img:not([alt]) - caused layout ugliness */

/* [12] Lazy load */
img[loading] { content-visibility:auto!important; }

/* [13] Player no overflow */
#vip-bar-widgets, [class*="player"], [class*="vip-bar"] { max-width:100vw!important; overflow:hidden!important; box-sizing:border-box!important; }

/* [14] FIXED - lighter container rule (no forced padding) */
.container, .wrapper { max-width:100vw!important; overflow-x:hidden!important; box-sizing:border-box!important; }

/* [15] Table responsive */
@media(max-width:768px){ table { display:block!important; overflow-x:auto!important; } }

/* [16] Footer stack mobile */
@media(max-width:768px){
  [class*="footer"] .row, [class*="footer"] [class*="col"] { display:block!important; width:100%!important; }
}

/* [17] Sidebar collapse mobile */
@media(max-width:768px){ [class*="sidebar"], .aside { display:none!important; } }

/* [18] Breadcrumb wrap */
@media(max-width:768px){ [class*="breadcrumb"] { font-size:11px!important; white-space:normal!important; word-break:break-word!important; } }

/* [19] Modal responsive */
@media(max-width:768px){
  [class*="modal"] [class*="dialog"], [class*="popup"] { width:95vw!important; max-width:95vw!important; margin:10px auto!important; }
}

/* [20] Form inputs mobile */
@media(max-width:768px){
  input[type="text"], input[type="email"], input[type="tel"], input[type="search"], textarea, select { width:100%!important; max-width:100%!important; box-sizing:border-box!important; font-size:16px!important; }
}

/* [21] Video responsive */
iframe[src*="youtube"], iframe[src*="vimeo"], video { max-width:100%!important; height:auto!important; aspect-ratio:16/9!important; }

/* [22] Social icons */
@media(max-width:768px){ [class*="social"] a, [class*="social"] img { width:32px!important; height:32px!important; margin:4px!important; } }

/* [23] Pagination */
@media(max-width:768px){
  [class*="pagination"], .paging { display:flex!important; flex-wrap:wrap!important; justify-content:center!important; gap:4px!important; }
}

/* [24] Card radius */
[class*="product-item"], [class*="card"] { border-radius:8px!important; overflow:hidden!important; }

/* [25] REMOVED - was: 44px min touch target on ALL links/buttons - broke inline layout */

/* [26] Title truncate mobile */
@media(max-width:768px){
  [class*="product-name"], [class*="product-title"] { display:-webkit-box!important; -webkit-line-clamp:2!important; -webkit-box-orient:vertical!important; overflow:hidden!important; }
}

/* [27] Sticky header thin mobile */
@media(max-width:768px){ [class*="header-main"].sticky, header.fixed { padding:4px 0!important; } }

/* [28] Tab scroll */
@media(max-width:768px){
  [class*="tab-content"], .tab-pane { overflow-x:auto!important; }
  [class*="nav-tabs"] { overflow-x:auto!important; white-space:nowrap!important; display:flex!important; flex-wrap:nowrap!important; }
}

/* [29] Hide compare mobile */
@media(max-width:768px){ [class*="compare"], [class*="wishlist"] { display:none!important; } }

/* [30] Print */
@media print { [class*="float"], [class*="hotline"], [class*="chat"], nav, footer { display:none!important; } body { font-size:12pt!important; color:#000!important; } }

/* [31] Empty sections hide */
.brand-see, #brand-see-00, [class*='brand-carousel'],
.owl-carousel:empty, .owl-stage-outer:empty,
section:empty, div.home-section:empty {
  display: none !important; max-height: 0 !important; overflow: hidden !important; padding: 0 !important; margin: 0 !important;
}
.owl-carousel .owl-stage:empty { display: none !important; }
.owl-carousel:not(:has(.owl-item)) { display: none !important; }

/* [32] Search button icon */
.box-search button, .search-box button,
[class*='search'] button[type='submit'],
.header-search button {
  min-width: 50px !important; position: relative !important; font-size: 0 !important;
}
.box-search button::after, .search-box button::after,
[class*='search'] button[type='submit']::after,
.header-search button::after {
  content: '🔍' !important; font-size: 18px !important;
  position: absolute !important; top: 50% !important; left: 50% !important;
  transform: translate(-50%, -50%) !important;
}