/* wwwroot/css/trc-vung-bam.css — VÙNG BẤM ≥ 44 px trên điện thoại / máy cảm ứng (DG28-B, 28/10/2026, mục 4).
   Nạp từ _Layout.cshtml (một dòng <link>) SAU trc-layout.css. Chỉ dùng token trong trc-brand.css (không hex, không hàm trộn màu).
   Chỉ có hiệu lực khi màn hẹp (≤ 768 px) HOẶC con trỏ cảm ứng (pointer: coarse) → máy tính có chuột (1440 px) KHÔNG đổi gì.
   Không đổi thứ tự Tab, không đổi nhãn truy cập: chỉ tăng chiều cao/rộng tối thiểu và khoảng cách giữa các nút ở đầu trang. */

@media (max-width: 768px), ((pointer: coarse) and (max-width: 1024px)) {   /* sau soát L6: máy cảm ứng rộng > 1024 px (laptop cảm ứng 1440) giữ như cũ */
    /* Đầu trang: nút menu 32×32 → 44×44 */
    #sidebar-toggle { width: 44px; height: 44px; }

    /* Logo = liên kết về trang chủ: cao ≥ 44 */
    .brand { min-height: 44px; }

    /* «Đổi mật khẩu» (chỉ còn biểu tượng chìa khoá ở ≤ 640 px: 13×24) và «Đăng xuất» (76×24) → ≥ 44 px, có chỗ trống giữa hai nút (trước đây sát nhau). */
    #topbar-right { gap: var(--sp-2); }
    .topbar-link { min-height: 44px; min-width: 44px; padding: 0 var(--sp-2); justify-content: center; }
    .topbar-link--btn { padding: 0 var(--sp-2); }
    .role-badge { white-space: nowrap; }
    /* Đường dẫn: các mục xếp giữa theo chiều dọc (mục liên kết cao 44 px, mục chữ thường không bị lệch dòng) */
    .breadcrumb { align-items: center; }
    .breadcrumb-item { display: flex; align-items: center; }

    /* Mục menu bên trái, tab, đường dẫn (breadcrumb) */
    .nav-link-item { min-height: 44px; }
    .trc-tab { min-height: 44px; display: inline-flex; align-items: center; }
    .trc-breadcrumb a, nav[aria-label="Đường dẫn"] a, .breadcrumb a { display: inline-flex; align-items: center; min-height: 44px; }

    /* Nút / ô nhập / ô chọn dùng chung của khung TRC */
    .trc-btn, .trc-btn--sm, .trc-iconbtn { min-height: 44px; }
    .trc-iconbtn { min-width: 44px; }
    .trc-select, .trc-input, .trc-select--sm, .trc-input--sm { min-height: 44px; }
    .trc-pager-btn { min-height: 44px; min-width: 44px; }
    .trc-dlg-close { min-width: 44px; min-height: 44px; }

    /* Các nút lọc / sắp xếp / điều khiển ván ở trang Phân tích ván, Xem ván, Ván của em, Kho ván mẫu (đo 28/10: cao 24–37 px, ◀▶ 28×27) */
    main .ptv-tt__nut, main .ptv-sx, main .ptv-dk__nut, main .trc-btn, main .trc-iconbtn { min-height: 44px; min-width: 44px; }   /* «main» tăng độ ưu tiên: CSS riêng của trang nạp SAU tệp này */
    main a.ptv-van { display: inline-flex; align-items: center; min-height: 44px; }
    main .ip-thanh__lienket, main .trc-page-actions a:not(.trc-btn), main .trc-card-body > a:not(.trc-btn) { display: inline-flex; align-items: center; min-height: 44px; }

    /* Ô tick / ô chọn rời trong nội dung: ≥ 24 px (WCAG 2.5.8). Ô tick trong thẻ bảng (.btt-tick) có vùng bấm 44 × 44 riêng (css/pages/trc-bang-the.css). */
    main input[type="checkbox"], main input[type="radio"] { min-width: 24px; min-height: 24px; }
}

/* Màn rất hẹp (≤ 480 px): bốn nút ≥ 44 px + huy hiệu vai không vừa một hàng → thu lề/khoảng cách và giấu CHỮ «TRC» cạnh logo (logo vẫn là liên kết về trang chủ, tên truy cập aria-label giữ nguyên). */
@media (max-width: 480px) {
    #layout-topbar { padding: 0 var(--sp-2); gap: var(--sp-1); }
    #topbar-right { gap: 0; }
    .brand > span { display: none; }
    .brand { min-width: 44px; justify-content: center; }
}