:root {
  /* Existing colors */
  --bg-color: #0a0a0a;
  --text-color: #fff;
  --accent-color: #0ef;
  --header-bg: rgba(0, 0, 0, 0.7);

  /* Added for login/register pages */
  --card-bg: rgba(255, 255, 255, 0.1);
  --card-shadow: rgba(0, 0, 0, 0.4);
  --input-bg: rgba(255, 255, 255, 0.2);
  --input-focus-bg: rgba(255, 255, 255, 0.3);
  --button-bg: #fff;
  --button-text: #111;
  --button-hover-bg: #0ef;
  --transition: all 0.3s ease;
}

.light-theme {
  --bg-color: #f5f5f5;
  --text-color: #111;
  --accent-color: #0077ff;
  --header-bg: rgba(255, 255, 255, 0.8);

  /* Light theme overrides */
  --card-bg: rgba(0, 0, 0, 0.08);
  --card-shadow: rgba(0, 0, 0, 0.2);
  --input-bg: rgba(0, 0, 0, 0.06);
  --input-focus-bg: rgba(0, 0, 0, 0.12);
  --button-bg: #111;
  --button-text: #fff;
  --button-hover-bg: #0077ff;
}

/* Transition for theme switch */
* {
  transition: var(--transition);
}
 body {
      background: linear-gradient(135deg, var(--bg-color), #1a1a1a);
      color: var(--text-color);
      font-family: 'Poppins', sans-serif;
    }