/* SCFA 360° Hub — Mobile App Hand-off
   Scoped hard to #scfaMah so nothing here can reach the theme. */

html.scfa-mah-on, html.scfa-mah-on body { overflow: hidden !important; }
html.scfa-mah-on #welcomeModal { display: none !important; }

#scfaMah, #scfaMah * { box-sizing: border-box; }

#scfaMah {
  position: fixed; inset: 0; z-index: 2147483000;
  display: flex; align-items: center; justify-content: center;
  padding: 20px calc(16px + env(safe-area-inset-right, 0px))
           calc(20px + env(safe-area-inset-bottom, 0px))
           calc(16px + env(safe-area-inset-left, 0px));
  background: rgba(11, 22, 46, .72);
  -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px);
  font-family: "Public Sans", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  overscroll-behavior: contain;
}

#scfaMah .mah-card {
  width: 100%; max-width: 400px; max-height: 100%;
  overflow-y: auto; -webkit-overflow-scrolling: touch;
  background: #fff; color: #16233d;
  border-radius: 20px; padding: 26px 22px 20px;
  box-shadow: 0 24px 60px rgba(6, 14, 32, .38);
  text-align: center;
  animation: mahIn .28s cubic-bezier(.2, .8, .3, 1) both;
}
@keyframes mahIn { from { opacity: 0; transform: translateY(14px) scale(.98); } }
@media (prefers-reduced-motion: reduce) { #scfaMah .mah-card { animation: none; } }

/* Coach Carla, styled to match her tips in /join and the Activation tour */
#scfaMah .mah-carla {
  display: flex; gap: 12px; align-items: flex-start;
  text-align: left; margin-bottom: 20px;
}
#scfaMah .mah-av {
  width: 54px; height: 54px; flex: none;
  border-radius: 50%; object-fit: cover;
  border: 3px solid #c8202f; background: #fff;
  box-shadow: 0 3px 10px rgba(29, 53, 87, .12);
}
#scfaMah .mah-bubble {
  flex: 1 1 auto; min-width: 0;
  background: #fff; border: 1.5px solid #e5eaf5;
  border-radius: 4px 16px 16px 16px;
  padding: 12px 14px;
  box-shadow: 0 4px 14px rgba(29, 53, 87, .07);
}
#scfaMah .mah-bubble .who {
  display: block; margin-bottom: 5px;
  font-size: 11px; font-weight: 800; letter-spacing: .08em;
  text-transform: uppercase; color: #c8202f;
}
#scfaMah .mah-bubble p { margin: 0 0 9px; font-size: 14.5px; line-height: 1.55; color: #46536b; }
#scfaMah .mah-bubble p:last-child { margin-bottom: 0; }
#scfaMah .mah-bubble b { color: #16233d; font-weight: 700; }

#scfaMah .mah-actions { display: flex; flex-direction: column; gap: 10px; margin-bottom: 16px; }

#scfaMah .mah-btn {
  display: block; width: 100%; padding: 15px 16px;
  font-family: inherit; font-size: 15.5px; font-weight: 700; line-height: 1.25;
  border-radius: 13px; border: 2px solid transparent; cursor: pointer;
  min-height: 52px; transition: transform .12s ease, box-shadow .12s ease;
  -webkit-appearance: none; appearance: none;
}
#scfaMah .mah-btn:active { transform: scale(.985); }
#scfaMah .mah-btn:focus-visible { outline: 3px solid #2f6df6; outline-offset: 2px; }

#scfaMah .mah-btn-primary {
  background: #c8202f; color: #fff;
  box-shadow: 0 6px 16px rgba(200, 32, 47, .3);
}
#scfaMah .mah-btn-ghost {
  background: #fff; color: #16233d; border-color: #d7dceb;
}

#scfaMah .mah-signin {
  margin: 0 0 14px; padding: 11px 12px;
  background: #f5f7fc; border: 1px solid #e5eaf5; border-radius: 11px;
  font-size: 13px; line-height: 1.5; color: #46536b; word-break: break-word;
}
#scfaMah .mah-signin b { color: #16233d; }

#scfaMah .mah-note { margin: 0 0 14px; font-size: 12.5px; line-height: 1.5; color: #6a7488; }

#scfaMah .mah-later {
  background: none; border: 0; padding: 8px 4px;
  font-family: inherit; font-size: 13.5px; font-weight: 600;
  color: #6a7488; text-decoration: underline; cursor: pointer; min-height: 44px;
}
#scfaMah .mah-later:focus-visible { outline: 3px solid #2f6df6; outline-offset: 2px; }

@media (max-height: 620px) {
  #scfaMah .mah-av { width: 44px; height: 44px; }
  #scfaMah .mah-carla { margin-bottom: 15px; }
  #scfaMah .mah-bubble p { font-size: 13.5px; }
}
