/* Pro Max — phone layout (admin, agent, subscriber). Loaded last; remove its <link> in lib.php to undo. */
html,body{max-width:100%;overflow-x:hidden}
img,svg,video,canvas{max-width:100%}

@media (max-width:1000px){
  .wrap{margin-inline-start:0!important;width:100%!important;min-width:0}
  .side{z-index:60;overflow-y:auto;-webkit-overflow-scrolling:touch}
  .shade{z-index:55}
}

@media (max-width:760px){
  /* top bar */
  .topbar{padding:8px 10px!important;gap:6px!important;flex-wrap:nowrap}
  .topbar h1{font-size:16px!important;margin:0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;min-width:0;flex:0 1 auto}
  .topbar .tsearch{flex:1 1 auto;min-width:0;max-width:none}
  .topbar .tsearch input{min-width:0;width:100%;font-size:14px}
  .topbar .me>div{display:none}
  .topbar .me{gap:0}
  .ibtn{min-width:40px;min-height:40px}

  /* page */
  main{padding:14px 10px 32px!important}
  main h1{font-size:20px}
  .card,.sec,.c{padding:14px!important}

  /* tables scroll sideways instead of breaking the page */
  main table{display:block;width:100%;max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap}
  main table td,main table th{padding:8px 10px}
  .tbl{overflow-x:auto;-webkit-overflow-scrolling:touch}

  /* forms: big enough to tap, no iOS zoom */
  main input:not([type=checkbox]):not([type=radio]),main select,main textarea{font-size:16px!important;max-width:100%;min-height:42px;box-sizing:border-box}
  main button,main .btn,main input[type=submit]{min-height:42px}
  main form [style*="width:"]{max-width:100%}

  /* any inline multi-column grid -> 2 columns */
  main [style*="grid-template-columns"]{grid-template-columns:repeat(2,minmax(0,1fr))!important}

  /* new home pages (admin + agent) */
  .h2{gap:14px!important}
  .h2-top h1{font-size:19px!important}
  .h2-act{width:100%}
  .h2-act>*{flex:1 1 auto;justify-content:center}
  .h2-k,.h2-kw>.h2-k{grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:10px!important}
  .h2-k .v{font-size:22px!important}
  .h2-k .c .mu,.h2-k a .mu{font-size:12px}
  .h2-kw{flex-direction:column!important}
  .h2-g{flex:1 1 auto!important;order:-1}
  .h2-row{flex-direction:column}
  .h2-row>*{flex:1 1 auto!important;min-width:0;box-sizing:border-box;max-width:100%}
  .h2-alert{font-size:13px;padding:10px 12px}
}

@media (max-width:420px){
  .h2-k,.h2-kw>.h2-k{grid-template-columns:1fr 1fr!important}
  .h2-k .hd .ic,.h2-k .hd .ic2{width:30px!important;height:30px!important}
  main [style*="grid-template-columns"]{grid-template-columns:1fr!important}
  .topbar h1{display:none}
}

/* MFIX-1: mobile layout guards */
html,body{max-width:100%;overflow-x:clip}
main.plain{grid-template-columns:minmax(0,1fr)!important}
main.plain>*{min-width:0;max-width:100%;box-sizing:border-box}
#pmxAppCard,#pmxDash{max-width:100%;box-sizing:border-box}
#pmxAppCard a,#pmxDash span{white-space:normal}
img,video,iframe{max-width:100%}

/* MFIX-2 agent action cards */ form.form>*,label.full,label.full>span{min-width:0;max-width:100%}label.full>span{display:flex;gap:6px}label.full>span>input{min-width:0;width:auto;flex:1 1 0}.card input,.card select{max-width:100%;min-width:0;box-sizing:border-box}
