/* VROAD responsive management UI. Desktop layout and server permissions remain authoritative. */
.vm-toolbar,.vm-backdrop,.vm-close {display:none}
.vm-table-region {max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.vm-public-toggle {display:none}
@media screen and (max-width:1199px){
 body.vm-admin {padding-top:64px!important;margin:0!important;min-width:0!important}
 body.vm-admin > nav.vroad-site-header {display:none!important}
 body.vm-admin .vm-toolbar {position:fixed;inset:0 0 auto;z-index:1100;height:56px;box-sizing:border-box;display:flex;align-items:center;gap:10px;padding:6px 12px;background:#101723;color:#f4f5ff;border-bottom:1px solid #344159;font:600 15px sans-serif}
 .vm-toolbar strong{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
 .vm-toolbar button,.vm-toolbar a,.vm-close{min-height:44px;padding:10px 12px;background:#233049;border:1px solid #52617d;border-radius:8px;color:#fff;text-decoration:none;font:600 14px sans-serif;cursor:pointer}
 body.vm-admin .sidebar {position:fixed!important;inset:0 auto 0 0!important;width:min(84vw,320px)!important;height:100vh!important;height:100dvh!important;max-height:none!important;z-index:1200!important;transform:translateX(-102%);visibility:hidden;display:flex!important;flex-direction:column!important;overflow-y:auto!important;box-sizing:border-box;padding-bottom:env(safe-area-inset-bottom);transition:transform .18s ease,visibility .18s}
 body.vm-admin.vm-nav-open .sidebar{transform:translateX(0);visibility:visible}
 body.vm-admin .sidebar-brand{display:block!important;padding:24px 16px!important}
 body.vm-admin .sidebar-menu{display:flex!important;flex-direction:column!important;flex-wrap:nowrap!important;gap:6px!important;padding:12px 0!important;margin:0!important;flex:1!important}
 body.vm-admin .sidebar-menu li{margin:0!important;list-style:none}
 body.vm-admin .sidebar-menu li a{margin:0 12px!important;padding:12px!important;min-height:44px;box-sizing:border-box;font-size:14px!important}
 body.vm-admin .sidebar-menu .menu-group-title{display:block!important;padding:12px 24px!important}
 body.vm-admin .sidebar-footer{display:block!important;padding:18px!important}
 body.vm-admin .vm-close{display:block;margin:12px 12px 0;align-self:flex-end}
 body.vm-admin .vm-backdrop{position:fixed;inset:0;z-index:1190;background:#0009;border:0;padding:0;width:100%;height:100%;cursor:pointer}
 body.vm-admin.vm-nav-open .vm-backdrop{display:block}
 body.vm-admin :is(.main-content,.sp-main,.ma-main,.tp-main.tp-admin){margin:16px 0 32px!important;padding:0 16px!important;width:100%!important;max-width:none!important;min-width:0!important;box-sizing:border-box}
 body.vm-admin :is(.dashboard-grid,.sp-layout){grid-template-columns:1fr!important}
 body.vm-admin :is(.admin-header,.sp-title,.top-action-bar){gap:12px;flex-wrap:wrap}
 body.vm-admin :is(.admin-title,.sp-title h1){font-size:clamp(20px,4vw,28px)!important;overflow-wrap:anywhere}
 body.vm-admin :is(.admin-card,.sp-card,.tp-card,.ma-card){min-width:0;box-sizing:border-box;max-width:100%}
 body.vm-admin .dual-pane-wrap{height:auto!important;min-height:0!important;flex-wrap:wrap}
 body.vm-admin .pane-box{min-width:0;flex:1 1 300px}
 body.vm-admin .pane-content{max-height:55vh;overflow:auto}
 .vm-filter summary{cursor:pointer;padding:12px;font-weight:bold;min-height:44px;box-sizing:border-box}
 body.vm-admin .vm-filter{margin:12px 0;border:1px solid #bcc6d5;border-radius:10px}
 body.vm-admin :is(input,select,textarea){font-size:16px!important;max-width:100%;box-sizing:border-box}
 body.vm-admin :is(button,.badge,.action-link,.tp-button,.sp-link){touch-action:manipulation}
 body.vm-admin button:not(.toggle-switch){min-height:44px}
 .vm-toolbar button:focus-visible,.vm-close:focus-visible{outline:2px solid #00e6ed;outline-offset:2px}
}
@media screen and (max-width:767px){
 body.vm-admin :is(.main-content,.sp-main,.ma-main,.tp-main.tp-admin){padding:0 12px!important}
 body.vm-admin :is(.admin-card,.sp-card,.tp-card,.ma-card){padding:16px!important;border-radius:14px!important}
 body.vm-admin :is(.form-grid-2,.sp-grid,.vp-edit-grid,.vp-dates,.teacher-pay-option){grid-template-columns:minmax(0,1fr)!important}
 body.vm-admin :is(.search-bar,.filter-form,.payment-actions,.sp-tools,.sp-footer,.tp-bar,.ma-grid,.top-action-bar,.custom-cal-header,.media-dialog-tools){display:flex!important;flex-wrap:wrap!important;gap:10px!important;min-width:0}
 body.vm-admin :is(.search-bar,.filter-form,.ma-grid) > :is(input,select,label){width:100%!important;flex:1 1 100%!important;min-width:0!important}
 body.vm-admin :is(.form-group,.sp-field){min-width:0}
 body.vm-admin :is(.date-inputs,.tp-head-form){flex-wrap:wrap;gap:8px}
 body.vm-admin :is(.action-tabs,.main-tabs,.sub-tabs){display:flex;overflow-x:auto;gap:6px;max-width:100%;white-space:nowrap}
 body.vm-admin :is(.tab-btn,.main-tab-btn,.sub-tab-btn){flex:0 0 auto;padding:12px!important;font-size:14px!important}
 body.vm-admin :is(.checkbox-grid,.media-grid){grid-template-columns:repeat(2,minmax(0,1fr))!important}
 body.vm-admin :is(.class-enroll-list,.sp-staff-list){max-height:280px;overflow-y:auto}
 body.vm-admin .class-enroll-item{flex-wrap:wrap;gap:10px}
 body.vm-admin :is(.modal-overlay){padding:0!important;box-sizing:border-box}
 body.vm-admin :is(.modal-content){width:100%!important;max-width:none!important;max-height:100vh!important;max-height:100dvh!important;border-radius:0!important;margin:0!important;padding:22px 16px calc(24px + env(safe-area-inset-bottom))!important;overflow-y:auto!important;box-sizing:border-box}
 body.vm-admin :is(dialog){width:100%!important;max-width:100%!important;max-height:100vh!important;max-height:100dvh!important;border-radius:0!important;box-sizing:border-box}
 body.vm-admin :is(.talk-dialog-body,.ph-body,.ph-scroll){min-width:0;max-height:65dvh;overflow:auto}
 body.vm-admin :is(.talk-dialog-actions,.talk-dialog-footer,.ph-footer){flex-wrap:wrap;gap:8px}
 body.vm-admin :is(.talk-summary,.ph-dates){display:grid!important;grid-template-columns:1fr!important}
 body.vm-admin :is(.close-modal,.modal-close){min-width:44px;min-height:44px;display:flex;align-items:center;justify-content:center}
 body.vm-admin :is(.payment-table-scroll,.tp-table-wrap){overflow:visible!important}
 body.vm-admin table.vm-cards{display:block!important;width:100%!important;min-width:0!important;border-spacing:0!important}
 body.vm-admin table.vm-cards thead{display:block;width:100%}
 body.vm-admin table.vm-cards thead tr{display:flex;flex-wrap:wrap;gap:6px}
 body.vm-admin table.vm-cards thead th{display:none}
 body.vm-admin table.vm-cards thead th.vm-table-control{display:block!important;width:auto!important;padding:8px!important;background:transparent!important}
 body.vm-admin table.vm-cards tbody{display:block!important}
 body.vm-admin table.vm-cards tbody>tr{display:block!important;margin:12px 0!important;padding:10px!important;border:1px solid #cad2df;border-radius:12px;box-shadow:none!important;overflow:hidden}
 body.vm-admin table.vm-cards tbody>tr>td{display:flex!important;align-items:flex-start;gap:10px;padding:9px 2px!important;width:auto!important;max-width:none!important;min-width:0!important;white-space:normal!important;overflow-wrap:anywhere;border:0!important;text-align:left!important;border-radius:0!important;box-sizing:border-box}
 body.vm-admin table.vm-cards tbody>tr>td[data-vm-label]::before{content:attr(data-vm-label);flex:0 0 84px;font:600 12px/1.6 sans-serif;color:#78869c;white-space:normal}
 body.vm-admin table.vm-cards :is(input:not([type=checkbox]),select,textarea){width:100%!important;min-width:0!important;max-width:100%!important;flex:1}
 body.vm-admin table.vm-cards td>form{min-width:0;flex:1}
 body.vm-admin table.vm-cards td.vm-cell-actions{flex-wrap:wrap}
 body.vm-admin .sp-table{min-width:580px}.sp-table-wrap{max-width:100%;overflow:auto}
 body.vm-admin .sp-table input[type=checkbox]{width:24px;height:24px}
 body.vm-admin .tp-total{font-size:24px!important;overflow-wrap:anywhere}
 .fc .fc-toolbar{flex-wrap:wrap;gap:10px}.fc .fc-toolbar-title{font-size:1.25rem!important}
 .fc .fc-button{min-height:40px;font-size:13px!important}.fc .fc-list-event-title{white-space:normal;overflow-wrap:anywhere}
 .calendar-layout,.my-calendar-layout{grid-template-columns:minmax(0,1fr)!important;display:grid!important;width:100%!important;gap:18px!important}
 .calendar-pane,.list-pane,.my-calendar-pane,.my-period-pane{width:100%!important;min-width:0!important;box-sizing:border-box}
 .myclass-container{padding-left:12px!important;padding-right:12px!important}.profile{flex-wrap:wrap;gap:14px}
 .login-box{width:calc(100% - 24px)!important;max-width:440px;box-sizing:border-box;padding:24px 18px!important}.login-box .tabs{flex-wrap:wrap}.login-box input{font-size:16px!important}
 .vm-staff-home main{margin:24px auto!important;padding:16px!important}.vm-staff-home .footer{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){body.vm-admin .sidebar{transition:none}}
@media print{.vm-toolbar,.vm-backdrop,.vm-close{display:none!important}body.vm-admin{padding-top:0!important}}
.vm-calendar-switch{display:flex;gap:8px;flex-wrap:wrap;margin:12px 0}.vm-calendar-switch button{padding:10px 14px;min-height:44px;background:#182238;color:#fff;border:1px solid #52617d;border-radius:8px;cursor:pointer}.vm-calendar-switch button[aria-pressed=true]{background:#3b4fa3;border-color:#97a8ff}
@media print{.vm-calendar-switch{display:none}}
@media screen and (max-width:1199px){
 body.vm-admin{display:block!important;height:auto!important;min-height:100vh;overflow-x:clip!important;overflow-y:auto!important}
 body.vm-admin.vm-nav-open{overflow:hidden!important}
 body.vm-admin :is(.main-content,.sp-main,.ma-main,.tp-main.tp-admin){height:auto!important;min-height:calc(100vh - 96px);max-height:none!important;overflow:visible!important;flex:none!important;border-radius:14px!important}
}
@media screen and (min-width:1200px){.vm-filter>summary{display:none}.vm-filter{display:contents}}
@media screen and (max-width:767px){
 body.vm-admin table.vm-cards td>div{min-width:0!important;max-width:100%;flex-wrap:wrap;flex:1}
 body.vm-admin .modal-content form>.neon-btn{position:sticky;bottom:0;z-index:2;box-shadow:0 -6px 15px #ffffffcc}
 .vm-selection-summary{padding:12px;margin:12px 0;border:1px solid #7185b8;border-radius:10px;background:#eff4ff;color:#233b72;font-weight:700}
}
@media screen and (max-width:767px){body.vm-admin table.vm-cards button{min-width:44px;flex-shrink:0}}
@media screen and (max-width:767px){
 body.vm-admin table.sp-table.vm-cards tbody>tr>th{display:block;width:auto;padding:12px 4px;text-align:left;border:0}
 body.vm-admin table.sp-table.vm-cards tbody>tr>td{display:inline-flex!important;width:48%!important;align-items:center;vertical-align:top}
 body.vm-admin table.sp-table.vm-cards tbody>tr>td[data-vm-label]::before{flex:0 1 72px}
}
@media screen and (max-width:767px){body.vm-calendar-page .modal-content{width:calc(100% - 20px)!important;max-height:90vh;max-height:90dvh;overflow:auto;box-sizing:border-box;padding:24px 16px!important}body.vm-calendar-page .modal-content :is(input,textarea,select){font-size:16px!important;max-width:100%;box-sizing:border-box}}
