/* ================================================
   fixes.css — SMBUXpro
   Link this LAST in index.html, after all other CSS:
   <link rel="stylesheet" href="fixed.css"/>
   ================================================ */


/* ── FIX 1: Hero video visible immediately ──────────────── */
.hero-video {
  opacity: 1 !important;
  transition: none !important;
  will-change: auto !important;
}


/* ── FIX 2: Notification bell — hidden on ALL screens ───── */
/* Bell is replaced by admin inbox / chat flow */
#navbar > div > button[onclick="toggleNotifPanel()"],
button[onclick="toggleNotifPanel()"] {
  display: none !important;
}


/* ── FIX 3: Chat widget — locked bottom-right always ───── */
#chat-btn {
  position: fixed !important;
  bottom: 24px !important;
  right: 24px !important;
  left: auto !important;
  top: auto !important;
  z-index: 9999 !important;
}
#chat-panel {
  position: fixed !important;
  bottom: 92px !important;
  right: 24px !important;
  left: auto !important;
  top: auto !important;
  z-index: 9998 !important;
  width: 320px !important;
  max-width: calc(100vw - 32px) !important;
}
@media (max-width: 768px) {
  #chat-btn {
    bottom: 16px !important;
    right: 16px !important;
  }
  #chat-panel {
    bottom: 80px !important;
    right: 8px !important;
    left: 8px !important;
    width: auto !important;
  }
}


/* ── FIX 4: REMOVE ALL scroll animations — every screen size ── */
/* Eliminates translateY/scale/opacity:0 on all elements globally */

.scroll-reveal,
.scroll-reveal-left,
.scroll-reveal-right,
.scroll-reveal.in-view,
.scroll-reveal-left.in-view,
.scroll-reveal-right.in-view,
.scroll-reveal.was-visible,
.scroll-reveal.was-visible:not(.in-view),
.scroll-reveal-left.was-visible:not(.in-view),
.scroll-reveal-right.was-visible:not(.in-view),
.hero-content.scroll-reveal,
.accounts-hero-content.scroll-reveal,
.stat-box.scroll-reveal,
.admin-stat-card.scroll-reveal,
.rev-stat-card.scroll-reveal,
.sb-item.scroll-reveal,
.feature-card.scroll-reveal,
.hiw-step.scroll-reveal,
.hiw-arrow.scroll-reveal,
.showcase-card.scroll-reveal,
.rticker-item.scroll-reveal,
.faq-item.scroll-reveal,
.howto-step.scroll-reveal,
.account-card.scroll-reveal,
.cta-banner.scroll-reveal,
.amp-preview-banner.scroll-reveal,
.how-it-works-banner.scroll-reveal,
.accounts-sell-cta.scroll-reveal,
.howto-cta.scroll-reveal,
.carousel-section.scroll-reveal,
.card.scroll-reveal,
.platform-showcase.scroll-reveal,
.stat-box.in-view,
.admin-stat-card.in-view,
.rev-stat-card.in-view,
.sb-item.in-view,
.hiw-step.in-view,
.showcase-card.in-view,
.rticker-item.in-view,
.howto-step.in-view,
.account-card.in-view {
  opacity: 1 !important;
  transform: none !important;
  transition: none !important;
  will-change: auto !important;
  animation: none !important;
  transition-delay: 0ms !important;
}

/* Kill stagger delay utilities */
.reveal-d1, .reveal-d2, .reveal-d3,
.reveal-d4, .reveal-d5, .reveal-d6 {
  transition-delay: 0ms !important;
}


/* ── FIX 5: Kill left-to-right shimmer/fade on mobile ───── */
/* These CSS animations trigger continuous GPU repaints which
   cause the hamburger nav to jitter and slide on small screens */
@media (max-width: 1199px) {

  /* Revenue ticker shimmer sweep */
  .revenue-ticker::after {
    display: none !important;
    animation: none !important;
    content: none !important;
  }
  @keyframes ticker-shimmer { 0%,100%{} }

  /* CTA banner pulsing glow */
  .cta-banner-inner::after {
    display: none !important;
    animation: none !important;
    content: none !important;
  }
  @keyframes pulse-glow { 0%,100%{} }

  /* How-it-works banner diagonal gradient overlay */
  .how-it-works-banner::before {
    display: none !important;
    content: none !important;
  }

  /* Features grid diagonal stripe */
  .features-grid::before {
    display: none !important;
    content: none !important;
  }

  /* Page background pseudo-elements with fixed positioning —
     these force constant compositing on mobile */
  .page-bg-services::before,
  .page-bg-order::before,
  .page-bg-track::before,
  .page-bg-track::after,
  .page-bg-accounts::before,
  .page-bg-howto::before,
  .page-bg-howto::after {
    display: none !important;
    content: none !important;
  }

  /* Kill any lingering CSS animations on the whole page */
  .revenue-ticker,
  .cta-banner-inner,
  .how-it-works-banner,
  .features-grid {
    isolation: auto !important;
    will-change: auto !important;
  }
}