/* ──────────────────────────────────────────────────────────────────────────────
   mobile-footer-controller-v3.css — Task #1589511
   Owns: mobile bottom-bar suppression classes, Crisp offset, tab-bar clearance.
   Does NOT own: individual bar styling, desktop layout, overlay/modal z-index.
   ────────────────────────────────────────────────────────────────────────────── */

/* ── Mobile only (< 768px) ─────────────────────────────────────────────────── */
@media (max-width: 767px) {

  /* Bars that sit at bottom:0 need to clear the mobile tab bar (64px) */
  #sr-live-ticker,
  .sr-nudge-bar,
  #sr-mobile-cta-bar,
  #sr-sticky-mobile-cta,
  #sr-mobile-sticky-cta,
  #sr-pro-sticky-bar,
  #srProNudgeBar,
  #srProUpsellBanner,
  .sr-scta-bar,
  #sr-smart-cta-bar,
  #srLspMobileBar,
  .sticky-filing-bar,
  #stickyFilingBar,
  #compareFloatBar {
    bottom: calc(64px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Resume banner — positioned slightly higher (above tab bar + breathing room) */
  #srResumeBanner,
  #srResumeBanner.hp-resume-banner {
    bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* WHY: elements hidden by the mobile footer controller v3 get this class as
     a CSS backup. The JS also sets inline display:none!important which alone
     should be sufficient, but the belt-and-suspenders approach guarantees the
     element is hidden even if another script strips inline styles. */
  .sr-mfc-hidden {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    max-height: 0 !important;
    padding: 0 !important;
    margin: 0 !important;
    border: none !important;
  }

  /* Elements marked with data-mfc-hidden attribute (v3 primary marker) */
  [data-mfc-hidden] {
    display: none !important;
    visibility: hidden !important;
    pointer-events: none !important;
    height: 0 !important;
    overflow: hidden !important;
    opacity: 0 !important;
    max-height: 0 !important;
  }

  /* Crisp chat bubble — offset above tab bar so it doesn't sit on nav */
  #crisp-chatbox {
    bottom: calc(68px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Back-to-top button — offset above tab bar */
  .sr-back-to-top-v2,
  #srBackToTop {
    bottom: calc(80px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* When a bottom bar is active, push Crisp + back-to-top higher */
  body.sr-mfc-bar-active #crisp-chatbox {
    bottom: calc(130px + env(safe-area-inset-bottom, 0px)) !important;
  }

  body.sr-mfc-bar-active .sr-back-to-top-v2,
  body.sr-mfc-bar-active #srBackToTop {
    bottom: calc(130px + env(safe-area-inset-bottom, 0px)) !important;
  }

  /* Resume banner dismiss button — guaranteed clickable */
  #srResumeBanner [aria-label*="dismiss"],
  #srResumeBanner [aria-label*="close"],
  #srResumeBanner .hp-resume-banner__close,
  #srResumeDismiss {
    pointer-events: auto !important;
    cursor: pointer !important;
    z-index: 99999 !important;
    position: relative !important;
    touch-action: manipulation !important;
    min-width: 44px !important;
    min-height: 44px !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  /* Override body padding-bottom from live ticker when it's suppressed */
  body.sr-mfc-ticker-hidden {
    padding-bottom: 0 !important;
  }

  /* Suppress expanded Crisp chat panels (keep bubble only) */
  #crisp-chatbox [data-full-view="true"],
  #crisp-chatbox .cc-1oun,
  #crisp-chatbox .cc-kegp {
    display: none !important;
  }
}

/* ── Desktop (>= 768px): controller inactive, don't suppress anything ─────── */
@media (min-width: 768px) {
  .sr-mfc-hidden,
  [data-mfc-hidden] {
    /* No suppression on desktop — popups can coexist normally */
  }
}
