/* MyMicroApp Theme System
 * Premium feature - popular developer color themes
 * Free users get Blue Sky theme, premium unlocks popular themes
 * Themes: Dracula, Nord, Catppuccin, and more
 *
 * Sources:
 * - Dracula: https://draculatheme.com/spec
 * - Nord: https://www.nordtheme.com/docs/colors-and-palettes
 * - Catppuccin: https://catppuccin.com/palette
 */

/* Default Theme - Blue Sky (Free) */
:root {
  --background: 210 20% 98%;
  --foreground: 222 47% 11%;
  --card: 0 0% 100%;
  --card-foreground: 222 47% 11%;
  --surface: 210 20% 96%;
  --surface-foreground: 222 47% 11%;
  --primary: 217 91% 60%;
  --primary-foreground: 0 0% 100%;
  --secondary: 210 20% 96%;
  --secondary-foreground: 222 47% 11%;
  --muted: 210 20% 96%;
  --muted-foreground: 215 16% 47%;
  --accent: 217 91% 60%;
  --accent-foreground: 0 0% 100%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 100%;
  --success: 142 71% 45%;
  --success-foreground: 0 0% 100%;
  --warning: 38 92% 50%;
  --warning-foreground: 0 0% 100%;
  --border: 214 32% 91%;
  --input: 214 32% 91%;
  --ring: 217 91% 60%;
}

@media (prefers-color-scheme: dark) {
  :root {
    --background: 222 47% 11%;
    --foreground: 210 40% 98%;
    --card: 222 47% 15%;
    --card-foreground: 210 40% 98%;
    --surface: 217 33% 17%;
    --surface-foreground: 210 40% 98%;
    --primary: 217 91% 60%;
    --primary-foreground: 222 47% 11%;
    --secondary: 217 33% 17%;
    --secondary-foreground: 210 40% 98%;
    --muted: 217 33% 17%;
    --muted-foreground: 215 20% 65%;
    --accent: 217 91% 60%;
    --accent-foreground: 222 47% 11%;
    --destructive: 0 63% 31%;
    --destructive-foreground: 210 40% 98%;
    --success: 142 71% 45%;
    --success-foreground: 210 40% 98%;
    --warning: 38 92% 50%;
    --warning-foreground: 0 0% 0%;
    --border: 217 33% 24%;
    --input: 217 33% 24%;
    --ring: 217 91% 60%;
  }
}

/* Theme: Dracula - Purple & Pink vampire theme (Premium)
 * Official colors from https://draculatheme.com/spec
 * Background: #282A36, Foreground: #F8F8F2
 * Accent colors: Purple #BD93F9, Pink #FF79C6, Cyan #8BE9FD, Green #50FA7B
 */
[data-theme="dracula"] {
  --background: 231 15% 18%;    /* #282A36 */
  --foreground: 60 30% 96%;     /* #F8F8F2 */
  --card: 232 14% 22%;          /* Slightly lighter than background */
  --card-foreground: 60 30% 96%;
  --surface: 233 15% 26%;       /* Surface: #44475A (Selection) */
  --surface-foreground: 60 30% 96%;
  --primary: 265 89% 78%;       /* Purple: #BD93F9 */
  --primary-foreground: 231 15% 18%;
  --secondary: 233 15% 26%;
  --secondary-foreground: 60 30% 96%;
  --muted: 233 15% 26%;
  --muted-foreground: 225 15% 56%;  /* Comment: #6272A4 */
  --accent: 326 100% 74%;       /* Pink: #FF79C6 */
  --accent-foreground: 231 15% 18%;
  --destructive: 0 100% 67%;    /* Red: #FF5555 */
  --destructive-foreground: 60 30% 96%;
  --success: 135 94% 65%;       /* Green: #50FA7B */
  --success-foreground: 231 15% 18%;
  --warning: 65 92% 76%;        /* Yellow: #F1FA8C */
  --warning-foreground: 231 15% 18%;
  --border: 233 15% 30%;
  --input: 233 15% 30%;
  --ring: 265 89% 78%;
}

/* Theme: Alucard - Dracula light variant (Premium) */
[data-theme="alucard"] {
  --background: 45 100% 96%;    /* #FFFBEB */
  --foreground: 0 0% 12%;       /* #1F1F1F */
  --card: 0 0% 100%;
  --card-foreground: 0 0% 12%;
  --surface: 250 12% 87%;       /* Selection: #CFCFDE */
  --surface-foreground: 0 0% 12%;
  --primary: 249 58% 53%;       /* Purple: #644AC9 */
  --primary-foreground: 0 0% 100%;
  --secondary: 250 12% 87%;
  --secondary-foreground: 0 0% 12%;
  --muted: 250 12% 87%;
  --muted-foreground: 42 16% 35%;  /* Comment: #6C664B */
  --accent: 332 78% 46%;        /* Pink: #A3144D */
  --accent-foreground: 0 0% 100%;
  --destructive: 5 66% 48%;     /* Red: #CB3A2A */
  --destructive-foreground: 0 0% 100%;
  --success: 115 84% 24%;       /* Green: #14710A */
  --success-foreground: 0 0% 100%;
  --warning: 44 73% 30%;        /* Yellow: #846E15 */
  --warning-foreground: 0 0% 100%;
  --border: 250 12% 82%;
  --input: 250 12% 82%;
  --ring: 249 58% 53%;
}

/* Theme: Nord - Arctic blue minimal theme (Premium)
 * Official colors from https://www.nordtheme.com/docs/colors-and-palettes
 * Polar Night (dark), Snow Storm (light), Frost (blue accents), Aurora (colorful)
 */
[data-theme="nord"] {
  --background: 220 16% 22%;    /* nord0: #2e3440 */
  --foreground: 218 27% 94%;    /* nord6: #eceff4 */
  --card: 220 17% 26%;          /* nord1: #3b4252 */
  --card-foreground: 218 27% 94%;
  --surface: 222 16% 28%;       /* nord2: #434c5e */
  --surface-foreground: 218 27% 94%;
  --primary: 213 32% 52%;       /* nord10: #5e81ac */
  --primary-foreground: 218 27% 94%;
  --secondary: 222 16% 28%;
  --secondary-foreground: 218 27% 94%;
  --muted: 220 16% 36%;         /* nord3: #4c566a */
  --muted-foreground: 219 28% 88%;  /* nord4: #d8dee9 */
  --accent: 193 43% 67%;        /* nord8: #88c0d0 */
  --accent-foreground: 220 16% 22%;
  --destructive: 354 42% 56%;   /* nord11: #bf616a */
  --destructive-foreground: 218 27% 94%;
  --success: 92 28% 65%;        /* nord14: #a3be8c */
  --success-foreground: 220 16% 22%;
  --warning: 40 71% 73%;        /* nord13: #ebcb8b */
  --warning-foreground: 220 16% 22%;
  --border: 220 16% 36%;
  --input: 220 16% 36%;
  --ring: 213 32% 52%;
}

/* Theme: Catppuccin Mocha - Dark pastel theme (Premium)
 * Official colors from https://catppuccin.com/palette
 * Soothing pastel colors designed for long coding sessions
 */
[data-theme="catppuccin-mocha"] {
  --background: 240 21% 15%;    /* Base: #1e1e2e */
  --foreground: 226 64% 88%;    /* Text: #cdd6f4 */
  --card: 237 16% 23%;          /* Surface0: #313244 */
  --card-foreground: 226 64% 88%;
  --surface: 233 12% 31%;       /* Surface1: #45475a */
  --surface-foreground: 226 64% 88%;
  --primary: 217 92% 76%;       /* Blue: #89b4fa */
  --primary-foreground: 240 21% 15%;
  --secondary: 233 12% 31%;
  --secondary-foreground: 226 64% 88%;
  --muted: 237 13% 20%;         /* Mantle: #181825 */
  --muted-foreground: 228 24% 72%;  /* Subtext1: #bac2de */
  --accent: 267 84% 81%;        /* Mauve: #cba6f7 */
  --accent-foreground: 240 21% 15%;
  --destructive: 343 81% 75%;   /* Red: #f38ba8 */
  --destructive-foreground: 240 21% 15%;
  --success: 115 54% 76%;       /* Green: #a6e3a1 */
  --success-foreground: 240 21% 15%;
  --warning: 41 86% 83%;        /* Yellow: #f9e2af */
  --warning-foreground: 240 21% 15%;
  --border: 234 13% 25%;        /* Surface2: #585b70 */
  --input: 234 13% 25%;
  --ring: 217 92% 76%;
}

/* Theme: Catppuccin Latte - Light pastel theme (Premium)
 * Lightest Catppuccin flavor, harmonious warm colors
 */
[data-theme="catppuccin-latte"] {
  --background: 220 23% 95%;    /* Base: #eff1f5 */
  --foreground: 234 16% 35%;    /* Text: #4c4f69 */
  --card: 220 22% 90%;          /* Surface0: #ccd0da */
  --card-foreground: 234 16% 35%;
  --surface: 223 16% 83%;       /* Surface1: #bcc0cc */
  --surface-foreground: 234 16% 35%;
  --primary: 220 91% 54%;       /* Blue: #1e66f5 */
  --primary-foreground: 0 0% 100%;
  --secondary: 223 16% 83%;
  --secondary-foreground: 234 16% 35%;
  --muted: 220 21% 89%;         /* Mantle: #e6e9ef */
  --muted-foreground: 233 13% 41%;  /* Subtext1: #5c5f77 */
  --accent: 266 85% 58%;        /* Mauve: #8839ef */
  --accent-foreground: 0 0% 100%;
  --destructive: 347 87% 44%;   /* Red: #d20f39 */
  --destructive-foreground: 0 0% 100%;
  --success: 109 58% 40%;       /* Green: #40a02b */
  --success-foreground: 0 0% 100%;
  --warning: 35 77% 49%;        /* Yellow: #df8e1d */
  --warning-foreground: 0 0% 100%;
  --border: 220 17% 78%;        /* Surface2: #acb0be */
  --input: 220 17% 78%;
  --ring: 220 91% 54%;
}

/* Theme: Solarized Dark - Precision color for reduced eye strain (Premium)
 * Official colors from https://ethanschoonover.com/solarized
 * Created by Ethan Schoonover with precise CIELAB lightness relationships
 * Background: base03 #002b36, Foreground: base0 #839496
 */
[data-theme="solarized-dark"] {
  --background: 192 100% 11%;   /* base03: #002b36 */
  --foreground: 186 13% 55%;    /* base0: #839496 */
  --card: 192 90% 13%;          /* base02: #073642 */
  --card-foreground: 186 13% 55%;
  --surface: 194 14% 40%;       /* base01: #586e75 */
  --surface-foreground: 186 13% 55%;
  --primary: 205 69% 49%;       /* blue: #268bd2 */
  --primary-foreground: 192 100% 11%;
  --secondary: 194 14% 40%;
  --secondary-foreground: 186 13% 55%;
  --muted: 192 90% 13%;
  --muted-foreground: 180 7% 60%;   /* base1: #93a1a1 */
  --accent: 175 59% 40%;        /* cyan: #2aa198 */
  --accent-foreground: 192 100% 11%;
  --destructive: 1 71% 52%;     /* red: #dc322f */
  --destructive-foreground: 44 87% 94%;
  --success: 68 100% 30%;       /* green: #859900 */
  --success-foreground: 44 87% 94%;
  --warning: 45 100% 35%;       /* yellow: #b58900 */
  --warning-foreground: 192 100% 11%;
  --border: 194 25% 27%;
  --input: 194 25% 27%;
  --ring: 205 69% 49%;
}

/* Theme: Solarized Light - Precision color for reduced eye strain (Premium)
 * Light variant using base3 background and base00 foreground
 */
[data-theme="solarized-light"] {
  --background: 44 87% 94%;     /* base3: #fdf6e3 */
  --foreground: 195 7% 43%;     /* base00: #657b83 */
  --card: 45 44% 92%;           /* base2: #eee8d5 */
  --card-foreground: 195 7% 43%;
  --surface: 180 7% 60%;        /* base1: #93a1a1 */
  --surface-foreground: 195 7% 43%;
  --primary: 205 69% 49%;       /* blue: #268bd2 */
  --primary-foreground: 0 0% 100%;
  --secondary: 180 7% 60%;
  --secondary-foreground: 195 7% 43%;
  --muted: 45 44% 92%;
  --muted-foreground: 194 14% 40%;  /* base01: #586e75 */
  --accent: 175 59% 40%;        /* cyan: #2aa198 */
  --accent-foreground: 0 0% 100%;
  --destructive: 1 71% 52%;     /* red: #dc322f */
  --destructive-foreground: 0 0% 100%;
  --success: 68 100% 30%;       /* green: #859900 */
  --success-foreground: 0 0% 100%;
  --warning: 45 100% 35%;       /* yellow: #b58900 */
  --warning-foreground: 0 0% 100%;
  --border: 180 7% 65%;
  --input: 180 7% 65%;
  --ring: 205 69% 49%;
}