/* ABCD Login Interactions Fix - loaded after theme/custom CSS */

.reward-modal {
  visibility: hidden !important;
  pointer-events: none !important;
}

.reward-modal.open,
.reward-modal.abcd-open {
  visibility: visible !important;
  pointer-events: auto !important;
  opacity: 1 !important;
}

.reward-modal.open .reward-modal-backdrop,
.reward-modal.abcd-open .reward-modal-backdrop {
  opacity: 1 !important;
}

.reward-modal.open .reward-modal-content,
.reward-modal.abcd-open .reward-modal-content {
  opacity: 1 !important;
  transform: translateY(0) scale(1) !important;
}

.abcd-reward-card[hidden],
.abcd-reward-card.abcd-hidden {
  display: none !important;
}

.abcd-reward-card {
  display: flex !important;
}

.filter-tab,
.abcd-reward-btn,
.faq-question,
.abcd-back-to-top {
  pointer-events: auto !important;
  cursor: pointer !important;
}

/* Hide the original theme/link back-to-top. It was inheriting a grey square. */
#back-to-top-btn.abcd-back-to-top,
a.abcd-back-to-top,
.generate-back-to-top,
.gp-back-to-top,
.scroll-to-top,
.go-to-top,
.back-to-top:not(#abcd-floating-top-fix) {
  display: none !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
}

#abcd-floating-top-fix {
  all: unset !important;
  position: fixed !important;
  right: 20px !important;
  bottom: 20px !important;
  z-index: 2147483647 !important;
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  min-height: 58px !important;
  padding: 0 !important;
  margin: 0 !important;
  display: grid !important;
  place-items: center !important;
  box-sizing: border-box !important;
  border: 1px solid rgba(255,255,255,.72) !important;
  border-radius: 999px !important;
  background: #1d6fb8 !important;
  background-color: #1d6fb8 !important;
  background-image: none !important;
  color: #ffffff !important;
  box-shadow: 0 12px 30px rgba(20,61,121,.30) !important;
  opacity: 0 !important;
  visibility: hidden !important;
  pointer-events: none !important;
  transform: translateY(10px) scale(.88) !important;
  transition: opacity .22s ease, transform .22s ease, visibility .22s ease, background-color .18s ease !important;
  outline: 0 !important;
  appearance: none !important;
  -webkit-appearance: none !important;
  -webkit-tap-highlight-color: transparent !important;
  user-select: none !important;
  -webkit-user-select: none !important;
  cursor: pointer !important;
}

#abcd-floating-top-fix.abcd-show {
  opacity: 1 !important;
  visibility: visible !important;
  pointer-events: auto !important;
  transform: translateY(0) scale(1) !important;
}

#abcd-floating-top-fix:hover,
#abcd-floating-top-fix:focus,
#abcd-floating-top-fix:focus-visible,
#abcd-floating-top-fix:active {
  background: #0e2f61 !important;
  background-color: #0e2f61 !important;
  outline: 0 !important;
  box-shadow: 0 14px 30px rgba(20,61,121,.32) !important;
}

#abcd-floating-top-fix,
#abcd-floating-top-fix *,
#abcd-floating-top-fix::before,
#abcd-floating-top-fix::after {
  box-sizing: border-box !important;
}

#abcd-floating-top-fix .abcd-floating-top-arrow {
  display: block !important;
  width: 14px !important;
  height: 14px !important;
  border-left: 3px solid #ffffff !important;
  border-top: 3px solid #ffffff !important;
  transform: rotate(45deg) translate(2px, 2px) !important;
  pointer-events: none !important;
}

#abcd-floating-top-fix::before {
  content: none !important;
  display: none !important;
}

#abcd-floating-top-fix::after {
  content: none !important;
  display: none !important;
}

/* Extra mobile kill-switch for the old link, in case mobile Custom CSS loads later. */
@media (max-width: 768px) {
  #back-to-top-btn.abcd-back-to-top,
  a#back-to-top-btn,
  a.abcd-back-to-top {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
    overflow: hidden !important;
    background: transparent !important;
    box-shadow: none !important;
    border: 0 !important;
  }

  #abcd-floating-top-fix {
    right: 13px !important;
    bottom: 13px !important;
    width: 58px !important;
    height: 58px !important;
    min-width: 58px !important;
    min-height: 58px !important;
    max-width: 58px !important;
    max-height: 58px !important;
    border-radius: 999px !important;
    background: #1d6fb8 !important;
    background-color: #1d6fb8 !important;
  }
}

.abcd-faq-item.active .faq-answer,
.abcd-faq-item.abcd-open .faq-answer {
  opacity: 1 !important;
}

.calc-meter-fill {
  transition: width .24s ease !important;
}

/* Mobile Safari paint stability.
   Prevents temporary blank sections while scrolling on iPhone. */
@media (max-width: 768px) {
  html.abcd-mobile-stable,
  body.abcd-mobile-stable {
    overflow-x: hidden !important;
    min-height: 100% !important;
  }

  .abcd-mobile-stable .custom-cint-login-page,
  .abcd-mobile-stable #abcd-panel-wrapper,
  .abcd-mobile-stable #abcd-account-v2,
  .abcd-mobile-stable .abcd-topbar,
  .abcd-mobile-stable .abcd-main,
  .abcd-mobile-stable .abcd-account-card,
  .abcd-mobile-stable .abcd-rewards,
  .abcd-mobile-stable .abcd-calc-section,
  .abcd-mobile-stable .abcd-member-notes,
  .abcd-mobile-stable .abcd-faq,
  .abcd-mobile-stable .abcd-support,
  .abcd-mobile-stable .abcd-footer,
  .abcd-mobile-stable .abcd-new-donations-strip,
  .abcd-mobile-stable .abcd-reward-card,
  .abcd-mobile-stable .points-calc-widget {
    opacity: 1 !important;
    visibility: visible !important;
    animation: none !important;
    transform: none !important;
    -webkit-transform: none !important;
    backface-visibility: visible !important;
    -webkit-backface-visibility: visible !important;
    contain: none !important;
    content-visibility: visible !important;
    will-change: auto !important;
  }

  .abcd-mobile-stable .abcd-brand-logo,
  .abcd-mobile-stable .theme-toggle,
  .abcd-mobile-stable .menu-toggle,
  .abcd-mobile-stable .abcd-glow-blob {
    animation-play-state: running !important;
  }

  .abcd-mobile-stable .abcd-topbar,
  .abcd-mobile-stable .abcd-account-card,
  .abcd-mobile-stable .abcd-rewards,
  .abcd-mobile-stable .abcd-calc-section,
  .abcd-mobile-stable .abcd-member-notes,
  .abcd-mobile-stable .abcd-faq,
  .abcd-mobile-stable .abcd-support,
  .abcd-mobile-stable .points-calc-widget,
  .abcd-mobile-stable .reward-modal-content {
    backdrop-filter: none !important;
    -webkit-backdrop-filter: none !important;
  }

  .abcd-mobile-stable .abcd-rewards {
    min-height: auto !important;
    overflow: visible !important;
  }

  .abcd-mobile-stable .reward-filters,
  .abcd-mobile-stable .abcd-rewards-cards-container {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }

  .abcd-mobile-stable .abcd-reward-card:not(.abcd-hidden):not([hidden]) {
    display: flex !important;
  }

  html.abcd-mobile-stable,
  body.abcd-mobile-stable,
  .abcd-mobile-stable .custom-cint-login-page,
  .abcd-mobile-stable #abcd-account-v2 {
    background-attachment: scroll !important;
  }

  .abcd-mobile-stable .generate-back-to-top,
  .abcd-mobile-stable .gp-back-to-top,
  .abcd-mobile-stable .scroll-to-top,
  .abcd-mobile-stable .go-to-top,
  .abcd-mobile-stable .back-to-top:not(#abcd-floating-top-fix) {
    display: none !important;
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    width: 0 !important;
    height: 0 !important;
    min-width: 0 !important;
    min-height: 0 !important;
  }

  #abcd-floating-top-fix {
    right: 16px !important;
    bottom: 16px !important;
  }
}

[data-theme="dark"] #abcd-floating-top-fix,
body[data-theme="dark"] #abcd-floating-top-fix {
  background: #1d6fb8 !important;
  background-color: #1d6fb8 !important;
  border-color: rgba(96,165,250,.42) !important;
  box-shadow: 0 12px 28px rgba(0,0,0,.38) !important;
}
