/**
 * Light Theme - Warm Minimalist Palette
 * Clean, elegant, warm light mode with limited Glia brand colors
 */

:root[data-theme="light"] {
  /* ===== COLOR PALETTE ===== */

  /* Backgrounds - Softer, warmer, less eye-strain */
  --color-background: #F5F1E8;        /* Warmer beige (less white, more comfortable) */
  --color-surface: #FDFBF7;           /* Subtle warm off-white (not pure white) */
  --color-surface-elevated: #FFFFFF;  /* Pure white only for elevated elements */
  --color-surface-overlay: rgba(253, 251, 247, 0.95); /* Semi-transparent overlays */

  /* Gradients */
  --overlay-gradient: linear-gradient(180deg, rgba(245, 241, 232, 0.92) 0%, rgba(245, 241, 232, 0.6) 55%, transparent 100%);

  /* Primary Colors (Glia Brand) - Olive Green */
  --color-primary: #5C6C4A;           /* Glia olive green */
  --color-primary-hover: #6B7D57;     /* Lighter on hover */
  --color-primary-active: #4D5A3E;    /* Darker on active */
  --color-primary-subtle: rgba(92, 108, 74, 0.1); /* Subtle backgrounds */

  /* Accent Colors - Muted Gold/Tan */
  --color-accent: #A88B5C;            /* Darker, muted tan/gold for better contrast */
  --color-accent-hover: #B89764;      /* Lighter on hover */
  --color-accent-active: #967D4F;     /* Darker on active */
  --color-accent-subtle: rgba(168, 139, 92, 0.12); /* Subtle backgrounds */

  /* Text Colors - Warm, readable */
  --color-text-primary: #3A3732;      /* Warm dark gray (not pure black) */
  --color-text-secondary: #6B6760;    /* Warm medium gray */
  --color-text-tertiary: #9C9790;     /* Warm light gray */
  --color-text-inverse: #FDFBF7;      /* Off-white text on dark backgrounds */

  /* Semantic Colors - Consistent palette */
  --color-success: #5C8A52;           /* Green success */
  --color-warning: #A88B5C;           /* Tan warning (accent) */
  --color-danger: #B35A4F;            /* Warm red danger */
  --color-info: #6A8FA8;              /* Blue info */

  /* Borders & Dividers - Warm tones */
  --color-border: rgba(58, 55, 50, 0.12); /* Subtle warm borders */
  --color-border-hover: rgba(58, 55, 50, 0.2); /* Hover borders */
  --color-divider: rgba(58, 55, 50, 0.08); /* Section dividers */

  /* Shadows - Softer, warmer */
  --shadow-sm: 0 1px 2px rgba(58, 55, 50, 0.08);
  --shadow-md: 0 4px 6px rgba(58, 55, 50, 0.08), 0 2px 4px rgba(58, 55, 50, 0.06);
  --shadow-lg: 0 10px 15px rgba(58, 55, 50, 0.12), 0 4px 6px rgba(58, 55, 50, 0.06);
  --shadow-xl: 0 20px 25px rgba(58, 55, 50, 0.15), 0 10px 10px rgba(58, 55, 50, 0.08);

  /* Glows (for particle effects) - Dark particles for light theme */
  --glow-primary: rgba(92, 108, 74, 0.4);
  --glow-accent: rgba(168, 139, 92, 0.4);

  /* Particle color for light theme - DARK for contrast */
  --particle-color: #4D5A3E;          /* Dark olive for particles on light background */

  /* ===== SPACING & LAYOUT ===== */
  --spacing-xs: 0.25rem;    /* 4px */
  --spacing-sm: 0.5rem;     /* 8px */
  --spacing-md: 1rem;       /* 16px */
  --spacing-lg: 1.5rem;     /* 24px */
  --spacing-xl: 2rem;       /* 32px */
  --spacing-2xl: 3rem;      /* 48px */

  /* ===== TYPOGRAPHY ===== */
  --font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-size-xs: 0.75rem;   /* 12px */
  --font-size-sm: 0.875rem;  /* 14px */
  --font-size-base: 1rem;    /* 16px */
  --font-size-lg: 1.125rem;  /* 18px */
  --font-size-xl: 1.25rem;   /* 20px */
  --font-size-2xl: 1.5rem;   /* 24px */
  --font-size-3xl: 2rem;     /* 32px */
  --font-size-4xl: 3rem;     /* 48px */

  --font-weight-normal: 400;
  --font-weight-medium: 500;
  --font-weight-semibold: 600;
  --font-weight-bold: 700;

  --line-height-tight: 1.2;
  --line-height-normal: 1.5;
  --line-height-relaxed: 1.75;

  /* ===== BORDER RADIUS ===== */
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 12px;
  --radius-xl: 16px;
  --radius-full: 9999px;

  /* ===== TRANSITIONS ===== */
  --transition-fast: 150ms ease;
  --transition-base: 250ms ease;
  --transition-slow: 350ms ease;
  --transition-theme: 300ms ease-in-out; /* For theme switching */

  /* ===== Z-INDEX LAYERS ===== */
  --z-base: 0;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-fixed: 300;
  --z-modal-overlay: 400;
  --z-modal: 500;
  --z-popover: 600;
  --z-tooltip: 700;
}

/* ===== SMOOTH THEME TRANSITIONS ===== */
:root[data-theme="light"] * {
  transition: background-color var(--transition-theme),
              border-color var(--transition-theme),
              color var(--transition-theme),
              box-shadow var(--transition-theme);
}

/* Prevent transition on initial load */
:root[data-theme="light"].no-transition * {
  transition: none !important;
}