/* ════════════════════════════════════════════════════════════════════════
   performance-override.css — NẠP CUỐI CÙNG (sau tuanone*, app.min.css)
   Mục tiêu: khử KHỰNG/ĐƠ khi lăn chuột trên trang có DOM lớn (trang chủ liệt
   kê rất nhiều sản phẩm ~ 30k node, cao ~140.000px).
   ────────────────────────────────────────────────────────────────────────
   NGUYÊN NHÂN đã đo được:
   1) backdrop-filter: blur(20px) trên thanh cố định (.app-menu / .footer) →
      trình duyệt phải "blur lại" toàn bộ trang phía sau MỖI khung hình khi
      cuộn → repaint cực nặng → giật/đơ. (Handler JS cuộn chỉ tốn ~0ms, KHÔNG
      phải thủ phạm.)
   2) DOM khổng lồ: mọi bảng sản phẩm đều layout+paint kể cả ngoài màn hình.
   ════════════════════════════════════════════════════════════════════════ */

/* (1) Bỏ blur trên thanh cố định — thay bằng nền đục (nhìn gần như y hệt trên
       nền sáng) để trình duyệt không phải re-blur mỗi frame khi cuộn.
       Dùng "html body" để chắc chắn thắng cascade của theme Velzon. */
html body .app-menu,
html body .navbar-menu,
html body .app-menu.navbar-menu {
    background-color: #ffffff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

html body .footer {
    background-color: #ffffff !important;
    -webkit-backdrop-filter: none !important;
    backdrop-filter: none !important;
}

/* (2) content-visibility: auto — trình duyệt BỎ QUA layout/paint các bảng
       sản phẩm nằm NGOÀI màn hình, chỉ vẽ phần đang thấy → cuộn mượt dù DOM
       lớn. contain-intrinsic-size giữ chiều cao ước lượng để thanh cuộn không
       nhảy. (Nội dung vẫn nằm trong DOM → Google vẫn index bình thường.) */
#layout-wrapper table {
    content-visibility: auto;
    contain-intrinsic-size: auto 500px;
}