.nav-logo span,
.footer-logo span,
.tm-global-logo span,
.tm-logo span,
.auth-brand-logo span,
.auth-logo span,
.legal-nav-logo span,
.reset-logo span,
.verify-logo span,
.loader-logo span,
.ss-brand-text em,
[data-brand-logo] span {
  color: var(--brand-primary) !important;
  text-shadow: 0 0 16px rgba(var(--brand-primary-rgb), 0.35) !important;
}

.btn-primary,
.btn-start,
.btn-cta,
.mobile-start-btn,
.ss-btn-primary,
.tm-primary-btn,
.cc-qa.primary {
  background-image: linear-gradient(135deg, var(--brand-primary), var(--brand-accent)) !important;
  background-color: transparent !important;
  color: #ffffff !important;
  border-color: transparent !important;
}
.btn-primary:hover,
.btn-start:hover,
.btn-cta:hover,
.mobile-start-btn:hover,
.ss-btn-primary:hover,
.tm-primary-btn:hover {
  filter: brightness(1.12);
  box-shadow: 0 8px 28px rgba(var(--brand-primary-rgb), 0.5) !important;
}

.btn-outline,
.btn-secondary,
.ss-btn-ghost.active {
  border-color: var(--brand-primary) !important;
  color: var(--brand-primary) !important;
}
.btn-outline:hover,
.btn-secondary:hover {
  background: rgba(var(--brand-primary-rgb), 0.1) !important;
}

.btn-login,
.mobile-login-btn {
  border-color: rgba(var(--brand-primary-rgb), 0.3) !important;
}

.nav-links a:hover,
.footer-link:hover,
a.link-brand {
  color: var(--brand-primary) !important;
}

.price,
.price-amount,
.plan-price {
  background-image: linear-gradient(135deg, var(--brand-primary), var(--brand-accent)) !important;
  -webkit-background-clip: text !important;
  background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
}

.section-line,
.hero-line,
.hr-brand {
  background-image: linear-gradient(90deg, var(--brand-primary), var(--brand-accent), var(--brand-secondary)) !important;
}

.tm-menu-item.active,
.bp-tab.active,
.sys-tab.active,
.rep-tab.active,
.aic-prompt-card:hover,
.sup-filter-chip.active {
  background-color: var(--brand-primary) !important;
  border-color: var(--brand-primary) !important;
  color: #ffffff !important;
}

.tm-menu-item.active i,
.bp-tab.active i,
.sys-tab.active i,
.rep-tab.active i {
  color: #ffffff !important;
}

.tm-menu-item.active::before {
  background: linear-gradient(180deg, var(--brand-primary), var(--brand-accent)) !important;
}

.brand-icon,
.icon-brand,
.fa-brand-icon,
.text-primary {
  color: var(--brand-primary) !important;
}
.text-accent { color: var(--brand-accent) !important; }
.text-secondary { color: var(--brand-secondary) !important; }

.brand-gradient,
.hero-gradient-bg {
  background-image: linear-gradient(135deg, var(--brand-primary), var(--brand-accent), var(--brand-secondary)) !important;
}

.tag-brand,
.chip-brand,
.hero-tag {
  background-color: rgba(var(--brand-primary-rgb), 0.15) !important;
  color: var(--brand-primary) !important;
  border-color: rgba(var(--brand-primary-rgb), 0.3) !important;
}

input:focus,
textarea:focus,
select:focus {
  border-color: var(--brand-primary) !important;
  box-shadow: 0 0 0 3px rgba(var(--brand-primary-rgb), 0.15) !important;
  outline: none !important;
}

.tm-sw-launcher,
.tm-sw-head,
.tm-sw-msg.visitor .tm-sw-msg-body,
.tm-sw-send {
  background-image: linear-gradient(135deg, var(--brand-primary), var(--brand-accent)) !important;
}

:root {
  --primary: var(--brand-primary) !important;
  --primary-h: var(--brand-primary-h) !important;
  --primary2: var(--brand-primary-h) !important;
  --secondary: var(--brand-secondary) !important;
  --accent: var(--brand-accent) !important;
  --purple: var(--brand-accent) !important;
  --primary-rgb: var(--brand-primary-rgb) !important;
  --secondary-rgb: var(--brand-secondary-rgb) !important;
  --accent-rgb: var(--brand-accent-rgb) !important;

  --ss-accent: var(--brand-primary) !important;
  --ss-accent-h: var(--brand-primary-h) !important;
  --ss-info: var(--brand-secondary) !important;
}

body.light .nav-logo span,
body.light .footer-logo span,
body.light .tm-global-logo span {
  color: var(--brand-primary) !important;
  text-shadow: 0 0 12px rgba(var(--brand-primary-rgb), 0.25) !important;
}

/* ════════════════════════════════════════════════════════════════════
   FINAL GRADIENT-TEXT GUARD — light mode.
   Stops the colored gradient from filling the element box when some
   other rule's `background:` shorthand silently resets background-clip.
   Loaded last → always wins.
   ════════════════════════════════════════════════════════════════════ */
body.light .cine-hero-title,
body.light .cine-hero-title > span,
body.light .cine-title-grad,
body.light .cine-logo-text,
body.light .cine-port-title,
body.light .grad-text,
body.light [class*="grad-text"],
body.light .testimonials-title .grad-text {
  -webkit-background-clip: text !important;
          background-clip: text !important;
  -webkit-text-fill-color: transparent !important;
  color: transparent !important;
  text-shadow: none !important;
}

/* If a `background:` shorthand somewhere stripped our `background-image`,
   restore a high-contrast brand gradient that READS on light backgrounds. */
body.light .cine-title-grad,
body.light .grad-text,
body.light .cine-port-title em,
body.light .testimonials-title .grad-text {
  background-image: linear-gradient(135deg,
    var(--brand-primary, #6366f1) 0%,
    var(--brand-accent,  #06b6d4) 55%,
    var(--brand-secondary, #ec4899) 100%) !important;
}

/* Plain dark for non-gradient titles — readable on white. */
body.light .cine-hero-title,
body.light .cine-hero-title > span:first-child,
body.light .cine-logo-text,
body.light .cine-port-title {
  background-image: linear-gradient(180deg, #0f172a 0%, #1f2937 100%) !important;
}

/* Eyebrows, subtitles, descriptions — solid dark, no gradient. */
body.light .cine-hero-eyebrow,
body.light .cine-hero-subtitle,
body.light .cine-hero-desc,
body.light .cine-scroll-text,
body.light .cine-port-eyebrow,
body.light .cine-port-sub {
  background: none !important;
  background-image: none !important;
  -webkit-background-clip: initial !important;
          background-clip: initial !important;
  -webkit-text-fill-color: initial !important;
  color: rgba(15, 23, 42, 0.78) !important;
  text-shadow: none !important;
}