/* Secure24 mobile navigation/report-layout hardening. Additive only. */
html,body{max-width:100%;overflow-x:hidden}
#content,.card,.section-head,.table-wrap,.mobile-records,.record-card,.report-dashboard,.report-filters,.reports-dashboard{max-width:100%;min-width:0}
#content *{min-width:0}

/* Keep wide report tables contained instead of widening the whole phone page. */
.table-wrap{width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch}
.table-wrap table{max-width:none}

@media(max-width:650px){
  main,#content{width:100%;max-width:100%;overflow-x:hidden}
  #content>.card,#content>.section-head,#content>.table-wrap,#content>.mobile-records{width:100%;max-width:100%}
  #content input,#content select,#content textarea,#content button{max-width:100%}

  /* Reports: stack controls/cards and stop controls from exceeding viewport. */
  .report-filters,.reports-filters,.report-filter-grid,.reports-filter-grid,
  .report-summary,.reports-summary,.report-kpis,.reports-kpis,
  .report-grid,.reports-grid{display:grid!important;grid-template-columns:1fr!important;width:100%!important;max-width:100%!important;gap:12px!important}
  .report-filters label,.reports-filters label,.report-filter-grid label,.reports-filter-grid label{width:100%!important;max-width:100%!important}
  .report-filters input,.report-filters select,.reports-filters input,.reports-filters select,
  .report-filter-grid input,.report-filter-grid select,.reports-filter-grid input,.reports-filter-grid select{width:100%!important;max-width:100%!important}
  .report-filters button,.reports-filters button,.report-filter-grid button,.reports-filter-grid button{width:100%!important;max-width:100%!important}

  /* Modal/forms become a deliberate mobile workspace below the fixed app header. */
  .modal{padding:0!important;align-items:flex-start!important;overflow:hidden!important}
  .modal-card{position:relative!important;width:100%!important;max-width:100%!important;height:calc(100dvh - 112px)!important;max-height:calc(100dvh - 112px)!important;margin:112px 0 0!important;border-radius:18px 18px 0 0!important;padding:0!important;overflow:auto!important;overscroll-behavior:contain;background:#fff}
  .modal-head{position:sticky!important;top:0!important;z-index:12!important;display:grid!important;grid-template-columns:auto 1fr auto!important;align-items:center!important;gap:10px!important;padding:13px 14px!important;background:#fff!important;border-bottom:1px solid #dbe3e8!important;box-shadow:0 4px 12px rgba(15,45,38,.06)}
  .modal-head h3{grid-column:2;margin:0!important;text-align:center;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
  .modal-head .close{grid-column:3;position:static!important;width:42px!important;height:42px!important;min-width:42px!important;border-radius:12px!important;font-size:1.6rem!important;line-height:1!important;display:grid!important;place-items:center!important}
  .secure24-form-back{grid-column:1;width:42px!important;height:42px!important;min-width:42px!important;padding:0!important;border:1px solid #cdd9d5!important;border-radius:12px!important;background:#f6faf8!important;color:#103f35!important;font-size:1.4rem!important;font-weight:800!important;display:grid!important;place-items:center!important}
  #modalForm{padding:18px 16px 96px!important;width:100%!important;max-width:100%!important;overflow-x:hidden!important}
  #modalForm label,#modalForm input,#modalForm select,#modalForm textarea{width:100%!important;max-width:100%!important}
  #modalForm .full{grid-column:1/-1!important}

  /* Floating communications controls must not obscure primary mobile form actions. */
  body:not(.modal-open) #secure24CommsDock{display:flex}
  body.modal-open #secure24CommsDock{opacity:.18!important;pointer-events:none!important}
}