/* WhatsBot Landing Brand System v1.6.1 — Starter / light theme
   Brand palette: #004433 + #33EE44
   This stylesheet is intentionally limited to Starter and loads late.
*/
:root {
  --wb-brand:#004433;
  --wb-brand-deep:#00372a;
  --wb-brand-mid:#087750;
  --wb-brand-green:#0b9560;
  --wb-brand-soft:#18b85a;
  --wb-accent:#33ee44;
  --wb-accent-light:#73f67f;
  --wb-mint-50:#f7fff8;
  --wb-mint-100:#effff1;
  --wb-mint-200:#d9fddd;
  --wb-mint-300:#baf8c1;
  --wb-ink:#10241d;
  --wb-muted:#60776d;
  --wb-line:#dbe9e3;

  --emerald:#004433 !important;
  --emerald-light:#33ee44 !important;
  --emerald-dark:#087750 !important;
  --sky:#18b85a !important;
  --indigo:#0b9560 !important;
  --rose:#087750 !important;
  --amber:#73f67f !important;

  --slate-50:#f7fff8 !important;
  --slate-100:#effff1 !important;
  --slate-200:#dbe9e3 !important;
  --slate-300:#c4d9d0 !important;
  --slate-400:#8ba69a !important;
  --slate-500:#6d887c !important;
  --slate-600:#506b60 !important;
  --slate-700:#314d42 !important;
  --slate-800:#19362c !important;
  --slate-900:#10241d !important;

  /* pricing_section.php tokens */
  --primary:#004433 !important;
  --primary-light:#087750 !important;
  --accent:#087750 !important;
  --neon-blue:#33ee44 !important;
  --dark-bg:#ffffff !important;
  --dark-card:#ffffff !important;
  --dark-surface:#effff1 !important;
  --glass-bg:#f7fff8 !important;
  --glass-border:#dbe9e3 !important;
  --text-white:#10241d !important;
  --text-muted:#506b60 !important;
  --text-dim:#6d887c !important;
  --gradient-main:linear-gradient(135deg,#004433,#087750) !important;
}

body.wb-theme-starter,
body.wb-theme-starter .content-wrapper { background:#fff !important; color:var(--wb-ink) !important; }

/* Header */
body.wb-theme-starter .st-navbar {
  background:rgba(255,255,255,.94) !important;
  border-bottom:1px solid rgba(0,68,51,.10) !important;
}
body.wb-theme-starter .st-navbar.scrolled { box-shadow:0 10px 35px rgba(0,68,51,.08) !important; }
body.wb-theme-starter .st-navbar .nav-link:hover,
body.wb-theme-starter .st-navbar .nav-link:focus { color:#004433 !important; background:#effff1 !important; }
body.wb-theme-starter .btn-st-signup,
body.wb-theme-starter .st-btn-primary { background:#004433 !important; color:#fff !important; border-color:#004433 !important; }
body.wb-theme-starter .btn-st-signup:hover,
body.wb-theme-starter .st-btn-primary:hover { background:#087750 !important; color:#fff !important; box-shadow:0 12px 30px rgba(0,68,51,.16) !important; }
body.wb-theme-starter .st-btn-outline { border-color:#c4d9d0 !important; color:#314d42 !important; }
body.wb-theme-starter .st-btn-outline:hover { border-color:#004433 !important; color:#004433 !important; background:#f7fff8 !important; }

/* Hero */
body.wb-theme-starter .wb-hero-section { background:#fff !important; }
body.wb-theme-starter .st-hero-pattern { background-image:radial-gradient(circle at 1px 1px,rgba(0,68,51,.11) 1px,transparent 0) !important; }
body.wb-theme-starter .st-gradient,
body.wb-theme-starter .pricing-hero h1 .gradient-text {
  background:linear-gradient(135deg,#004433 0%,#087750 48%,#18b85a 100%) !important;
  -webkit-background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  background-clip:text !important;
}
body.wb-theme-starter .wb-hero-copy > .d-inline-flex.rounded-pill,
body.wb-theme-starter .st-section .d-inline-block.rounded-pill,
body.wb-theme-starter .pricing-hero .badge-pill {
  background:rgba(51,238,68,.08) !important;
  border-color:rgba(0,68,51,.16) !important;
  color:#004433 !important;
}

/* General light surfaces */
body.wb-theme-starter .st-section-alt { background:#f7fff8 !important; }
body.wb-theme-starter .st-card,
body.wb-theme-starter .st-testimonial,
body.wb-theme-starter .st-pricing-card,
body.wb-theme-starter .pricing-card,
body.wb-theme-starter .value-card,
body.wb-theme-starter .faq-item {
  background:#fff !important;
  border-color:#dbe9e3 !important;
}
body.wb-theme-starter .st-card:hover,
body.wb-theme-starter .st-testimonial:hover,
body.wb-theme-starter .st-pricing-card:hover,
body.wb-theme-starter .pricing-card:hover,
body.wb-theme-starter .value-card:hover,
body.wb-theme-starter .faq-item:hover {
  border-color:rgba(0,68,51,.28) !important;
  box-shadow:0 20px 50px -16px rgba(0,68,51,.16) !important;
}

/* Pricing — the shipped Starter pricing block has its own old blue/purple palette. */
body.wb-theme-starter .pricing-hero .badge-pill { color:#087750 !important; }
body.wb-theme-starter .billing-toggle-wrap .toggle-label.active { color:#10241d !important; }
body.wb-theme-starter .billing-toggle-wrap .save-pill,
body.wb-theme-starter .pricing-card .featured-tag,
body.wb-theme-starter .pricing-card .btn-pricing-primary,
body.wb-theme-starter .pricing-cta .btn-cta {
  background:linear-gradient(135deg,#004433 0%,#087750 100%) !important;
  color:#fff !important;
  box-shadow:0 8px 24px rgba(0,68,51,.14) !important;
}
body.wb-theme-starter .billing-toggle-wrap .toggle-slider { background:#effff1 !important; border-color:#dbe9e3 !important; }
body.wb-theme-starter .billing-toggle-wrap .toggle-slider::before {
  background:#33ee44 !important;
  box-shadow:0 2px 10px rgba(51,238,68,.24) !important;
}
body.wb-theme-starter .pricing-card.featured-card {
  background:linear-gradient(180deg,rgba(51,238,68,.055) 0%,#fff 42%) !important;
  border-color:rgba(0,68,51,.30) !important;
  box-shadow:0 20px 55px rgba(0,68,51,.09) !important;
}
body.wb-theme-starter .pricing-card::before,
body.wb-theme-starter .pricing-card.featured-card::before {
  background:linear-gradient(90deg,transparent,#004433,#33ee44,transparent) !important;
}
body.wb-theme-starter .pricing-card .plan-icon,
body.wb-theme-starter .value-card .v-icon {
  background:rgba(51,238,68,.09) !important;
  color:#004433 !important;
  border:1px solid rgba(0,68,51,.12) !important;
}
body.wb-theme-starter .pricing-card .plan-accounts,
body.wb-theme-starter .pricing-card .features-list li i.check-yes,
body.wb-theme-starter .trust-bar .trust-item i { color:#087750 !important; }
body.wb-theme-starter .pricing-card .btn-pricing-outline { background:#f7fff8 !important; color:#10241d !important; border-color:#dbe9e3 !important; }
body.wb-theme-starter .pricing-card .btn-pricing-outline:hover { background:#effff1 !important; color:#004433 !important; border-color:#8bdc9e !important; box-shadow:0 8px 24px rgba(0,68,51,.10) !important; }
body.wb-theme-starter .pricing-cta {
  background:linear-gradient(135deg,rgba(0,68,51,.055),rgba(51,238,68,.075)) !important;
  border-color:rgba(0,68,51,.15) !important;
}
body.wb-theme-starter .pricing-cta::before { background:radial-gradient(circle at 30% 40%,rgba(51,238,68,.11),transparent 52%) !important; }

/* Changelog / status */
body.wb-theme-starter .st-changelog { border-color:#dbe9e3 !important; }
body.wb-theme-starter .st-changelog.latest { border-color:#004433 !important; }
body.wb-theme-starter .st-changelog.latest::before { background:#33ee44 !important; border-color:#fff !important; box-shadow:0 0 0 4px rgba(51,238,68,.16) !important; }
body.wb-theme-starter .st-version-badge { background:rgba(51,238,68,.09) !important; color:#004433 !important; }

/* CTA / footer */
body.wb-theme-starter .st-cta { background:linear-gradient(135deg,#071d16 0%,#00372a 45%,#004433 100%) !important; }
body.wb-theme-starter .st-cta .st-gradient {
  background:linear-gradient(135deg,#d9fddd 0%,#73f67f 45%,#33ee44 100%) !important;
  -webkit-background-clip:text !important;
  -webkit-text-fill-color:transparent !important;
  background-clip:text !important;
}
body.wb-theme-starter .st-cta .st-btn-primary { background:#33ee44 !important; color:#00372a !important; }
body.wb-theme-starter .st-cta .st-btn-primary:hover { background:#73f67f !important; color:#00372a !important; }
body.wb-theme-starter .st-footer { background:#071d16 !important; color:#9fb9ae !important; }
body.wb-theme-starter .st-footer-links a { color:#9fb9ae !important; }
body.wb-theme-starter .st-footer-links a:hover { color:#33ee44 !important; }
body.wb-theme-starter .st-social-icon { background:rgba(51,238,68,.04) !important; border-color:rgba(51,238,68,.12) !important; color:#9fb9ae !important; }
body.wb-theme-starter .st-social-icon:hover { border-color:#33ee44 !important; color:#33ee44 !important; background:rgba(51,238,68,.08) !important; }

/* Accessibility */
body.wb-theme-starter a:focus-visible,
body.wb-theme-starter button:focus-visible { outline:3px solid rgba(51,238,68,.42) !important; outline-offset:3px; }
