/* Loyalty Studio — minimal base for AI-generated custom pages */
html {
  scroll-behavior: smooth;
}

body {
  margin: 0;
  font-family: var(--ls-body-font, system-ui, sans-serif);
  color: var(--ls-text, #1a1a1a);
  background: var(--ls-background, #ffffff);
  line-height: 1.6;
}

#site-content {
  display: block;
  margin: 0;
  padding: 0;
}

#site-content h1,
#site-content h2,
#site-content h3,
#site-content h4 {
  font-family: var(--ls-heading-font, system-ui, sans-serif);
}

#site-content img {
  max-width: 100%;
  height: auto;
}

#site-content a {
  color: var(--ls-primary, #2563eb);
}

#site-content .btn-primary,
#site-content [class*="btn-primary"] {
  background-color: var(--ls-btn-primary, var(--ls-primary, #2563eb));
  border-color: var(--ls-btn-primary, var(--ls-primary, #2563eb));
  color: var(--ls-btn-text, #ffffff);
}

#site-content .btn-secondary,
#site-content [class*="btn-secondary"] {
  background-color: var(--ls-btn-secondary, var(--ls-secondary, #6366f1));
  border-color: var(--ls-btn-secondary, var(--ls-secondary, #6366f1));
  color: var(--ls-btn-text-secondary, #1a1a1a);
}

/* Navigation safety for AI-generated Bootstrap navbars */
#site-content .navbar {
  z-index: 1030;
}

#site-content .navbar-collapse.show,
#site-content .navbar-collapse.collapsing {
  display: block;
}

@media (min-width: 992px) {
  #site-content .navbar-expand-lg .navbar-collapse {
    display: flex !important;
    flex-basis: auto;
  }

  #site-content .navbar-expand-lg .navbar-toggler {
    display: none;
  }
}

#site-content .navbar-nav .nav-link {
  color: var(--ls-text, #1a1a1a);
}

#site-content .navbar-brand,
#site-content .navbar-brand-text {
  color: var(--ls-text, #1a1a1a);
  font-weight: 700;
  text-decoration: none;
}

/* Editor: overlays must not block clicks */
#site-content .overlay,
#site-content .background-container {
  pointer-events: none;
}

#site-content .overlay *,
#site-content .background-container * {
  pointer-events: none;
}

/* Editor: neutralize AOS so text/images are clickable in Vvveb builder */
body.ls-editor-active #site-content [data-aos] {
  opacity: 1 !important;
  visibility: visible !important;
  transform: none !important;
  pointer-events: auto !important;
}

/* Published/preview: reveal AOS fade content if site script fails to load */
@keyframes ls-aos-publish-fallback {
  to {
    opacity: 1 !important;
    visibility: visible !important;
    transform: none !important;
  }
}

body:not(.ls-editor-active) #site-content [data-aos^="fade"]:not(.aos-animate),
body:not(.ls-editor-active) #site-content [data-aos^="zoom"]:not(.aos-animate) {
  animation: ls-aos-publish-fallback 0.01s 1.8s forwards;
}
