/* mobile.css (svm1) — giao diện điện thoại / APK SV VINH PHÁT. CHỈ áp dụng khi <html class="svm"> (điện thoại ≤760px hoặc APK / ?app=1). Desktop không đổi. */
html.svm{--svm-p:#8B7355;--svm-pd:#6B5640;--svm-bg:#F7F1E6;--svm-card:#FFFDF8;--svm-line:#E6DCCB;--svm-mu:#7D6E5C;-webkit-text-size-adjust:100%}
html.svm body{overflow-x:hidden;padding-bottom:calc(58px + env(safe-area-inset-bottom))}
html.svm .app{height:calc(100vh - 58px - env(safe-area-inset-bottom));height:calc(100dvh - 58px - env(safe-area-inset-bottom))}
/* thanh trên kiểu TÀI XẾ: nâu gradient, 1 dòng tiêu đề + nút ☰ / ⋮ */
html.svm .topbar{background:linear-gradient(180deg,var(--svm-p),var(--svm-pd))!important;color:#fff;border:0!important;padding:calc(env(safe-area-inset-top) + 6px) 8px 6px!important;min-height:50px;flex-wrap:nowrap!important;gap:6px!important;box-shadow:0 1px 4px #0003;position:relative;z-index:5}
html.svm .topbar>div:not(.topbar-actions){flex:1;min-width:0}
html.svm .topbar .label{display:none!important}
html.svm .topbar .title{color:#fff!important;font-size:14.5px!important;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;letter-spacing:.02em}
html.svm .topbar .ham{display:inline-flex!important;background:transparent!important;color:#fff!important;border:1px solid #fff6!important;width:38px;height:38px;align-items:center;justify-content:center;border-radius:10px;flex:none}
html.svm .topbar-actions{flex-wrap:nowrap!important;gap:6px!important;flex:none}
html.svm .topbar-actions>*:not(.svm-keep):not(.svm-more){display:none!important}
html.svm .topbar-actions .svm-keep{background:#fff!important;color:var(--svm-pd)!important;border-color:#fff!important;padding:6px 9px!important;font-size:11px!important;white-space:nowrap;max-width:140px;overflow:hidden;text-overflow:ellipsis}
html.svm .svm-more{width:38px;height:38px;border-radius:10px;border:1px solid #fff6;background:transparent;color:#fff;font-size:22px;line-height:1;font-weight:900;flex:none}
html.svm .content{padding:8px!important;overflow-x:hidden;-webkit-overflow-scrolling:touch}
/* bảng: cuộn ngang trong khung */
html.svm .svm-x{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
html.svm .svm-x>table{min-width:100%}
html.svm .ke-desk{overflow-x:auto;-webkit-overflow-scrolling:touch;max-width:100%}
html.svm .card{max-width:100%}
/* thanh lọc: 1 hàng cuộn ngang */
html.svm .filter-bar,html.svm .svt-tb{flex-wrap:nowrap!important;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:4px;scrollbar-width:none}
html.svm .filter-bar::-webkit-scrollbar{display:none}
html.svm .filter-bar>*,html.svm .svt-tb>*{flex:none}
html.svm .filter-bar .ke-actions{margin-left:0!important}
html.svm input,html.svm select,html.svm textarea{font-size:16px}
html.svm .btn{min-height:34px}
/* menu trái thành ngăn kéo + nền mờ */
html.svm .sidebar{width:min(84vw,300px)!important;box-shadow:4px 0 24px #0005;bottom:calc(58px + env(safe-area-inset-bottom))!important}
html.svm .svm-scrim{position:fixed;inset:0;background:#0006;z-index:110;display:none}
html.svm.svm-drawer .svm-scrim{display:block}
/* modal vừa màn hình */
html.svm .modal{width:calc(100vw - 16px)!important;max-width:none!important;max-height:calc(100dvh - 90px)!important;overflow:auto}
/* trang phân hệ: lưới 2 cột kiểu ô ứng dụng */
html.svm .home-wrap{padding:8px!important;align-items:flex-start!important;justify-content:flex-start!important;min-height:0!important}
html.svm .home-card{padding:12px!important;border-radius:14px}
html.svm .home-head{display:block!important;margin-bottom:10px!important}
html.svm .home-head .brand-title{font-size:20px!important}
html.svm .home-head .brand-sub{font-size:9.5px!important}
html.svm .home-head>div:last-child{display:none!important}
html.svm .mod-grid{grid-template-columns:1fr 1fr!important;gap:8px!important}
html.svm .mod{min-height:0!important;padding:12px 8px!important;align-items:center;text-align:center!important;gap:3px!important;border-radius:14px}
html.svm .mod p{display:none}
html.svm .mod .k{font-size:9px!important}
html.svm .mod h3{font-size:13.5px!important;line-height:1.2}
html.svm .mod .pill{font-size:9.5px!important;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
html.svm .mod .svm-ic{font-size:30px;line-height:36px;display:block}
/* thanh tab dưới kiểu TÀI XẾ */
.svm-tabs{display:none}
html.svm .svm-tabs{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:130;background:var(--svm-card);border-top:1px solid var(--svm-line);padding-bottom:env(safe-area-inset-bottom);box-shadow:0 -1px 6px #0001}
html.svm .svm-tabs button{flex:1;border:0;background:none;padding:6px 2px 5px;color:#9AA3AE;font:500 11px Roboto,Arial,sans-serif;height:58px}
html.svm .svm-tabs button i{display:block;font-style:normal;font-size:22px;line-height:26px;filter:grayscale(1) opacity(.55)}
html.svm .svm-tabs button.on{color:var(--svm-pd);font-weight:700}
html.svm .svm-tabs button.on i{filter:none;transform:scale(1.12)}
/* ⋮ bảng chọn dưới */
.svm-sheet{display:none}
html.svm .svm-sheet.open{display:block;position:fixed;inset:0;z-index:300;background:#0006}
html.svm .svm-sheet .box{position:absolute;left:0;right:0;bottom:0;background:var(--svm-card);border-radius:16px 16px 0 0;padding:8px 10px calc(12px + env(safe-area-inset-bottom));max-height:75vh;overflow:auto}
html.svm .svm-sheet .hd{font:700 12px Roboto,Arial;color:var(--svm-mu);letter-spacing:.06em;padding:6px 6px 8px;text-align:center}
html.svm .svm-sheet .hd:before{content:"";display:block;width:40px;height:4px;border-radius:2px;background:var(--svm-line);margin:0 auto 8px}
html.svm .svm-sheet .it{display:block;width:100%;text-align:left;border:0;border-bottom:1px solid var(--svm-line);background:none;padding:13px 8px;font:600 14px Roboto,Arial;color:#2E2418;text-transform:uppercase}
html.svm .svm-sheet .it:last-child{border-bottom:0}
@media print{.svm-tabs,.svm-sheet,.svm-scrim{display:none!important}html.svm body{padding:0!important}html.svm .app{height:auto!important}}
