/* รองรับมือถือ/แท็บเล็ต — เมนูซ้ายเป็นลิ้นชักเลื่อนออก, ปรับระยะ/ขนาดปุ่มให้แตะง่าย, ตารางเลื่อนแนวนอน */
.sb-backdrop { display: none; }
@media (max-width: 900px) {
    html, body { overflow-x: hidden; -webkit-text-size-adjust: 100%; }
    .app { width: 100vw !important; height: 100vh; height: 100dvh; }
    .main { width: 100%; }
    /* เมนูซ้าย = ลิ้นชัก */
    .sidebar, .sidebar.mini { position: fixed; top: 0; left: 0; bottom: 0; height: 100vh !important; height: 100dvh !important;
        width: min(300px, 86vw) !important; min-width: 0 !important; transform: translateX(-102%); transition: transform .25s var(--ease);
        z-index: 1200; box-shadow: none; }
    body.sb-open .sidebar { transform: none; box-shadow: 0 0 40px rgba(0,0,0,.35); }
    .sidebar.mini .sb-brand-text, .sidebar.mini .sb-section, .sidebar.mini .sb-foot { opacity: 1; pointer-events: auto; height: auto; }
    .sidebar.mini .m-label, .sidebar.mini .m-badge, .sidebar.mini .m-arrow { display: initial; }
    .sidebar.mini .m-head { justify-content: flex-start; padding: inherit; }
    .sb-menu { overflow-y: auto; -webkit-overflow-scrolling: touch; }
    .sb-backdrop { position: fixed; inset: 0; background: rgba(0,0,0,.45); z-index: 1100; opacity: 0; pointer-events: none; transition: opacity .25s; display: block; }
    body.sb-open .sb-backdrop { opacity: 1; pointer-events: auto; }
    body.sb-open { overflow: hidden; }
    /* แถบบน */
    .topbar { padding: 0 10px; gap: 8px; }
    .tb-search { flex: 1; min-width: 0; }
    .tb-search input { min-width: 0; width: 100%; font-size: 16px; }
    .tb-search kbd, .tb-kbd { display: none; }
    .tb-user-info, .tb-caret { display: none !important; }
    .tb-right { gap: 6px; }
    /* เนื้อหา */
    .content { padding: 14px 12px 24px; -webkit-overflow-scrolling: touch; }
    .page-head { flex-wrap: wrap; gap: 10px; }
    .page-title { font-size: 19px; }
    .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .g-2, .g-3, .g-4 { grid-template-columns: minmax(0, 1fr); }
    .data-table-wrap, .rcv-tablewrap, .iss-tablewrap, [class*="tablewrap"] { overflow-x: auto; -webkit-overflow-scrolling: touch; }
    .content table { max-width: none; }
    /* หน้าต่างป๊อปอัป */
    [style*="position:fixed"][style*="inset:0"] { padding: 8px !important; }
    [style*="position:fixed"][style*="inset:0"] > div { max-width: 100% !important; }
    .sb-tip { display: none !important; }
}
@media (max-width: 600px) {
    .stats { grid-template-columns: minmax(0, 1fr); }
    .tb-search input::placeholder { font-size: 13px; }
    .data-card-head { flex-wrap: wrap; gap: 8px; }
}
@media (max-width: 700px) {
    /* กริดที่กำหนดคอลัมน์ไว้ในตัวหน้า (inline) → เรียงเป็นคอลัมน์เดียวบนมือถือ */
    .content [style*="grid-template-columns:repeat("], .content [style*="grid-template-columns: repeat("],
    .content [style*="grid-template-columns:1fr 1fr"], .content [style*="grid-template-columns: 1fr 1fr"],
    .content [style*="44px minmax"], .content [style*="grid-template-columns:minmax(0,1fr) minmax(0,1fr)"] { grid-template-columns: minmax(0, 1fr) !important; }
    .content [style*="grid-column:span"], .content [style*="grid-column: span"] { grid-column: auto !important; }
}
@media (pointer: coarse) and (max-width: 900px) {
    /* เฉพาะอุปกรณ์สัมผัส: ปุ่มและช่องกรอกใหญ่ขึ้นให้แตะง่าย และไม่ให้ iOS ซูมเอง */
    input, select, textarea { font-size: 16px !important; }
    input:not([type=checkbox]):not([type=radio]), select { min-height: 40px; }
    .btn, button.btn { min-height: 40px; }
    .table-btn { min-width: 36px; min-height: 36px; }
    .tb-btn { width: 40px; height: 40px; }
    .m-head, .m-sub-item { min-height: 44px; }
}
@media (pointer: coarse) {
    .table-btn, .tb-btn, .btn { touch-action: manipulation; }
}