/* ============================================================
   MARY'S MANTLE — GOLD MODE SYSTEM
   Eucharistic gold gradients, glow, accents, overrides
   ============================================================ */

/* ROOT GOLD VARIABLES */
:root {
  --gold-1: #fef3c7;
  --gold-2: #fcd34d;
  --gold-3: #fbbf24;
  --gold-4: #f59e0b;
  --gold-glow: rgba(251, 191, 36, 0.45);
}

/* ENABLE GOLD MODE */
html[data-gold="on"] {
  --mm-text: var(--gold-3);
}

/* ============================================
   GLOBAL GOLD ACCENTS
============================================ */
html[data-gold="on"] body {
  background: radial-gradient(
    circle at 50% 0%,
    rgba(251, 191, 36, 0.08),
    transparent 70%
  );
}

/* GOLD TEXT */
html[data-gold="on"] .section-title,
html[data-gold="on"] .hero-title {
  color: var(--gold-3) !important;
}

html[data-gold="on"] .section-text,
html[data-gold="on"] .hero-subtitle {
  color: var(--gold-2) !important;
}

/* ============================================
   GOLD CTA BUTTON
============================================ */
html[data-gold="on"] .cta-button {
  background: linear-gradient(90deg, var(--gold-2), var(--gold-3)) !important;
  color: #3b2f00 !important;
  box-shadow: 0 0 12px var(--gold-glow);
}

/* ============================================
   GOLD MODE — MENU
============================================ */
html[data-gold="on"] .mm-nav {
  background: rgba(255, 248, 225, 0.55) !important;
  border-color: var(--gold-3) !important;
}

html[data-gold="on"] .mm-logo {
  color: var(--gold-3) !important;
}

html[data-gold="on"] .mm-link {
  color: var(--gold-3) !important;
}

html[data-gold="on"] .mm-link::after {
  background: linear-gradient(90deg, var(--gold-2), var(--gold-3)) !important;
}

html[data-gold="on"] .mm-theme-toggle {
  border-color: var(--gold-3) !important;
  color: var(--gold-3) !important;
}

/* ============================================
   GOLD MODE — FOOTER
============================================ */
html[data-gold="on"] .mm-footer {
  background: rgba(255, 248, 225, 0.55) !important;
  border-color: var(--gold-3) !important;
}

html[data-gold="on"] .mm-footer-title {
  color: var(--gold-3) !important;
}

html[data-gold="on"] .mm-footer-text,
html[data-gold="on"] .mm-footer-links a {
  color: var(--gold-3) !important;
}

/* ============================================
   GOLD MODE — HERO
============================================ */
html[data-gold="on"] .hero {
  background: linear-gradient(
    180deg,
    rgba(251, 191, 36, 0.25),
    rgba(251, 191, 36, 0.08)
  ) !important;
  border-bottom: 1px solid rgba(251, 191, 36, 0.25);
}

/* ============================================
   GOLD MODE — SECTION GLOW
============================================ */
html[data-gold="on"] section {
  border-left: 2px solid rgba(251, 191, 36, 0.25);
  border-right: 2px solid rgba(251, 191, 36, 0.25);
  box-shadow: 0 0 22px rgba(251, 191, 36, 0.12);
}

/* ============================================
   GOLD MODE — LOADER
============================================ */
html[data-gold="on"] .mm-loader-ring {
  border-top-color: var(--gold-3) !important;
  box-shadow: 0 0 20px var(--gold-glow) !important;
}

html[data-gold="on"] .mm-loader-glow {
  background: radial-gradient(
    circle,
    rgba(251, 191, 36, 0.35),
    rgba(251, 191, 36, 0.05),
    transparent
  ) !important;
}

html[data-gold="on"] .mm-loader-text {
  color: var(--gold-3) !important;
}