/*
 * Purple Anime Aesthetic Color Palette
 * Extracted from anime image - purple/lavender/burgundy theme
 *
 * Import this file in all layouts to maintain consistent colors sitewide
 */

:root {
  /* Backgrounds - Cream and Lavender */
  --bg-primary: #F5F0ED;        /* Soft cream background */
  --bg-secondary: #E8DCF0;      /* Light lavender */
  --bg-elevated: #D4C5E0;       /* Medium lavender */
  --bg-tertiary: #b87396;       /* Mauve purple */

  /* Text Colors - Purple tones */
  --text-primary: #4A4266;      /* Deep navy purple (main text) */
  --text-secondary: #6B5A7A;    /* Muted purple (dimmed text) */
  --text-tertiary: #B4A7D6;     /* Light purple (subtle text) */

  /* Accent Colors - Purple and Burgundy */
  --accent-red: #8B4757;        /* Burgundy accent (name, special elements) */
  --accent-green: #6B5B95;      /* Deep purple (primary accent) */
  --accent-green-bright: #7B6FA3; /* Bright purple (emphasis) */
  --accent-wolf: #6B5B95;       /* Deep purple alternate */
  --accent-silver: #4A4266;     /* Navy purple highlights */
  --accent-silver-dim: #6B5A7A; /* Dimmed purple */

  /* Semantic Colors */
  --border-faint: #E8DCF0;      /* Subtle borders (light lavender) */
  --border-visible: #B4A7D6;    /* More visible borders (medium lavender) */
  --shadow: rgba(107, 91, 149, 0.2); /* Purple shadow */

  /* Legacy aliases for compatibility */
  --bg: var(--bg-primary);
  --text: var(--text-primary);
  --dim: var(--text-secondary);
  --faint: var(--border-faint);
}

/*
 * Color Reference Guide
 * ---------------------
 *
 * Cream/Backgrounds:
 *   #F5F0ED - Main background (--bg-primary)
 *   #E8DCF0 - Light lavender sidebars/cards (--bg-secondary)
 *   #D4C5E0 - Medium lavender elevated elements (--bg-elevated)
 *
 * Purples:
 *   #4A4266 - Dark navy purple for text and borders (--text-primary)
 *   #6B5A7A - Muted purple for secondary text (--text-secondary)
 *   #6B5B95 - Deep purple for links and accents (--accent-green)
 *   #7B6FA3 - Bright purple for hover states (--accent-green-bright)
 *   #B4A7D6 - Light lavender for subtle elements (--text-tertiary)
 *
 * Burgundy:
 *   #8B4757 - Rich burgundy for special accents (--accent-red)
 *
 * Usage Examples:
 *   background: var(--bg-primary);
 *   color: var(--text-primary);
 *   border: 1px solid var(--border-visible);
 *   box-shadow: 0 4px 8px var(--shadow);
 */