/* HSM 5.1.7 Mobile Professional Standard
   Purpose: Make public, staff, office, giving, mail, forms, tables, dashboards, and portals readable and usable on phones and tablets without removing desktop behavior. */

:root{
  --hsm-mobile-navy:#061b46;
  --hsm-mobile-blue:#082b68;
  --hsm-mobile-gold:#d9ad4f;
  --hsm-mobile-cream:#fffaf0;
  --hsm-mobile-text:#172033;
  --hsm-mobile-muted:#5c667a;
  --hsm-mobile-card:#ffffff;
  --hsm-mobile-line:rgba(8,43,104,.18);
}

html{box-sizing:border-box;-webkit-text-size-adjust:100%;text-size-adjust:100%;}
*,*::before,*::after{box-sizing:inherit;}
body{overflow-x:hidden;}
img,video,canvas,svg,iframe{max-width:100%;}
img{height:auto;}
iframe{border:0;}
input,select,textarea,button{font:inherit;max-width:100%;}
textarea{min-height:110px;}
button,a,input,select,textarea{touch-action:manipulation;}

/* Global readable containers */
.section,.container,.content,.page-wrap,.wrap,.card,.panel,.hsm-card,.hsm-panel,.admin-card,.office-card,.report-card,.receipt-card{
  overflow-wrap:anywhere;
  word-break:normal;
}

/* Tables become usable instead of crushed. */
.table-wrap,.hsm-table-wrap,.report-table-wrap,.finance-table-wrap,.admin-table-wrap,.mail-table-wrap{
  width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:14px;
}
table{max-width:100%;}
@media (max-width: 760px){
  table:not(.hsm-keep-table){display:block;width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;white-space:nowrap;}
  th,td{font-size:14px;line-height:1.35;padding:.65rem .7rem;vertical-align:top;}
}

/* Public website navigation and header */
@media (max-width: 900px){
  .top-inner,.brand-inner,.nav-inner{width:100%;max-width:100%;padding-left:16px;padding-right:16px;}
  .top-inner{gap:8px;flex-wrap:wrap;justify-content:center;text-align:center;}
  .top-actions{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;}
  .brand-inner{justify-content:center;text-align:center;}
  .brand-mark{gap:10px;justify-content:center;align-items:center;}
  .brand-mark img,.hsm-admin-brand img,.studio-logo img{width:clamp(54px,18vw,92px)!important;max-height:92px!important;object-fit:contain;}
  .brand-name{font-size:clamp(1.25rem,5vw,2rem);line-height:1.05;}
  .brand-tagline{font-size:.85rem;}
  .nav-toggle{display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin:10px auto;padding:10px 16px;border-radius:999px;}
  .nav-inner{display:none;flex-direction:column;align-items:stretch;gap:6px;padding-bottom:12px;}
  .nav-inner.open,.nav-inner[aria-expanded="true"],body.nav-open .nav-inner{display:flex;}
  .nav-inner a{display:flex;justify-content:center;min-height:44px;border-radius:12px;padding:12px 14px;text-align:center;}
}

/* General forms and giving forms */
@media (max-width: 820px){
  form,.hsm-form,.giving-form,.member-giving-form,.ministry-giving-form,.office-form{width:100%;}
  .form-row,.form-grid,.field-row,.input-row,.giving-row,.amount-row,.donor-row,.allocation-row,.office-grid,.admin-grid,.cards-grid,.quick-grid,.go-live-grid{
    display:grid!important;grid-template-columns:1fr!important;gap:12px!important;
  }
  label{line-height:1.25;}
  input[type="text"],input[type="email"],input[type="tel"],input[type="number"],input[type="password"],input[type="date"],input[type="time"],select,textarea{
    width:100%!important;min-height:46px;font-size:16px!important;line-height:1.35;border-radius:12px;
  }
  .amount-field,.giving-amount,input[name*="amount"],input[id*="amount"]{font-size:18px!important;font-weight:700;}
  .payment-options,.giving-options,.processor-options,.envelope-grid,.designation-grid,.allocation-grid{
    display:grid!important;grid-template-columns:1fr!important;gap:12px!important;
  }
  .payment-card,.giving-card,.processor-card,.envelope-card,.designation-card{
    min-width:0!important;width:100%!important;margin:0!important;padding:14px!important;border-radius:16px!important;
  }
  .payment-card img,.giving-card img,.qr-card img,.qr-code,.payment-qr{max-width:min(82vw,280px)!important;height:auto!important;margin-left:auto;margin-right:auto;display:block;}
  .fee-box,.processing-fee-box,.bank-processing-fee,.receipt-summary,.giving-summary{
    width:100%!important;margin:12px 0!important;padding:14px!important;border-radius:16px!important;overflow-wrap:anywhere;
  }
  .button-row,.form-actions,.command-actions,.actions{display:flex!important;flex-wrap:wrap!important;gap:10px!important;align-items:center;}
  .button-row > *,.form-actions > *,.command-actions > *,.actions > *{flex:1 1 160px;min-height:44px;}
}

@media (max-width: 520px){
  .section{padding:22px 14px!important;}
  h1{font-size:clamp(1.65rem,8vw,2.4rem)!important;line-height:1.08!important;}
  h2{font-size:clamp(1.35rem,6vw,1.9rem)!important;line-height:1.15!important;}
  h3{font-size:clamp(1.1rem,5vw,1.45rem)!important;}
  p,li{font-size:16px;line-height:1.55;}
  .card,.panel,.hsm-card,.hsm-panel,.admin-card,.office-card{padding:16px!important;border-radius:16px!important;}
}

/* Staff/back-office mobile layout */
@media (max-width: 1100px){
  .admin-layout,.hsm-admin-shell{display:block!important;min-height:100vh;}
  .admin-side,.hsm-admin-side{position:relative!important;width:100%!important;max-height:none!important;overflow:visible!important;border-right:0!important;border-bottom:1px solid rgba(8,43,104,.18);}
  .hsm-admin-nav{display:grid!important;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:12px;}
  .hsm-nav-group{min-width:0;}
  .admin-main,.hsm-admin-main{width:100%!important;min-width:0!important;}
  .admin-top,.hsm-admin-top{position:sticky;top:0;z-index:40;display:flex!important;flex-wrap:wrap!important;gap:12px!important;align-items:flex-start!important;padding:14px!important;}
  .hsm-top-actions{display:flex!important;flex-wrap:wrap!important;gap:8px!important;width:100%;}
  .hsm-top-actions > *{min-height:40px;}
}

@media (max-width: 700px){
  .hsm-admin-nav{grid-template-columns:1fr!important;}
  .hsm-nav-group a{min-height:42px;padding:10px 12px!important;border-radius:10px;}
  .hsm-staff-chip{width:100%;justify-content:center;text-align:center;}
  .hsm-alert-pill,.hsm-top-btn{flex:1 1 140px;text-align:center;justify-content:center;}
}

/* Webmail readability */
@media (max-width: 900px){
  .mail-layout,.webmail-layout,.hsm-mail-shell{display:grid!important;grid-template-columns:1fr!important;gap:12px!important;}
  .mail-sidebar,.mail-folders,.webmail-sidebar{width:100%!important;display:flex!important;overflow-x:auto!important;gap:8px!important;padding-bottom:8px;}
  .mail-sidebar a,.mail-folders a,.webmail-sidebar a{white-space:nowrap;min-height:42px;display:inline-flex;align-items:center;}
  .mail-list,.message-list,.inbox-list{max-height:none!important;overflow:visible!important;}
  .mail-reader,.message-reader,.email-reader{width:100%!important;min-height:55vh;overflow:auto!important;}
  .email-html-frame,.mail-html-frame{width:100%!important;min-height:60vh!important;}
}

/* Office portals and document/report pages */
@media (max-width: 900px){
  .office-shell,.office-workspace,.pastor-oversight,.trustee-shell,.secretary-office,.pam-office,.deacon-office{display:grid!important;grid-template-columns:1fr!important;gap:14px!important;}
  .office-sidebar,.office-nav{width:100%!important;display:flex!important;overflow-x:auto!important;gap:8px!important;}
  .office-sidebar a,.office-nav a{white-space:nowrap;min-height:42px;}
  .report-header,.receipt-header,.document-header{display:flex!important;flex-wrap:wrap!important;gap:12px!important;text-align:left!important;}
  .report-header img,.receipt-header img,.document-header img{width:clamp(70px,22vw,110px)!important;height:auto!important;object-fit:contain;}
  .signature-grid,.approval-grid{grid-template-columns:1fr!important;gap:18px!important;}
}

/* Broadcast Studio mobile protection: keep professional, usable, and no blind operation. */
@media (max-width: 1180px){
  .studio-shell-universe,.studio-main,.hsm-studio-command{min-height:100svh;}
  .command-grid{display:grid!important;grid-template-columns:1fr!important;overflow:auto!important;}
  .command-monitor-panel{width:100%!important;position:sticky!important;top:0;z-index:30;border-right:0!important;border-bottom:1px solid rgba(223,183,108,.28);padding:12px!important;background:rgba(6,9,19,.96);backdrop-filter:blur(18px);}
  .command-monitor-panel iframe,.video-frame-box{height:clamp(220px,42vh,420px)!important;min-height:220px!important;}
  .command-workspace{min-width:0!important;overflow:visible!important;}
  .command-topbar,.studio-top{height:auto!important;min-height:64px;display:flex!important;flex-wrap:wrap!important;gap:10px!important;padding:12px 14px!important;}
  .studio-global-feature-select{width:100%!important;display:grid!important;grid-template-columns:1fr auto!important;gap:8px!important;align-items:center!important;}
  .studio-feature-drawer{position:relative!important;display:grid!important;grid-template-columns:repeat(auto-fit,minmax(150px,1fr))!important;gap:8px!important;max-height:34vh!important;overflow:auto!important;padding:10px!important;}
  .studio-feature-drawer button,.studio-pinned-tools button{min-height:42px!important;white-space:normal!important;line-height:1.2!important;}
  .studio-pinned-tools{display:flex!important;overflow-x:auto!important;gap:8px!important;padding:8px 12px!important;}
  .studio-pinned-tools span{flex:0 0 auto;align-self:center;}
  .command-tab-panel{padding:12px!important;overflow:visible!important;}
  .command-tab-panel iframe{height:62vh!important;min-height:420px!important;}
}

@media (max-width: 700px){
  .studio-side{width:100%!important;display:flex!important;flex-direction:row!important;gap:8px!important;overflow-x:auto!important;padding:10px!important;border-right:0!important;border-bottom:1px solid rgba(223,183,108,.28);}
  .studio-side a,.studio-more-tools summary{white-space:nowrap;min-height:40px;}
  .side-seal{display:none!important;}
  .studio-main{width:100%!important;}
  .command-title span{display:block;font-size:12px;line-height:1.35;}
  .command-monitor-panel iframe,.video-frame-box{height:240px!important;}
  .studio-feature-drawer{grid-template-columns:1fr 1fr!important;max-height:42vh!important;}
  .command-tab-panel iframe{height:66vh!important;min-height:460px!important;}
}

@media (orientation: landscape) and (max-height: 560px){
  .command-monitor-panel iframe,.video-frame-box{height:170px!important;min-height:170px!important;}
  .command-topbar,.studio-top{padding:8px 12px!important;}
  .studio-feature-drawer{max-height:45vh!important;}
  .command-tab-panel iframe{height:70vh!important;min-height:320px!important;}
}

/* Print remains clean and not mobile-styled. */
@media print{
  body{background:#fff!important;color:#000!important;overflow:visible!important;}
  .admin-side,.hsm-admin-side,.nav,.topbar,.studio-side,.studio-feature-drawer,.studio-pinned-tools,.command-monitor-panel{display:none!important;}
  .admin-main,.hsm-admin-main,.studio-main{width:100%!important;display:block!important;overflow:visible!important;}
  .card,.panel,.hsm-card,.hsm-panel,.admin-card,.office-card{box-shadow:none!important;border:1px solid #ccc!important;}
}