/* Shared mobile presentation for pages opened from the Hub account menu. */
@media (max-width: 880px) {
  body.account-mobile { background: #f2f2f7 !important; }
  .account-mobile, .account-mobile :is(h1,h2,h3,p,a,button,input,select,label,span) {
    font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  }
  .account-mobile :is(.page,.page-perfil,.subs-dashboard) { padding: 16px 12px max(24px, env(safe-area-inset-bottom)); gap: 14px; }
  .account-mobile :is(.header,.perfil-header,.subs-header-container) { margin-bottom: 16px; gap: 12px; }
  .account-mobile :is(.header h1,.perfil-header-left h1,.subs-title-group h1) { font-size: 22px; line-height: 1.2; font-weight: 650; letter-spacing: -.03em; }
  .account-mobile :is(.header > p,.perfil-header-left > p,.subs-subtitle) { display: none; }
  .account-mobile :is(.back-btn,.btn-volver,.subs-back-link) { min-height: 44px; margin-bottom: 8px; display: inline-flex; align-items: center; }
  .account-mobile :is(.card,.card-perfil,.subs-card) { padding: 16px; border-radius: 16px; box-shadow: none; min-width: 0; }
  .account-mobile :is(.grid,.perfil-grid,.subs-grid,.form-grid-2) { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .account-mobile :is(.card-logo,.header-logo) { height: 32px; width: auto; }
  .account-mobile .card-header { margin-bottom: 12px; }
  .account-mobile :is(.security-block,.help-block,.webhook-block) { padding: 12px; gap: 10px; margin-block: 12px; }
  .account-mobile .help-block { flex-wrap: wrap; }
  .account-mobile :is(.status-msg,.configured-state,.webhook-url,.settings-value,.subs-detail-row-right) { overflow-wrap: anywhere; min-width: 0; }
  .account-mobile :is(input:not([type=checkbox]):not([type=radio]),select,textarea) { font-size: 16px !important; min-width: 0; max-width: 100%; }
  .account-mobile :is(button,.btn-primary,.btn-danger,.webhook-btn) { min-height: 44px; touch-action: manipulation; }
  .account-mobile .input-wrapper button { min-width: 44px; right: 4px; }
  .account-mobile .input-wrapper:has(button) input { padding-right: 52px; }
  .account-mobile :is(.perfil-header,.settings-row,.subs-header-container,.subs-facturas-header) { flex-wrap: wrap; }
  .account-mobile :is(.settings-row-right,.subs-support-top) { min-width: 0; max-width: 100%; }
  .account-mobile .avatar-preview { width: 64px; height: 64px; }
  .account-mobile :is(.subs-orange-icon-box,.subs-title-icon) { width: 36px; height: 36px; padding: 6px; }
  .account-mobile .subs-orange-icon-box svg { width: 24px; height: 24px; }
  .account-mobile .subs-detail-row { gap: 12px; }
  .account-mobile .actions-right { flex-wrap: wrap; gap: 10px; }
  .account-mobile .actions-right .btn-primary { width: 100%; }
  .account-mobile #profile-msg { margin-right: 0 !important; overflow-wrap: anywhere; }
}