/* ============================================================
   THEMES.CSS — 4 color palettes
   ============================================================ */

/* ---------- EMERALD (default) ---------- */
body[data-theme="emerald"] {
  --bg:           #0d1117;
  --bg-elev:      #161b22;
  --bg-panel:     #1c2128;
  --border:       #30363d;

  --text:         #e6edf3;
  --text-dim:     #8b949e;
  --text-mute:    #6e7681;

  --accent:       #d4a341;
  --accent-hover: #e0b048;
  --accent-on:    #0d1117;
  --accent-glow:  rgba(212, 163, 65, 0.55);

  --name-gradient: linear-gradient(180deg, #ffffff 0%, #d4a341 100%);
}

/* ---------- VIOLET ---------- */
body[data-theme="violet"] {
  --bg:           #0e0b1f;
  --bg-elev:      #17102e;
  --bg-panel:     #1e1638;
  --border:       #2e2350;

  --text:         #f2ebff;
  --text-dim:     #a99fc4;
  --text-mute:    #7a719a;

  --accent:       #a78bfa;
  --accent-hover: #b8a1ff;
  --accent-on:    #0e0b1f;
  --accent-glow:  rgba(167, 139, 250, 0.55);

  --name-gradient: linear-gradient(180deg, #ffffff 0%, #a78bfa 50%, #f472b6 100%);
}

/* ---------- OCEAN ---------- */
body[data-theme="ocean"] {
  --bg:           #05141f;
  --bg-elev:      #0a1e2d;
  --bg-panel:     #0f2838;
  --border:       #1c3d54;

  --text:         #e0f4ff;
  --text-dim:     #7ba6c0;
  --text-mute:    #527792;

  --accent:       #38bdf8;
  --accent-hover: #5ecbff;
  --accent-on:    #05141f;
  --accent-glow:  rgba(56, 189, 248, 0.55);

  --name-gradient: linear-gradient(180deg, #ffffff 0%, #38bdf8 60%, #06b6d4 100%);
}

/* ---------- SUNSET ---------- */
body[data-theme="sunset"] {
  --bg:           #150810;
  --bg-elev:      #200d1a;
  --bg-panel:     #2a1223;
  --border:       #4a2036;

  --text:         #ffeede;
  --text-dim:     #c09aa4;
  --text-mute:    #8c6d7a;

  --accent:       #fb923c;
  --accent-hover: #ffa657;
  --accent-on:    #150810;
  --accent-glow:  rgba(251, 146, 60, 0.55);

  --name-gradient: linear-gradient(180deg, #ffffff 0%, #fb923c 50%, #f43f5e 100%);
}
/* ---------- DARK NAVY ---------- */
body[data-theme="navy"] {
  --bg:           #000052;
  --bg-elev:      #000066;
  --bg-panel:     #000078;
  --border:       #1a1a8a;

  --text:         #e6edf3;
  --text-dim:     #a8b6d8;
  --text-mute:    #6b7ba3;

  --accent:       #3b82f6;
  --accent-hover: #60a5fa;
  --accent-on:    #ffffff;
  --accent-glow:  rgba(59, 130, 246, 0.55);

  --name-gradient: linear-gradient(180deg, #ffffff 0%, #3b82f6 100%);
}