/* Shared UI corrections: checkbox sizing and phone/tablet resilience. */
html,body{max-width:100%;overflow-x:hidden}
.app,.main-wrapper,.content,.panel-page,.panel-card{min-width:0}

/* Generic modal input rules must never stretch checks and radios. */
input[type="checkbox"],input[type="radio"],
.panel-page input[type="checkbox"],.panel-page input[type="radio"],
.panel-dialog input[type="checkbox"],.panel-dialog input[type="radio"],
.dialog-shell input[type="checkbox"],.dialog-shell input[type="radio"]{
  box-sizing:border-box!important;
  width:18px!important;
  min-width:18px!important;
  max-width:18px!important;
  height:18px!important;
  min-height:18px!important;
  max-height:18px!important;
  margin:0!important;
  padding:0!important;
  border-radius:5px;
  accent-color:var(--panel-primary,#7442e8);
  flex:0 0 18px!important;
}
.check-row,.form-check,.checkbox-row{display:flex!important;grid-template-columns:none!important;align-items:center!important;justify-content:flex-start;gap:9px!important;min-height:38px;width:100%}
.check-row input+span,.form-check input+label{min-width:0}

/* Keep native/custom switch inputs visually hidden. */
.inventory-switch>input[type="checkbox"],.role-branch-options input[type="checkbox"]{position:absolute!important;width:1px!important;min-width:1px!important;height:1px!important;min-height:1px!important;opacity:0!important;pointer-events:none!important}

/* Dialogs must remain usable on short and narrow screens. */
.panel-dialog{max-width:calc(100vw - 24px)!important;max-height:calc(100dvh - 24px)!important;overflow:hidden!important}
.panel-dialog .dialog-shell{max-height:calc(100dvh - 24px);overflow:auto;overscroll-behavior:contain}
.panel-dialog .dialog-head{position:sticky;top:0;z-index:12;min-width:0}
.panel-dialog .dialog-head>div{min-width:0}
.panel-dialog .dialog-head h2,.panel-dialog .dialog-head small{overflow-wrap:anywhere}
.panel-dialog .dialog-actions{position:sticky;bottom:0;z-index:12;flex-wrap:wrap}
dialog:not(.novana-tour):not(.novana-tour-v2){max-width:calc(100vw - 24px);max-height:calc(100dvh - 24px)}

/* Any table wrapper can scroll instead of widening the complete page. */
.table-responsive,.panel-table-wrap,.pos-table-responsive,.responsive-table,.table-scroll{max-width:100%;overflow-x:auto!important;overscroll-behavior-inline:contain;-webkit-overflow-scrolling:touch}
.panel-table,.pos-invoice-table{max-width:none}
.expense-table-card{max-width:100%;overflow-x:auto!important}
img,svg,canvas,video{max-width:100%}

@media(max-width:900px){
  .content{padding-inline:16px!important}
  .panel-heading{align-items:flex-start!important;flex-direction:column!important}
  .panel-heading>div,.panel-heading .heading-actions{width:100%}
  .heading-actions{justify-content:flex-start}
  .panel-grid-2,.panel-grid-3,.detail-grid,.dashboard-grid{grid-template-columns:1fr!important}
  .stat-grid{grid-template-columns:repeat(2,minmax(0,1fr))!important}
  .form-grid,.form-row{min-width:0}
  .form-grid>*{min-width:0}
  .toolbar,.panel-toolbar{flex-wrap:wrap!important}
  .toolbar>*{min-width:0}
}

@media(max-width:640px){
  .content{padding:14px 10px 24px!important}
  .panel-page{gap:13px!important}
  .panel-heading h1{font-size:22px!important;line-height:1.5}
  .panel-heading p{font-size:12px;line-height:1.8}
  .heading-actions{display:grid!important;grid-template-columns:1fr!important;gap:8px!important}
  .heading-actions .btn,.heading-actions a,.heading-actions button{width:100%;justify-content:center}
  .stat-grid{grid-template-columns:1fr!important}
  .form-grid,.expense-form-grid,.role-tools-row{grid-template-columns:1fr!important}
  .form-grid .full,.expense-form-field.full{grid-column:auto!important}
  .panel-card{border-radius:14px!important}
  .panel-card-head{align-items:flex-start!important;flex-direction:column!important;gap:10px!important}
  .panel-card-head>button,.panel-card-head>.btn{width:100%}
  .panel-dialog{width:calc(100vw - 16px)!important;max-width:calc(100vw - 16px)!important;max-height:calc(100dvh - 16px)!important;border-radius:16px!important}
  .panel-dialog .dialog-shell{max-height:calc(100dvh - 16px)}
  .panel-dialog .dialog-head,.panel-dialog .form-grid,.panel-dialog .dialog-actions{padding-left:14px!important;padding-right:14px!important}
  .panel-dialog .dialog-actions{display:grid!important;grid-template-columns:1fr 1fr!important;gap:8px!important}
  .panel-dialog .dialog-actions .btn,.panel-dialog .dialog-actions button{width:100%;min-width:0!important}
  .table-responsive,.panel-table-wrap,.pos-table-responsive{margin-inline:0;max-width:100%}
  .panel-table,.pos-invoice-table{min-width:680px}
  .search-box{width:100%;min-width:0}
  .search-box input{min-width:0}
  .filter-row,.filters-row,.support-filters{flex-wrap:wrap!important}
  .pos-customer-grid{grid-template-columns:1fr!important}
  .pos-customer-info-box{grid-column:auto!important}
  .pos-footer-grid{grid-template-columns:1fr!important}
  .pos-actions-bar{display:grid!important;grid-template-columns:1fr!important}
  .pos-actions-bar .btn,.pos-actions-bar button{width:100%}
  .loyalty-customer-search,.loyalty-main .loyalty-customer-search{grid-template-columns:1fr!important}
  .loyalty-customer-search .form-row{align-items:stretch!important;flex-direction:column!important}
  .loyalty-customer-search .form-row>*{width:100%}
  .loyalty-action-tabs{grid-template-columns:1fr 1fr}
  .finance-kpi-grid,.inventory-history-stats,.crm-metrics{grid-template-columns:1fr!important}
  .calendar-week article{min-width:0}
  .site-builder{height:auto!important;min-height:100dvh!important;overflow:visible!important}
  .site-builder .sb-topbar{position:sticky;top:0;grid-template-columns:1fr auto!important;height:auto!important;min-height:62px;padding:10px!important}
  .site-builder .sb-brand div,.site-builder .sb-actions span{display:none!important}
  .site-builder .sb-actions{gap:5px}
  .site-builder .sb-actions button{padding:9px!important;font-size:11px}
  .site-builder .sb-workspace{display:grid!important;grid-template-columns:1fr!important;height:auto!important}
  .site-builder .sb-left{position:static!important;display:grid!important;grid-template-columns:62px 1fr!important;width:100%!important;max-height:310px;border:0;border-bottom:1px solid #e4e6ec}
  .site-builder .sb-panel{max-height:310px}
  .site-builder .sb-preview-area{min-height:70dvh;padding:10px!important}
  .site-builder .sb-frame{min-height:65dvh}
  .site-builder .sb-inspector{position:static!important;width:100%!important;max-height:none!important;box-shadow:none!important;border-top:1px solid #e4e6ec}
  .site-builder dialog{min-width:0!important;width:calc(100vw - 16px)!important;padding:16px!important}
}

@media(max-width:390px){
  .panel-dialog .dialog-actions{grid-template-columns:1fr!important}
  .content{padding-inline:8px!important}
  .btn{white-space:normal}
}