/* Attendance Management System v1.0.43 — consistent near edge-to-edge mobile content.
   Loaded AFTER v1.0.42 Home-fit stylesheet; scoped to staff app and plugin portal.
   All page-content changes are CSS only. Never hide content to create a no-scroll page. */
@media (max-width: 899px) {
  html:has(body.att-mobile-mode),
  body.att-mobile-mode { max-width:100%; overflow-x:clip; }

  /* Eliminate padding/max-width added by third-party WordPress theme containers. */
  body.att-mobile-mode :is(.site,.site-content,.site-main,.content-area,.entry-content,.wp-block-post-content,.inside-article,.elementor-widget-container,.wp-site-blocks,.ast-container) {
    width:100% !important; max-width:100% !important; min-width:0 !important;
    margin-inline:0 !important; padding-inline:0 !important; box-sizing:border-box !important;
  }
  body.att-mobile-mode .att-mobile-app,
  body.att-mobile-mode .att-mobile-app .att-mobile-shell {
    display:block; width:100% !important; max-width:100% !important; min-width:0 !important;
    margin-inline:0 !important; border-radius:0 !important; box-sizing:border-box !important;
  }
  /* The shell must remain flex for the Home no-scroll / content-fit logic. */
  body.att-mobile-mode .att-mobile-app .att-mobile-shell { display:flex !important; flex-direction:column !important; }
  body.att-mobile-mode .att-mobile-app .att-mobile-pagehead {
    width:100% !important; max-width:none !important; min-width:0 !important;
    margin-inline:0 !important;
    padding:12px max(8px,env(safe-area-inset-left,0px)) 7px max(8px,env(safe-area-inset-right,0px)) !important;
    box-sizing:border-box !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-pagehead :is(.att-mobile-title,.att-mobile-sub) {
    max-width:100% !important; overflow-wrap:anywhere !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body,
  body.att-mobile-mode .att-mobile-app.att-mobile-screen-home .att-mobile-body {
    width:100% !important; max-width:100% !important; min-width:0 !important;
    margin:0 !important;
    padding-left:max(7px,env(safe-area-inset-left,0px)) !important;
    padding-right:max(7px,env(safe-area-inset-right,0px)) !important;
    box-sizing:border-box !important;
  }
  /* Preserve the vertical fit controls on Home; long screens still scroll normally. */
  body.att-mobile-mode .att-mobile-app:not(.att-mobile-screen-home) .att-mobile-body {
    padding-top:9px !important;
    padding-bottom:calc(108px + env(safe-area-inset-bottom,0px)) !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(.att-wrap,.att-public,.att-mobile-cards,.att-card,.att-panel,.att-grid,.att-form,.att-field,.att-profile-scroll,.att-profile-card,.att-report-summary-grid,.att-absdoc-submitted,.att-notif-list,.att-notif-item,.att-table-wrap,.att-accordion,.att-event-tab-accordion,.att-location-card,.att-absdoc-tab-card) {
    min-width:0 !important; max-width:100% !important; box-sizing:border-box !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body > :is(.att-wrap,.att-card,.att-panel,.att-grid,.att-form,.att-notice,.att-alert) {
    width:100% !important; margin-left:0 !important; margin-right:0 !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-wrap {
    width:100% !important; max-width:none !important; margin-inline:0 !important; padding-inline:0 !important;
  }
  /* One consistent card system on check-in, report, notifications, documents and profile. */
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(.att-card,.att-panel):not(.att-home-card) {
    width:100% !important; max-width:none !important;
    margin-left:0 !important; margin-right:0 !important;
    padding:13px !important; border-radius:15px !important;
    box-sizing:border-box !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(.att-card-body,.att-panel-body) {
    min-width:0 !important; max-width:100% !important; padding-inline:0 !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(h1,h2,h3,h4) {
    max-width:100% !important; overflow-wrap:anywhere !important;
    line-height:1.35 !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(h2,h3) { font-size:17px !important; font-weight:600 !important; }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(p,.muted,.att-muted,.att-subtitle,li) {
    overflow-wrap:anywhere !important; line-height:1.5 !important;
  }
  /* All form fields use available card width without causing horizontal overflow. */
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(form,.att-form,.att-field,fieldset) {
    width:100% !important; min-width:0 !important; max-width:100% !important;
    box-sizing:border-box !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(input:not([type=checkbox]):not([type=radio]):not([type=hidden]),select,textarea,.att-input) {
    display:block; width:100% !important; min-width:0 !important; max-width:100% !important;
    border-radius:11px !important; box-sizing:border-box !important;
    font-size:16px !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(input:not([type=file]):not([type=checkbox]):not([type=radio]):not([type=hidden]),select) {
    min-height:46px !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body input[type=file] {
    height:auto !important; min-height:48px !important; padding:10px !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body textarea { min-height:105px !important; resize:vertical; }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(.att-actions,.att-absdoc-actions) {
    width:100% !important; max-width:100% !important; min-width:0 !important;
    box-sizing:border-box !important; gap:9px !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(.att-actions,.att-absdoc-actions) > :is(a,button,input[type=submit]) {
    max-width:100% !important; min-width:0 !important; box-sizing:border-box !important;
  }
  /* Reporting: full-width statistics and readable event accordions. */
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-report-summary-grid {
    width:100% !important; max-width:none !important; margin-inline:0 !important;
    grid-template-columns:repeat(3,minmax(0,1fr)) !important; gap:7px !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-report-summary-grid .att-report-stat-card {
    width:100% !important; min-width:0 !important; padding:11px 8px !important;
    margin:0 !important; border-radius:13px !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(.att-accordion,.att-event-tab-accordion,.att-event-tab-summary,.att-event-tab-body,.att-rowcard,.att-notif-item,.att-absdoc-tab-card,.att-absdoc-tab) {
    max-width:100% !important; min-width:0 !important; box-sizing:border-box !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(.att-event-tab-title,.att-notif-event-name,.att-notif-session-title,.att-absdoc-tab-title) {
    min-width:0 !important; overflow-wrap:anywhere !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-absdoc-tab { text-align:left !important; padding:13px 12px !important; }
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-absdoc-panel { padding:12px !important; }
  /* Wide attendance tables scroll within their own panel, never the whole document. */
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(.att-table-wrap,.att-byevent-table) {
    display:block; width:100% !important; max-width:100% !important;
    overflow-x:auto !important; -webkit-overflow-scrolling:touch;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-table-wrap .att-table {
    max-width:none !important;
  }
  /* Profile must show full field values, not cut off under a horizontal scrollbar. */
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-profile-scroll { width:100% !important; overflow-x:visible !important; }
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-profile-table {
    width:100% !important; min-width:0 !important; table-layout:fixed !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-profile-table :is(th,td) {
    white-space:normal !important; overflow-wrap:anywhere !important;
    padding:11px 7px !important; font-size:14px !important; text-align:left !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-profile-table th { width:34% !important; }
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-profile-table td { width:66% !important; }
  /* Check-in maps, image previews and embedded charts must never overrun the viewport. */
  body.att-mobile-mode .att-mobile-app .att-mobile-body :is(img,canvas,svg,video,iframe,.leaflet-container) {
    max-width:100% !important; box-sizing:border-box !important;
  }
  body.att-mobile-mode .att-mobile-app .att-mobile-nav { width:100% !important; max-width:100% !important; }

  /* Dark-mode surfaces for the newly unified cards. */
  html.att-dark-mode body.att-mobile-mode .att-mobile-app .att-mobile-body :is(.att-card,.att-panel):not(.att-home-card) {
    background:#20362e !important; color:#eaf4ec !important; border-color:#405649 !important;
  }
  html.att-dark-mode body.att-mobile-mode .att-mobile-app .att-mobile-body :is(input,select,textarea,.att-input) {
    background:#172a23 !important; color:#f0f6f1 !important; border-color:#486452 !important;
  }
}
@media (max-width:359px) {
  body.att-mobile-mode .att-mobile-app .att-mobile-body .att-report-summary-grid {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
  }
}
/* Plugin administration portal on phone/tablet: remove avoidable outer gutters only.
   Sidebar/topbar behavior and desktop portal styles stay unchanged. */
@media (max-width:899px) {
  body.att-portal .att-portal-main,
  body.att-portal .att-portal-content,
  body.att-portal .att-portal-container {
    min-width:0 !important; max-width:100% !important; box-sizing:border-box !important;
  }
  body.att-portal .att-portal-container {
    width:100% !important;
    margin-inline:0 !important;
    padding-left:max(8px,env(safe-area-inset-left,0px)) !important;
    padding-right:max(8px,env(safe-area-inset-right,0px)) !important;
  }
  body.att-portal .att-portal-container :is(.att-card,.att-panel,.att-wrap,.att-form) {
    min-width:0 !important; max-width:100% !important; box-sizing:border-box !important;
  }
}
/* The separate Attendance Login page follows the same full-width mobile gutters. */
@media (max-width:899px) {
  body.ams-attendance-login-page .ams-login-layout,
  body.ams-attendance-login-page .ams-login-panel {
    width:100% !important; max-width:100% !important; min-width:0 !important;
    box-sizing:border-box !important;
  }
  body.ams-attendance-login-page .ams-login-panel {
    padding-left:max(8px,env(safe-area-inset-left,0px)) !important;
    padding-right:max(8px,env(safe-area-inset-right,0px)) !important;
  }
  body.ams-attendance-login-page .ams-login-form-card {
    width:100% !important; max-width:100% !important; min-width:0 !important;
    margin-inline:0 !important; box-sizing:border-box !important;
  }
}
