/*
  NGFIT snippet (migrated from WPCode)
  id: 157
  title: NGFIT — Mobile Polish (Dashboards)
  code_type: css
  location: site_wide_header
  auto_insert: 1
  insert_number: 1
  priority: 10
  tags: []
  note: 
  modified: 2026-05-30 23:39:36
*/
/* Tab panels: make the synchronous .active class authoritative so racing inline display styles (spinner/transition scripts) cannot leave a panel blank after fast tab switching. */
.ngfit-panel.active{display:block!important;}
.ngfit-panel:not(.active){display:none!important;}
/* Member own dashboard (not staff drawer): drop the empty staff-only CLIENT column from the Compass hero, center the dial, hide the generic tile placeholder. */
body.page-id-19 .ngfit-compass-bigwrap{grid-template-columns:1fr!important;}
body.page-id-19 .ngfit-compass-divider,body.page-id-19 .ngfit-compass-col.col-client{display:none!important;}

/* GLOBAL: Compass hero tile must grow to its content so the dial+score never overflow onto the pillar tiles (fixes score overlapping tiles after a tab switch, mobile + desktop). */
.ngfit-compass-grid .ngfit-compass-tile.tile-compass{height:auto!important;}

/* NGFIT - Mobile Polish for staff + member dashboards. CSS-only, reversible. Scoped to <=768px so desktop is untouched. */
@media (max-width:768px){
  .ngfit-page,.ngfit-staff{overflow-x:hidden}
  .ngfit-page *,.ngfit-staff *{box-sizing:border-box}
  .ngfit-nav-pair{top:10px!important;left:10px!important}
  header.ngfit-dash-header{flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center;gap:14px;padding:64px 16px 18px!important}
  .ngfit-dash-logo{display:block;margin:0 auto!important;text-align:center;max-width:100%}
  .ngfit-dash-logo img{margin:0 auto;height:auto;max-width:210px}
  .ngfit-dash-user{flex-direction:column!important;align-items:center!important;justify-content:center!important;text-align:center;gap:10px;width:100%}
  .ngfit-dash-avatar{margin:0 auto!important}
  .ngfit-dash-user .ngfit-dash-actions{justify-content:center!important;flex-wrap:wrap;gap:10px}
  .ngfit-dash-edit-profile{min-height:40px;display:inline-flex;align-items:center}
  nav.ngfit-dash-tabs{flex-wrap:wrap!important;justify-content:center!important;align-items:center;overflow:visible!important;height:auto!important;gap:4px 14px;padding:8px 10px}
  nav.ngfit-dash-tabs>*{flex:0 0 auto;white-space:nowrap}
  .ngfit-pt-toolbar{flex-wrap:wrap!important;justify-content:center;width:100%;max-width:100%}
  .ngfit-pt-toolbar .ngfit-pt-win{flex:1 1 0!important;text-align:center;min-width:0}
  .ngfit-nut-totals{gap:10px}
  .ngfit-nut-totals .ngfit-nut-tot{flex:1 1 calc(50% - 5px)!important;min-width:calc(50% - 5px)}
  .ngfit-nut-searchrow{flex-wrap:wrap!important;gap:8px}
  .ngfit-nut-searchrow input{flex:1 1 100%!important;min-width:0}
  .ngfit-nut-searchrow button{flex:1 1 auto}
  .ngfit-staff-head{flex-direction:column!important;align-items:stretch!important;gap:12px}
  .ngfit-staff-head>div{flex-wrap:wrap;gap:10px}
  .ngfit-staff-head>div>a,.ngfit-staff-head>div>button,.ngfit-staff-head>div>form{flex:1 1 0;min-width:0}
  .ngfit-staff-head>div>form>button{width:100%}
  .ngfit-staff-search{flex-wrap:wrap!important;gap:8px;align-items:center}
  .ngfit-staff-search input{flex:1 1 100%!important;min-width:0}
}
@media (max-width:480px){
  header.ngfit-dash-header{padding-top:60px!important}
  .ngfit-dash-logo img{max-width:185px}
  nav.ngfit-dash-tabs{gap:4px 10px}
}
