/* TOOLZONE — tối ưu mobile */
@media (max-width: 1200px) and (min-width: 821px) {
  /* Laptop hẹp: cho thanh danh mục xuống dòng thay vì cắt chữ; PC lớn vẫn 1 hàng */
  [style*="flex-wrap: nowrap"][style*="justify-content: center"] { flex-wrap: wrap !important; }
}
@media (max-width: 820px) {
  html { zoom: 1 !important; }
  /* Thanh danh mục: PC để 1 hàng (nowrap), nhưng trên điện thoại cho xuống dòng lại */
  [style*="flex-wrap: nowrap"][style*="justify-content: center"] { flex-wrap: wrap !important; }
  html, body { overflow-x: auto !important; max-width: 100vw; }
  body { text-align: left; }
  /* các ô có căn riêng (phải/trái trong bảng) giữ nguyên vì dùng inline style */

  /* Chống mọi khối tràn ngang: không vượt quá bề rộng màn hình */
  [style*="pre-wrap"], [style*="border-radius: 12px"], [style*="border-radius:12px"] {
    max-width: 100% !important;
    box-sizing: border-box !important;
  }
  /* Hộp mô tả / hướng dẫn: căn trái, ngắt chữ dài, không tràn */
  [style*="white-space: pre-wrap"], [style*="white-space:pre-wrap"] {
    text-align: left !important;
    overflow-wrap: anywhere !important;
    word-break: break-word !important;
  }

  /* Nhóm nút/tab xếp hàng ngang -> cho phép xuống dòng */
  [style*="display: flex"][style*="gap: 8px"], [style*="display:flex"][style*="gap:8px"],
  [style*="display: flex"][style*="gap: 12px"], [style*="display:flex"][style*="gap:12px"],
  [style*="display: flex"][style*="gap: 14px"], [style*="display:flex"][style*="gap:14px"] {
    flex-wrap: wrap !important;
    justify-content: center;
  }

  /* Hàng tiêu đề + bộ lọc: xếp dọc cho thoáng */
  [style*="justify-content: space-between"][style*="align-items: flex-end"] {
    flex-direction: column !important;
    align-items: flex-start !important;
  }

  /* Header: cho phép xuống dòng, gọn lại */
  [style*="height: 74px"], [style*="height:74px"] {
    height: auto !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    padding: 10px 14px !important;
    row-gap: 8px !important;
  }

  /* Lưới 3-4 cột -> 2 cột */
  [style*="grid-template-columns: repeat(3,"], [style*="grid-template-columns:repeat(3,"],
  [style*="grid-template-columns: repeat(4,"], [style*="grid-template-columns:repeat(4,"] {
    grid-template-columns: repeat(2, 1fr) !important;
  }

  /* Bố cục 2 cột (hero, chi tiết, nạp ví, đánh giá...) -> 1 cột */
  [style*="grid-template-columns: 1.2fr"], [style*="grid-template-columns:1.2fr"],
  [style*="grid-template-columns: 1.15fr"], [style*="grid-template-columns:1.15fr"],
  [style*="grid-template-columns: 1.05fr"], [style*="grid-template-columns:1.05fr"],
  [style*="grid-template-columns: 0.9fr"], [style*="grid-template-columns:.9fr 1.1fr"],
  [style*="grid-template-columns: 1.5fr"], [style*="grid-template-columns:1.5fr"],
  [style*="grid-template-columns: 2fr 1fr"], [style*="grid-template-columns:2fr 1fr"],
  [style*="grid-template-columns: 1.6fr 1fr 1fr 1.4fr"], [style*="grid-template-columns:1.6fr 1fr 1fr 1.4fr"] {
    grid-template-columns: 1fr !important;
  }

  /* Sidebar dashboard/admin -> xếp dọc */
  [style*="min-height: 100vh"][style*="display: flex"]:not([style*="flex-direction"]),
  [style*="min-height:100vh"][style*="display:flex"]:not([style*="flex-direction"]) {
    flex-direction: column !important;
  }
  [style*="width: 250px"], [style*="width:250px"] {
    width: 100% !important;
    min-height: 0 !important;
    position: static !important;
    border-right: none !important;
    border-bottom: 1px solid rgba(255,255,255,.09);
  }

  /* Thanh danh mục trên cùng: không treo cố định khi cuộn (chiếm quá nhiều màn hình) */
  [style*="position:sticky"][style*="top:0"], [style*="position: sticky"][style*="top: 0"] {
    position: static !important;
  }

  /* Khối sticky (card mua hàng, tổng kết) -> tĩnh */
  [style*="position: sticky"][style*="top: 96px"], [style*="position:sticky"][style*="top:96px"] {
    position: static !important;
  }

  /* Padding section lớn -> gọn */
  [style*="padding: 96px 28px"], [style*="padding:96px 28px"] { padding: 48px 18px !important; }
  [style*="padding: 96px 28px 72px"] { padding: 48px 18px 40px !important; }
  [style*="padding: 36px 40px"], [style*="padding:36px 40px"] { padding: 24px 16px 60px !important; }
  [style*="padding: 72px 40px"], [style*="padding:72px 40px"] { padding: 44px 20px !important; }

  /* Bảng dạng grid nhiều cột: cho cuộn ngang thay vì vỡ */
  [style*="border-radius: 14px"][style*="overflow: hidden"],
  [style*="border-radius:14px"][style*="overflow:hidden"] {
    overflow-x: auto !important;
  }
  [style*="border-radius: 14px"][style*="overflow: hidden"] > [style*="grid-template-columns"],
  [style*="border-radius:14px"][style*="overflow:hidden"] > [style*="grid-template-columns"] {
    min-width: 640px;
  }

  /* Chart cột: co chiều cao */
  [style*="height: 160px"][style*="align-items: flex-end"] { height: 120px !important; }

  /* Card sản phẩm: ảnh dọc 9:16 quá cao trên điện thoại -> hạ về 3:4 cho gọn */
  [style*="aspect-ratio: 9 / 16"], [style*="aspect-ratio:9/16"], [style*="aspect-ratio: 9/16"] {
    aspect-ratio: 3 / 4 !important;
  }

  /* Trang chi tiết: khung ảnh/khung video cố định 480px -> thấp lại */
  [style*="height: 480px"], [style*="height:480px"] { height: 300px !important; }

  /* Bố cục 2 cột trang chi tiết: giảm khoảng cách dọc khi đã xếp 1 cột */
  [style*="grid-template-columns: 1.15fr"], [style*="grid-template-columns:1.15fr"] {
    gap: 20px !important;
  }

  /* Hộp mô tả / hướng dẫn: chống tràn chữ dài (đã căn trái ở khối trên) */
  [style*="white-space: pre-wrap"], [style*="white-space:pre-wrap"] {
    overflow-wrap: anywhere;
  }
  /* Cột nội dung trang chi tiết: không cho rộng quá màn hình */
  [style*="min-height: 100vh"] [style*="max-width: 1180px"],
  [style*="min-height:100vh"] [style*="max-width:1180px"] {
    max-width: 100% !important;
  }
}

@media (max-width: 480px) {
  /* Điện thoại nhỏ: lưới 2 cột -> 1 cột cho card sản phẩm */
  [style*="grid-template-columns: repeat(3,"], [style*="grid-template-columns:repeat(3,"] {
    grid-template-columns: 1fr !important;
  }
  /* Số liệu hero + stats vẫn 2 cột cho gọn — giữ nguyên */
}