/* jinju-override.css — Jinju Fruitea Cobalt Line Art (DARK mode only).
 * Source: /root/jinju-fruitea-style.json v1.0
 *
 * Token map: bg #3B7DD8, line #FFFFFF, mango #F5C26B, strawberry #F28C8C,
 * mint #A3D9A5, lime #C4E085, orange #F5B85C, berry #7EB8DA, tapioca #5C4033.
 *
 * All rules scoped to [data-theme="dark"] so light mode uses styles.css as-is.
 * Light mode = original ivory paper theme (no override).
 */

[data-theme="dark"] {
  --c1-bg: #3B7DD8; --c2-bg: #3B7DD8; --c3-bg: #3B7DD8; --c4-bg: #3B7DD8;
  --c5-bg: #3B7DD8; --c6-bg: #3B7DD8; --c7-bg: #3B7DD8; --c8-bg: #3B7DD8;
  --c1-fg: #FFFFFF; --c2-fg: #FFFFFF; --c3-fg: #FFFFFF; --c4-fg: #FFFFFF;
  --c5-fg: #FFFFFF; --c6-fg: #FFFFFF; --c7-fg: #FFFFFF; --c8-fg: #FFFFFF;
  --c1-accent: #F5C26B; --c2-accent: #F28C8C; --c3-accent: #A3D9A5; --c4-accent: #F5B85C;
  --c5-accent: #F28C8C; --c6-accent: #7EB8DA; --c7-accent: #A3D9A5; --c8-accent: #C4E085;

  --bg: #3B7DD8;
  --fg: #FFFFFF;
  --line: rgba(255, 255, 255, 0.35);
  --line-strong: rgba(255, 255, 255, 0.55);
  --card: rgba(255, 255, 255, 0.10);
  --card-line: rgba(255, 255, 255, 0.85);
  --glass: rgba(255, 255, 255, 0.10);
  --glass-line: rgba(255, 255, 255, 0.45);
  --shadow: 0 12px 40px -16px rgba(0, 0, 0, 0.18);
  --shadow-sm: 0 4px 16px -6px rgba(0, 0, 0, 0.12);

  --gold: #F5C26B; --gold-soft: #F5D896;
  --rose: #F28C8C; --mint: #A3D9A5; --sky: #7EB8DA;
  --accent: #F5B85C;

  color-scheme: light;
}

[data-theme="dark"] body {
  background: #3B7DD8;
  color: #FFFFFF;
  font-weight: 500;
  line-height: 1.6;
}

[data-theme="dark"] .painted-bg,
[data-theme="dark"] .noise { display: none !important; }

[data-theme="dark"] .nav {
  background: rgba(255, 255, 255, 0.10);
  border-bottom: 1px solid rgba(255, 255, 255, 0.45);
  backdrop-filter: blur(18px) saturate(140%);
}
[data-theme="dark"] .nav-logo,
[data-theme="dark"] .nav-links a { color: #FFFFFF; }
[data-theme="dark"] .nav-links a { opacity: 0.92; }
[data-theme="dark"] .nav-links a:hover { opacity: 1; color: #F5C26B; }
[data-theme="dark"] .nav-cta {
  background: #F5C26B;
  color: #5C4033;
  border: 1px solid #F5C26B;
}
[data-theme="dark"] .nav-cta:hover { background: #F5B85C; color: #5C4033; }

[data-theme="dark"] .lang-pill button,
[data-theme="dark"] .theme-toggle {
  color: #FFFFFF;
  border: 1px solid rgba(255, 255, 255, 0.55);
}
[data-theme="dark"] .lang-menu { background: #FFFFFF; color: #1A1A24; }

[data-theme="dark"] .announce { background: #F28C8C; color: #FFFFFF; }
[data-theme="dark"] .announce a { color: #FFFFFF; text-decoration: underline; }
[data-theme="dark"] .announce-close { color: #FFFFFF; }

[data-theme="dark"] .hero,
[data-theme="dark"] .section,
[data-theme="dark"] .ch-hero,
[data-theme="dark"] .ch-shop,
[data-theme="dark"] .ch-match,
[data-theme="dark"] .ch-events,
[data-theme="dark"] .ch-jobs,
[data-theme="dark"] .ch-pricing,
[data-theme="dark"] .ch-auth,
[data-theme="dark"] .ch-proof,
[data-theme="dark"] .final-cta,
[data-theme="dark"] .footer {
  background: #3B7DD8;
  color: #FFFFFF;
}

[data-theme="dark"] .hero-video::after,
[data-theme="dark"] .final-cta { background: #3B7DD8 !important; }
[data-theme="dark"] .footer { border-top: 1px solid rgba(255, 255, 255, 0.35); }

[data-theme="dark"] .hero h1 span,
[data-theme="dark"] .chapter-tag,
[data-theme="dark"] .section h2,
[data-theme="dark"] .footer h5,
[data-theme="dark"] .final-cta h2,
[data-theme="dark"] .final-cta p { color: #FFFFFF; }

[data-theme="dark"] .chapter-tag { opacity: 0.7; }
[data-theme="dark"] .chapter-tag::before { background: rgba(255, 255, 255, 0.85); }
[data-theme="dark"] .section-sub,
[data-theme="dark"] .hero-sub { color: #FFFFFF; opacity: 0.85; }
[data-theme="dark"] .hero-sub { opacity: 0.92; }
[data-theme="dark"] .hero-micro { color: #FFFFFF; opacity: 0.85; }

[data-theme="dark"] .btn {
  color: #FFFFFF;
  background: rgba(255, 255, 255, 0.08);
  border: 1px solid rgba(255, 255, 255, 0.55);
}
[data-theme="dark"] .btn:hover { background: rgba(255, 255, 255, 0.18); }
[data-theme="dark"] .btn.btn-primary {
  background: #F5C26B;
  color: #5C4033;
  border: 1px solid #F5C26B;
}
[data-theme="dark"] .btn.btn-primary:hover { background: #F5B85C; color: #5C4033; }

[data-theme="dark"] .float-card {
  background: rgba(255, 255, 255, 0.10);
  border: 1.5px solid #FFFFFF;
  backdrop-filter: blur(14px);
  box-shadow: 0 16px 32px -16px rgba(0, 0, 0, 0.20);
}
[data-theme="dark"] .float-card-img { opacity: 0.85; }
[data-theme="dark"] .float-card-title { color: #FFFFFF; font-weight: 700; }
[data-theme="dark"] .float-card-sub,
[data-theme="dark"] .float-card-tag { color: #FFFFFF; opacity: 0.85; }

[data-theme="dark"] .carousel-card {
  background: rgba(255, 255, 255, 0.08);
  border: 1.5px solid #FFFFFF;
}
[data-theme="dark"] .carousel-card .num { color: #F5C26B; }
[data-theme="dark"] .carousel-card .icon,
[data-theme="dark"] .carousel-card h3 { color: #FFFFFF; }
[data-theme="dark"] .carousel-card p { color: #FFFFFF; opacity: 0.85; }

[data-theme="dark"] .feature-list li {
  color: #FFFFFF;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}
[data-theme="dark"] .feature-list .check {
  background: #A3D9A5;
  color: #5C4033;
}

[data-theme="dark"] .shop-mockup,
[data-theme="dark"] .match-bubbles .bubble {
  background: rgba(255, 255, 255, 0.10);
  border: 1.5px solid #FFFFFF;
}
[data-theme="dark"] .match-bubbles .bubble { color: #FFFFFF; }

[data-theme="dark"] .spotlight-card,
[data-theme="dark"] .event-card,
[data-theme="dark"] .job-card,
[data-theme="dark"] .plan,
[data-theme="dark"] .auth-card,
[data-theme="dark"] .payment-card,
[data-theme="dark"] .quote-card,
[data-theme="dark"] .faq-item {
  background: rgba(255, 255, 255, 0.10);
  border: 1.5px solid #FFFFFF;
}
[data-theme="dark"] .plan.featured { border-color: #F5C26B; }
[data-theme="dark"] .faq-item { border: 1px solid rgba(255, 255, 255, 0.45); }

[data-theme="dark"] .spotlight-card h4,
[data-theme="dark"] .event-card h4,
[data-theme="dark"] .job-card h4,
[data-theme="dark"] .plan-name,
[data-theme="dark"] .payment-card h3,
[data-theme="dark"] .quote-card-author strong,
[data-theme="dark"] .faq-q,
[data-theme="dark"] .footer-inner { color: #FFFFFF; }

[data-theme="dark"] .spotlight-card p,
[data-theme="dark"] .event-card p,
[data-theme="dark"] .job-card p,
[data-theme="dark"] .plan-desc,
[data-theme="dark"] .payment-card p,
[data-theme="dark"] .quote-card blockquote,
[data-theme="dark"] .faq-a,
[data-theme="dark"] .footer p { color: #FFFFFF; opacity: 0.85; }

[data-theme="dark"] .spotlight-card-stats { color: #FFFFFF; opacity: 0.9; }
[data-theme="dark"] .spotlight-crown { color: #F5C26B; }
[data-theme="dark"] .spotlight-card::after,
[data-theme="dark"] .event-card::after { background: transparent !important; }

[data-theme="dark"] .event-card-badge { background: #F28C8C; color: #FFFFFF; }
[data-theme="dark"] .plan-badge { background: #F5C26B; color: #5C4033; }
[data-theme="dark"] .plan-features li,
[data-theme="dark"] .payment-card ul li { color: #FFFFFF; opacity: 0.85; }
[data-theme="dark"] .payment-card ul li { opacity: 0.8; }

[data-theme="dark"] .job-card-avatar { opacity: 0.85; }
[data-theme="dark"] .job-card-tag { background: #A3D9A5; color: #5C4033; }

[data-theme="dark"] .marquee-item { color: #FFFFFF; opacity: 0.6; }
[data-theme="dark"] .press-strip span { color: #FFFFFF; opacity: 0.5; }

[data-theme="dark"] .form-input {
  background: rgba(255, 255, 255, 0.10);
  border: 1.5px solid #FFFFFF;
  color: #FFFFFF;
}
[data-theme="dark"] .form-input::placeholder { color: rgba(255, 255, 255, 0.6); }
[data-theme="dark"] .form-input:focus { border-color: #F5C26B; background: rgba(255, 255, 255, 0.18); }

[data-theme="dark"] .quote-card .stars { color: #F5C26B; }
[data-theme="dark"] .quote-card-author small { color: #FFFFFF; opacity: 0.7; }

[data-theme="dark"] .footer a { color: #FFFFFF; opacity: 0.85; }
[data-theme="dark"] .footer a:hover { opacity: 1; color: #F5C26B; }
[data-theme="dark"] .footer-bottom { color: #FFFFFF; opacity: 0.7; }

/* Heavier font-weight for cobalt body text */
[data-theme="dark"] .section h2,
[data-theme="dark"] .section p,
[data-theme="dark"] .feature-list li,
[data-theme="dark"] .hero h1,
[data-theme="dark"] .hero-sub,
[data-theme="dark"] .hero-micro,
[data-theme="dark"] .plan-name,
[data-theme="dark"] .plan-desc,
[data-theme="dark"] .plan-features li,
[data-theme="dark"] .event-card h4,
[data-theme="dark"] .event-card p,
[data-theme="dark"] .spotlight-card h4,
[data-theme="dark"] .spotlight-card p,
[data-theme="dark"] .job-card h4,
[data-theme="dark"] .job-card p { font-weight: 500; }
