/* Dance School Manager responsive layer.
 * The viewport names match WordPress 7.1 responsive block styles:
 * mobile <=480px and tablet >480px <=782px. */
.dsm-design-system,.dsm-admin,.dsm-registration-shell,.students-pwa,.student-pwa-login,.student-pwa-denied,#school-teachers-app,.stpwa-login,.stpwa-denied{min-width:0;overflow-wrap:anywhere}
.dsm-portal{min-width:0;overflow-wrap:break-word}
.dsm-design-system :is(img,svg,video,canvas,iframe),.dsm-admin :is(img,svg,video,canvas,iframe),.dsm-portal :is(img,svg,video,canvas,iframe),.dsm-registration-shell :is(img,svg,video,canvas,iframe),.students-pwa :is(img,svg,video,canvas,iframe),#school-teachers-app :is(img,svg,video,canvas,iframe){max-width:100%;height:auto}
.dsm-portal :is(.dsm-portal-card,.dsm-app-panel,.dsm-app-kpi,.dsm-app-action,.dsm-portal-welcome),.dsm-admin :is(.dsm-card,.dsm-panel),.students-pwa :is(.student-pwa-card,.student-pwa-list>div),#school-teachers-app :is(.stpwa-card,.stpwa-panel){min-width:0}
.dsm-table-scroll,.dsm-portal-table-wrap,.dsm-directory-table-wrap,.dsm-teacher-directory-table-wrap,.dsm-attendance-table-wrap,.dsm-aif-table-wrap,.student-pwa-table-wrap{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}

@media (width <= 782px){
  .dsm-portal{width:calc(100% - 24px);max-width:none;margin:var(--space-4) auto;padding:var(--space-3)}
  .dsm-portal-header,.dsm-portal .dsm-app-panel{padding:var(--space-5)}
  .dsm-app-dashboard-grid,.dsm-app-dashboard-grid--lower{grid-template-columns:minmax(0,1fr)}
  .dsm-app-kpi-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dsm-app-page-header,.dsm-app-panel-head{flex-wrap:wrap}
  .dsm-portal-nav{flex-wrap:nowrap;max-width:100%;overflow-x:auto;overflow-y:hidden;scrollbar-width:thin}
  .dsm-portal-nav a{flex:0 0 auto}
  .dsm-portal :is(.dsm-portal-form,.dsm-task-form,.dsm-portal-send-form,.dsm-portal-whatsapp-form){grid-template-columns:repeat(2,minmax(0,1fr))}
  .dsm-admin{max-width:100%;margin-right:12px}
  #school-teachers-app,.stpwa-login,.stpwa-denied{width:100%;max-width:100%;padding-right:clamp(14px,4vw,28px);padding-left:clamp(14px,4vw,28px)}
}

@media (width <= 480px){
  .dsm-portal{width:100%;margin:0;padding:var(--space-2);border-right:0;border-left:0;border-radius:0;box-shadow:none}
  .dsm-portal-header,.dsm-portal .dsm-app-panel{padding:var(--space-4);border-radius:var(--radius-md)}
  .dsm-app-kpi-grid,.dsm-app-action-grid{grid-template-columns:minmax(0,1fr)}
  .dsm-app-page-header,.dsm-app-panel-head{align-items:stretch;flex-direction:column;gap:var(--space-3)}
  .dsm-app-panel-head a,.dsm-app-page-header .dsm-button,.dsm-app-page-header .button{width:100%}
  .dsm-portal :is(.dsm-portal-form,.dsm-task-form,.dsm-portal-send-form,.dsm-portal-whatsapp-form){grid-template-columns:minmax(0,1fr)}
  .dsm-portal :is(.dsm-portal-inline-actions,.dsm-payment-actions,.dsm-qr-actions,.dsm-task-form-actions,.dsm-aif-actions){align-items:stretch;flex-direction:column}
  .dsm-portal :is(.dsm-portal-inline-actions,.dsm-payment-actions,.dsm-qr-actions,.dsm-task-form-actions,.dsm-aif-actions) :is(a,button,.button){width:100%;max-width:none}
  .dsm-admin{margin-right:6px;margin-left:0;padding-right:8px;padding-left:8px}
  .dsm-admin .dsm-header-actions{width:100%;align-items:stretch;flex-direction:column}
  .dsm-admin .dsm-header-actions :is(a,button,.button){width:100%}
  .dsm-registration-shell{width:auto!important;margin:0 -8px 12px!important;padding:6px!important}
  .dsm-registration-shell .dsm-registration-section,.dsm-registration-shell .dsm-registration-consent{padding:16px;border-radius:14px}
  .dsm-registration-shell .dsm-registration-section-heading{gap:9px}
  .students-pwa,.student-pwa-login,.student-pwa-denied{padding-right:14px;padding-left:14px}
  .student-pwa-card{padding:17px}
  .student-pwa-table{min-width:520px}
  #school-teachers-app,.stpwa-login,.stpwa-denied{padding-right:12px;padding-left:12px}
  .stpwa-nav{max-width:100%;overflow-x:auto}
  .dsm-table-scroll,.dsm-portal-table-wrap,.dsm-directory-table-wrap,.dsm-teacher-directory-table-wrap,.dsm-attendance-table-wrap,.dsm-aif-table-wrap,.student-pwa-table-wrap{margin-right:calc(var(--space-4) * -1);margin-left:calc(var(--space-4) * -1);padding-right:var(--space-4);padding-left:var(--space-4)}
}
