/* ========================
   THEME LIGHT
   Modern · Light · Blush + Maroon
   Scoped to body.theme-light so dark pages stay untouched.
   ======================== */

body.theme-light {
  /* New palette */
  --c-blush: #E8A5B0;
  --c-blush-light: #F4C4CC;
  --c-blush-soft: #FBE4E7;
  --c-rose: #C97B82;
  --c-rose-deep: #B05F68;
  --c-maroon: #6B2C3D;
  --c-maroon-deep: #4A1E2A;
  --c-cream: #FFF8F3;
  --c-cream-warm: #FAEFE7;
  --c-blush-bg: #FDEEE9;
  --c-peach: #F9E0D2;
  --c-champagne: #F5E6CC;
  --c-ink: #2A2326;
  --c-ink-soft: #5A4A4F;
  --c-line: rgba(107, 44, 61, 0.12);
  --c-line-strong: rgba(107, 44, 61, 0.25);

  --shadow-soft: 0 8px 24px rgba(107, 44, 61, 0.08);
  --shadow-medium: 0 16px 40px rgba(107, 44, 61, 0.12);
  --shadow-strong: 0 24px 60px rgba(107, 44, 61, 0.18);
  --shadow-glow-blush: 0 0 30px rgba(232, 165, 176, 0.45);

  /* ===== Token remaps =====
     Existing CSS files reference --color-gold, --gradient-primary, etc.
     Re-pointing them here lets all page-specific stylesheets pick up the
     light palette automatically. */
  --color-gold: var(--c-rose);
  --color-gold-light: var(--c-blush-light);
  --color-gold-dark: var(--c-rose-deep);
  --color-coral: var(--c-rose);
  --color-coral-light: var(--c-blush-light);
  --color-coral-dark: var(--c-rose-deep);
  --color-teal: var(--c-blush-soft);
  --color-teal-light: var(--c-blush-soft);
  --color-teal-dark: var(--c-blush);
  --color-purple: var(--c-rose);
  --color-purple-light: var(--c-blush-light);
  --color-purple-dark: var(--c-rose-deep);

  --gradient-primary: linear-gradient(135deg, var(--c-maroon), var(--c-rose-deep));
  --gradient-secondary: linear-gradient(135deg, var(--c-blush), var(--c-rose));
  --gradient-warm: linear-gradient(135deg, var(--c-cream-warm), var(--c-blush-bg));
  --gradient-hero: linear-gradient(135deg, rgba(253, 238, 233, 0.78), rgba(245, 230, 204, 0.65));
  --gradient-gold-shimmer: linear-gradient(135deg, var(--c-rose-deep), var(--c-rose), var(--c-blush), var(--c-rose));

  --shadow-glow-gold: 0 0 20px rgba(232, 165, 176, 0.45);
  --shadow-glow-coral: 0 0 20px rgba(232, 165, 176, 0.45);
  --shadow-glow-teal: 0 0 20px rgba(232, 165, 176, 0.25);
  --shadow-glow-purple: 0 0 20px rgba(232, 165, 176, 0.45);

  background: var(--c-cream);
  color: var(--c-ink);
}

/* ===== Typography in light theme ===== */
body.theme-light h1,
body.theme-light h2,
body.theme-light h3,
body.theme-light h4 {
  color: var(--c-maroon);
}

body.theme-light .section-title {
  color: var(--c-maroon);
}

body.theme-light .section-label {
  color: var(--c-rose);
  letter-spacing: 3px;
}

body.theme-light .section-subtitle {
  color: var(--c-ink-soft);
}

body.theme-light .divider {
  background: linear-gradient(90deg, var(--c-blush), var(--c-rose));
}

body.theme-light .section--gray {
  background: var(--c-blush-bg);
}

/* Custom section variant for the light theme */
body.theme-light .section--blush {
  background: var(--c-blush-bg);
}

body.theme-light .section--cream {
  background: var(--c-cream-warm);
}

/* ===== Buttons ===== */
body.theme-light .btn--primary {
  background: var(--c-maroon);
  color: var(--c-cream);
  border-color: var(--c-maroon);
}

body.theme-light .btn--primary:hover {
  background: var(--c-maroon-deep);
  border-color: var(--c-maroon-deep);
  color: var(--c-cream);
  box-shadow: var(--shadow-medium);
}

body.theme-light .btn--secondary {
  background: transparent;
  color: var(--c-maroon);
  border-color: var(--c-maroon);
}

body.theme-light .btn--secondary:hover {
  background: var(--c-maroon);
  color: var(--c-cream);
  border-color: var(--c-maroon);
}

body.theme-light .btn--outline {
  background: transparent;
  color: var(--c-maroon);
  border-color: var(--c-maroon);
}

body.theme-light .btn--outline:hover {
  background: var(--c-blush-soft);
  color: var(--c-maroon);
  border-color: var(--c-maroon);
}

body.theme-light .link-arrow {
  color: var(--c-rose);
}

body.theme-light .link-arrow:hover {
  color: var(--c-maroon);
}

/* ===== Navbar in light theme ===== */
body.theme-light .navbar {
  background: transparent;
  padding: var(--space-4) 0;
}

body.theme-light .navbar--scrolled {
  background: rgba(255, 248, 243, 0.85);
  backdrop-filter: saturate(150%) blur(14px);
  -webkit-backdrop-filter: saturate(150%) blur(14px);
  box-shadow: 0 1px 0 var(--c-line), 0 8px 30px rgba(107, 44, 61, 0.06);
}

body.theme-light .navbar__logo-img {
  background: transparent;
  border: none;
  padding: 0;
  height: 56px;
  filter: drop-shadow(0 2px 8px rgba(107, 44, 61, 0.08));
}

body.theme-light .navbar--scrolled .navbar__logo-img {
  height: 48px;
  padding: 0;
}

body.theme-light .navbar__link {
  color: var(--c-maroon);
}

body.theme-light .navbar__link::after {
  background: var(--c-blush);
  height: 2px;
}

body.theme-light .navbar--scrolled .navbar__link {
  color: var(--c-maroon);
}

body.theme-light .navbar--scrolled .navbar__link:hover {
  color: var(--c-rose);
}

body.theme-light .navbar__link--active {
  color: var(--c-rose) !important;
}

body.theme-light .navbar__hamburger-line {
  background: var(--c-maroon);
}

body.theme-light .navbar--scrolled .navbar__hamburger-line {
  background: var(--c-maroon);
}

body.theme-light .mobile-menu {
  background: var(--c-cream);
}

body.theme-light .mobile-menu__link {
  color: var(--c-maroon);
}

body.theme-light .mobile-menu__link:hover {
  color: var(--c-rose);
}

/* ===== Footer in light theme ===== */
body.theme-light .footer {
  background: var(--c-cream-warm);
  color: var(--c-ink-soft);
  border-top: 1px solid var(--c-line);
}

body.theme-light .footer__newsletter {
  background: var(--c-blush-bg);
  border-color: var(--c-line);
}

body.theme-light .footer__newsletter-title {
  color: var(--c-maroon);
}

body.theme-light .footer__newsletter-input {
  background: var(--c-cream);
  border-color: var(--c-line-strong);
  color: var(--c-ink);
}

body.theme-light .footer__newsletter-input::placeholder {
  color: var(--c-ink-soft);
}

body.theme-light .footer__newsletter-input:focus {
  border-color: var(--c-rose);
}

body.theme-light .footer__newsletter-btn {
  background: var(--c-maroon);
  color: var(--c-cream);
}

body.theme-light .footer__newsletter-btn:hover {
  background: var(--c-maroon-deep);
}

body.theme-light .footer__logo-img {
  background: transparent;
  border: none;
  padding: 0;
  height: 80px;
  filter: drop-shadow(0 2px 8px rgba(107, 44, 61, 0.08));
}

body.theme-light .footer__col-title {
  color: var(--c-maroon);
}

body.theme-light .footer__about-text,
body.theme-light .footer__link,
body.theme-light .footer__contact-item span {
  color: var(--c-ink-soft);
}

body.theme-light .footer__link:hover {
  color: var(--c-rose);
}

body.theme-light .footer__social-link {
  background: var(--c-cream);
  color: var(--c-maroon);
  border: 1px solid var(--c-line);
}

body.theme-light .footer__social-link:hover {
  background: var(--c-blush);
  color: var(--c-cream);
  border-color: var(--c-blush);
}

body.theme-light .footer__contact-icon {
  color: var(--c-rose);
}

body.theme-light .footer__bottom {
  background: var(--c-cream-warm);
  border-top: 1px solid var(--c-line);
  color: var(--c-ink-soft);
}

/* ===== Skip link / scroll-to-top ===== */
body.theme-light .scroll-top {
  background: var(--c-maroon);
  color: var(--c-cream);
}

body.theme-light .scroll-top:hover {
  background: var(--c-maroon-deep);
}

/* ===== Page hero (about / services / gallery / contact) =====
   The hero overlay now resolves to a light cream/blush gradient via
   --gradient-hero, so the dark-on-white text needs to flip to dark on light. */
body.theme-light .page-hero__title {
  color: var(--c-maroon);
}

body.theme-light .page-hero__breadcrumb,
body.theme-light .page-hero__breadcrumb a {
  color: var(--c-ink-soft);
}

body.theme-light .page-hero__breadcrumb a:hover {
  color: var(--c-rose);
}

body.theme-light .page-hero__breadcrumb span {
  color: var(--c-rose);
}

/* ===== Event hero (independence-day) =====
   Original .event-hero hardcodes a near-black gradient + white text.
   Replace with the same blush radial palette used on the home hero. */
body.theme-light .event-hero {
  background:
    radial-gradient(circle at 12% 18%, rgba(232, 165, 176, 0.45), transparent 45%),
    radial-gradient(circle at 88% 8%, rgba(249, 224, 210, 0.6), transparent 50%),
    radial-gradient(circle at 75% 90%, rgba(244, 196, 204, 0.4), transparent 55%),
    var(--c-cream);
  color: var(--c-ink);
}

body.theme-light .event-hero__bg,
body.theme-light .event-hero__overlay {
  background: none;
}

body.theme-light .event-hero__eyebrow {
  background: rgba(232, 165, 176, 0.18);
  color: var(--c-rose-deep);
  border-color: rgba(232, 165, 176, 0.5);
}

body.theme-light .event-hero__title {
  color: var(--c-maroon);
}

body.theme-light .event-hero__title span {
  color: var(--c-rose);
}

body.theme-light .event-hero__tagline {
  color: var(--c-ink-soft);
}

body.theme-light .event-hero__meta li {
  background: rgba(255, 255, 255, 0.6);
  border-color: var(--c-line);
}

body.theme-light .event-hero__meta-label {
  color: var(--c-rose);
}

body.theme-light .event-hero__meta-value {
  color: var(--c-ink);
}

body.theme-light .event-hero__meta svg {
  color: var(--c-rose);
}

body.theme-light .event-hero__breadcrumb,
body.theme-light .event-hero__breadcrumb a {
  color: var(--c-ink-soft);
}

body.theme-light .event-hero__breadcrumb a:hover {
  color: var(--c-rose);
}

/* ===== Register tabs (event page) =====
   Active state used --color-black bg + --color-white text. Re-skin to maroon. */
body.theme-light .register-tab {
  background: var(--c-cream);
  border-color: var(--c-line);
}

body.theme-light .register-tab:hover {
  border-color: var(--c-blush);
}

body.theme-light .register-tab--active {
  background: var(--c-maroon);
  border-color: var(--c-maroon);
}

body.theme-light .register-tab__eyebrow {
  color: var(--c-rose-deep);
}

body.theme-light .register-tab__title {
  color: var(--c-maroon);
}

body.theme-light .register-tab--active .register-tab__eyebrow {
  color: var(--c-blush-light);
}

body.theme-light .register-tab--active .register-tab__title {
  color: var(--c-cream);
}

body.theme-light .register-panel {
  background: var(--c-cream);
  border-color: var(--c-line);
}

body.theme-light .register-panel__intro {
  background: linear-gradient(135deg, var(--c-cream-warm), var(--c-cream));
  border-bottom-color: var(--c-line);
}

body.theme-light .register-panel__text {
  color: var(--c-ink-soft);
}

body.theme-light .register-panel__qr {
  background: var(--c-cream);
  border-color: var(--c-line);
}

body.theme-light .register-panel__qr span {
  color: var(--c-ink-soft);
}

/* ===== Services "custom-section" dark band =====
   Hardcoded background: --color-black + color: --color-white. */
body.theme-light .custom-section {
  background: var(--c-maroon);
  color: var(--c-cream);
}

/* ===== Misc gold-tint backdrops scattered across pages =====
   These are hardcoded rgba(212, 168, 67, x) tints (gold), recolor as blush. */
body.theme-light .mv-card--mission .mv-card__icon,
body.theme-light .mv-card--vision .mv-card__icon,
body.theme-light .event-highlight__icon {
  background: rgba(232, 165, 176, 0.18);
}

body.theme-light .venue-map {
  border-color: var(--c-line);
}

body.theme-light .form-group input:focus,
body.theme-light .form-group select:focus,
body.theme-light .form-group textarea:focus {
  box-shadow: 0 0 0 3px rgba(232, 165, 176, 0.25);
}