/**
 * CSS Variables for Theme Colors
 * Supports Light, Dark, and System themes
 */

/* Light Theme (Default) */
:root,
[data-theme="light"] {
  /* Primary Colors */
  --primary-olive: #547830;
  --primary-olive-dark: #3e5a23;
  --primary-olive-light: #6a9b3c;

  /* Accent Colors */
  --accent-gold: #c5a059;
  --accent-gold-light: #d4b576;

  /* Background Colors */
  --bg-primary: #ffffff;
  --bg-secondary: #f5f5f5;
  --bg-tertiary: #fbfbfb;
  --bg-card: #ffffff;
  --bg-nav: rgba(255, 255, 255, 0.8);

  /* Text Colors */
  --text-primary: #2d2d2d;
  --text-secondary: #525252;
  --text-tertiary: #737373;
  --text-muted: #a3a3a3;
  --text-light: #ffffff;

  /* Border Colors */
  --border-light: #e5e7eb;
  --border-medium: #d4d4d4;
  --border-dark: #a3a3a3;

  /* Shadow Colors */
  --shadow-sm: rgba(0, 0, 0, 0.05);
  --shadow-md: rgba(0, 0, 0, 0.1);
  --shadow-lg: rgba(0, 0, 0, 0.15);

  /* Gradient Colors */
  --gradient-overlay: rgba(0, 0, 0, 0.5);
  --gradient-overlay-light: rgba(0, 0, 0, 0.3);

  /* Footer Colors */
  --footer-bg: #18181b;
  --footer-text: #737373;
  --footer-border: #27272a;
}

/* Dark Theme */
[data-theme="dark"] {
  /* Primary Colors */
  --primary-olive: #6a9b3c;
  --primary-olive-dark: #547830;
  --primary-olive-light: #7eb347;

  /* Accent Colors */
  --accent-gold: #d4b576;
  --accent-gold-light: #e3c68a;

  /* Background Colors */
  --bg-primary: #0a0a0a;
  --bg-secondary: #171717;
  --bg-tertiary: #1f1f1f;
  --bg-card: #1f1f1f;
  --bg-nav: rgba(10, 10, 10, 0.8);

  /* Text Colors */
  --text-primary: #fafafa;
  --text-secondary: #d4d4d4;
  --text-tertiary: #a3a3a3;
  --text-muted: #737373;
  --text-light: #ffffff;

  /* Border Colors */
  --border-light: #262626;
  --border-medium: #3f3f3f;
  --border-dark: #525252;

  /* Shadow Colors */
  --shadow-sm: rgba(0, 0, 0, 0.3);
  --shadow-md: rgba(0, 0, 0, 0.5);
  --shadow-lg: rgba(0, 0, 0, 0.7);

  /* Gradient Colors */
  --gradient-overlay: rgba(0, 0, 0, 0.7);
  --gradient-overlay-light: rgba(0, 0, 0, 0.5);

  /* Footer Colors */
  --footer-bg: #000000;
  --footer-text: #a3a3a3;
  --footer-border: #262626;
}

/* System Theme - Follows OS preference */
@media (prefers-color-scheme: dark) {
  [data-theme="system"] {
    /* Primary Colors */
    --primary-olive: #6a9b3c;
    --primary-olive-dark: #547830;
    --primary-olive-light: #7eb347;

    /* Accent Colors */
    --accent-gold: #d4b576;
    --accent-gold-light: #e3c68a;

    /* Background Colors */
    --bg-primary: #0a0a0a;
    --bg-secondary: #171717;
    --bg-tertiary: #1f1f1f;
    --bg-card: #1f1f1f;
    --bg-nav: rgba(10, 10, 10, 0.8);

    /* Text Colors */
    --text-primary: #fafafa;
    --text-secondary: #d4d4d4;
    --text-tertiary: #a3a3a3;
    --text-muted: #737373;
    --text-light: #ffffff;

    /* Border Colors */
    --border-light: #262626;
    --border-medium: #3f3f3f;
    --border-dark: #525252;

    /* Shadow Colors */
    --shadow-sm: rgba(0, 0, 0, 0.3);
    --shadow-md: rgba(0, 0, 0, 0.5);
    --shadow-lg: rgba(0, 0, 0, 0.7);

    /* Gradient Colors */
    --gradient-overlay: rgba(0, 0, 0, 0.7);
    --gradient-overlay-light: rgba(0, 0, 0, 0.5);

    /* Footer Colors */
    --footer-bg: #000000;
    --footer-text: #a3a3a3;
    --footer-border: #262626;
  }
}

@media (prefers-color-scheme: light) {
  [data-theme="system"] {
    /* Primary Colors */
    --primary-olive: #547830;
    --primary-olive-dark: #3e5a23;
    --primary-olive-light: #6a9b3c;

    /* Accent Colors */
    --accent-gold: #c5a059;
    --accent-gold-light: #d4b576;

    /* Background Colors */
    --bg-primary: #ffffff;
    --bg-secondary: #f5f5f5;
    --bg-tertiary: #fbfbfb;
    --bg-card: #ffffff;
    --bg-nav: rgba(255, 255, 255, 0.8);

    /* Text Colors */
    --text-primary: #2d2d2d;
    --text-secondary: #525252;
    --text-tertiary: #737373;
    --text-muted: #a3a3a3;
    --text-light: #ffffff;

    /* Border Colors */
    --border-light: #e5e7eb;
    --border-medium: #d4d4d4;
    --border-dark: #a3a3a3;

    /* Shadow Colors */
    --shadow-sm: rgba(0, 0, 0, 0.05);
    --shadow-md: rgba(0, 0, 0, 0.1);
    --shadow-lg: rgba(0, 0, 0, 0.15);

    /* Gradient Colors */
    --gradient-overlay: rgba(0, 0, 0, 0.5);
    --gradient-overlay-light: rgba(0, 0, 0, 0.3);

    /* Footer Colors */
    --footer-bg: #18181b;
    --footer-text: #737373;
    --footer-border: #27272a;
  }
}

/* Transition for smooth theme switching */
* {
  transition: background-color 0.3s ease, color 0.3s ease,
    border-color 0.3s ease;
}

/* Exceptions for elements that shouldn't transition */
img,
video,
iframe,
canvas,
svg {
  transition: none !important;
}