/*  dark.css  */

body.darkmode {
--primary: #66bbff;
--accent: #3adaaa;
--gradient: linear-gradient(90deg, #002255, #0055aa 50%, #0088dd 100%);
--section-bg: #001a33;
--card-bg: #002255;
--bg-primary: var(--card-bg);
--bg-secondary: var(--section-bg);
--shadow: 0 2px 24px rgba(0,0,0,.28), 0 1.5px 8px rgba(0,26,51,.18);
--border-color: #3549824c;
--border-radius: 1.25em;
--dark: #eaf6ff;
--text-primary: var(--dark);
--text-secondary: #9ca3af;
--light: #003366;
--cta: #36dc9d;
--success: #36dc9d;
--danger: #fb4d6d;
--star: #ffe05b;
}
body.darkmode {
    color: var(--dark);
}
body.darkmode .contact-section, body.darkmode .features-section, body.darkmode .testimonials-section, body.darkmode .feature-list-section, body.darkmode .card-bg, body.darkmode .contact-box, body.darkmode .pricing-card, body.darkmode .feature-card {
    background: var(--card-bg) !important;
    color: var(--dark);
}
body.darkmode .hero {
    background: var(--section-bg);
}

body.darkmode .hero h1 {
  background: linear-gradient(90deg, #0088dd 0%, #00bbff 100%);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  color: inherit;
}
body.darkmode .feature-card, body.darkmode .pricing-card, body.darkmode .contact-box, body.darkmode .feature-list-section, body.darkmode .testimonial {
    box-shadow: 0 4px 24px #101d2f8c;
    border-color: #3549824c !important;
}
body.darkmode .header-link {
    color: var(--primary);
}
body.darkmode .brand {
    color: var(--primary);
}
body.darkmode .header-link.active::after {
    background: var(--cta);
}
body.darkmode .header-link:hover, body.darkmode .header-link:focus {
    color: var(--cta);
    text-shadow: 0 2px 4px #49cebb26;
}

body.darkmode .header-nav-divider {
  background: rgba(255, 255, 255, 0.18);
}

body.darkmode .header-link--app {
  background: rgba(102, 187, 255, 0.12);
  border-color: rgba(102, 187, 255, 0.22);
  color: var(--primary);
}
body.darkmode .header-link--app:hover, body.darkmode .header-link--app:focus {
  background: rgba(102, 187, 255, 0.18);
  color: var(--primary);
  text-shadow: none;
}
body.darkmode .header-link--app.active {
  background: rgba(54, 220, 157, 0.16);
  border-color: rgba(54, 220, 157, 0.32);
  color: var(--cta);
}

body.darkmode .header-link--anchor {
  color: var(--text-secondary);
}
body.darkmode .header-link--anchor:hover, body.darkmode .header-link--anchor:focus {
  color: var(--primary);
  text-shadow: none;
}

body.darkmode .lang-flag-selector {
  border-color: rgba(255, 255, 255, 0.16);
}
body.darkmode .lang-flag-selector summary {
  color: rgba(234, 246, 255, 0.9);
}
body.darkmode .lang-flag-selector[open] summary {
  background: rgba(255, 255, 255, 0.06);
}
body.darkmode .lang-flag-selector ul {
  background: var(--card-bg);
  box-shadow: 0 10px 36px rgba(0, 0, 0, 0.55);
}
body.darkmode .lang-flag-selector li {
  color: rgba(234, 246, 255, 0.92);
}
body.darkmode .lang-flag-selector li.selected {
  background: rgba(54, 220, 157, 0.14);
}
body.darkmode .lang-flag-selector li:hover {
  background: rgba(102, 187, 255, 0.12);
}
body.darkmode .material-icons-outlined, body.darkmode .feature-list-icon {
    color: var(--primary) !important;
}
body.darkmode .feature-card:hover .material-icons-outlined, body.darkmode .feature-list li:hover .feature-list-icon {
    color: var(--cta) !important;
}
body.darkmode .feature-list li {
    background: linear-gradient(90deg, #002244, #003355 80%);
    color: #eaf6ff;
    border-left: 5px solid var(--cta);
}
body.darkmode .feature-list li:hover {
    background: linear-gradient(90deg, #003366, #005577 90%);
}
body.darkmode .testimonial {
    background: #002244;
    color: #eaf6ff;
}
body.darkmode .testimonial:before {
    color: #ffe05b;
}
body.darkmode .star {
    color: #ffe05b;
}
body.darkmode footer {
    background: var(--card-bg);
    color: #829bb6;
}
body.darkmode .cta-btn {
    background: var(--cta);
    color: #17394c;
    box-shadow: 0 3px 28px #49cebb28;
}
body.darkmode .cta-btn:hover {
    background: #23a16f;
    color: #eaf6ff;
}
body.darkmode .pricing-label {
    background: var(--cta);
    color: #eaf6ff;
}
body.darkmode .pricing-features {
    color: #eaf6ff
}
/* Dark mode for inputs etc. as needed */
body.darkmode select, body.darkmode input, body.darkmode textarea {
    background: #002255;
    color: #eaf6ff;
    border: 1px solid #003366;
}
body.darkmode .screenshots-section, body.darkmode .screenshot-card {
    background: var(--card-bg);
}
body.darkmode .screenshot-mock {
    background: #002244;
    border: 1px solid #35498277;
}
body.darkmode .screenshot-caption {
    color: #bbbde3;
}


/* Dark Mode for New Sections */
body.darkmode .hero-price {
    color: var(--success);
}
body.darkmode .cta-btn-secondary {
    background: var(--card-bg);
    color: var(--primary);
    border-color: var(--primary);
}
body.darkmode .cta-btn-secondary:hover {
    background: var(--primary);
    color: var(--dark);
    border-color: var(--primary);
}
body.darkmode .trust-bar {
    background: var(--card-bg);
}
body.darkmode .trust-item strong {
    color: var(--dark);
}
body.darkmode .trust-item span {
    color: #9ca3af;
}
body.darkmode .usp-section {
    background: var(--section-bg);
}
body.darkmode .usp-item {
    background: var(--card-bg);
}
body.darkmode .usp-text strong {
    color: var(--dark);
}
body.darkmode .usp-text span {
    color: #9ca3af;
}
body.darkmode .carousel-caption {
    color: var(--primary);
}
body.darkmode .carousel-dot {
    background: #4b5563;
}
body.darkmode .carousel-dot:hover,
body.darkmode .carousel-dot.active {
    background: var(--primary);
}
body.darkmode .carousel-play-pause {
    background: var(--card-bg);
    border-color: var(--primary);
    color: var(--primary);
}
body.darkmode .carousel-play-pause:hover {
    background: var(--primary);
    color: var(--dark);
}
body.darkmode .carousel-nav-btn {
    background: var(--card-bg);
    border-color: var(--primary);
    color: var(--primary);
}
body.darkmode .carousel-nav-btn:hover {
    background: var(--primary);
    color: var(--dark);
}
body.darkmode .faq-section {
    background: var(--card-bg);
}
body.darkmode .faq-item {
    background: var(--section-bg);
}
body.darkmode .faq-question {
    color: var(--primary);
}
body.darkmode .faq-question:hover {
    color: var(--cta);
}
body.darkmode .faq-icon {
    color: var(--primary);
}
body.darkmode .faq-item.active .faq-icon {
    color: var(--cta);
}
body.darkmode .faq-answer p {
    color: #cbd5e1;
}
body.darkmode .affiliate-section {
    background: var(--section-bg);
}
body.darkmode .affiliate-subtitle {
    color: #9ca3af;
}
body.darkmode .affiliate-example {
    background: var(--card-bg);
}
body.darkmode .example-number {
    color: var(--success);
}
body.darkmode .affiliate-example p {
    color: var(--dark);
}
body.darkmode .affiliate-features {
    background: var(--card-bg);
}
body.darkmode .affiliate-features h3 {
    color: var(--primary);
}
body.darkmode .affiliate-features li {
    color: var(--dark);
    border-bottom-color: #374151;
}
body.darkmode .affiliate-features .check {
    color: var(--success);
}
body.darkmode .pricing-section {
    background: var(--card-bg);
}
body.darkmode .pricing-card-main {
    background: var(--card-bg);
    border-color: var(--success);
}
body.darkmode .pricing-header {
    border-bottom-color: #374151;
}
body.darkmode .pricing-plan-title {
    color: var(--primary);
}
body.darkmode .price-amount {
    color: var(--success);
}
body.darkmode .price-period,
body.darkmode .pricing-yearly,
body.darkmode .pricing-note {
    color: #9ca3af;
}
body.darkmode .pricing-cta {
    background: var(--cta);
    color: #17394c;
}
body.darkmode .pricing-cta:hover {
    background: #23a16f;
    color: var(--dark);
}
body.darkmode .pricing-features-section h3 {
    color: var(--primary);
}
body.darkmode .pricing-features-list li {
    border-bottom-color: #374151;
    color: var(--dark);
}
body.darkmode .pricing-features-list .check {
    color: var(--success);
}
body.darkmode .pricing-addons {
    background: var(--section-bg);
}
body.darkmode .pricing-addons h3 {
    color: var(--primary);
}
body.darkmode .addon-item {
    background: var(--card-bg);
}
body.darkmode .addon-item strong {
    color: var(--primary);
}
body.darkmode .addon-price {
    color: var(--success);
}
body.darkmode .addon-item small {
    color: #9ca3af;
}
body.darkmode .addon-badge {
    background: var(--cta);
    color: #17394c;
}
body.darkmode .pricing-byok-section {
    background: #2d3748;
    border-color: #f59e0b;
}
body.darkmode .pricing-byok-section h3 {
    color: #fbbf24;
}
body.darkmode .pricing-card.highlight {
    border-color: var(--success);
    box-shadow: 0 8px 36px #36dc9d22;
}
body.darkmode .pricing-card.highlight .pricing-price {
    color: var(--success);
}

/* Logo A/B Toggle Button - Dark Mode */
body.darkmode .logo-toggle-btn {
    background: var(--card-bg);
    border-color: var(--primary);
    color: var(--primary);
    box-shadow: 0 1.5px 7px #001a3322;
}
body.darkmode .logo-toggle-btn:hover {
    background: var(--primary);
    color: var(--dark);
}