@import "tailwindcss";

@theme {
  --color-compubutton-secondary: #e46ad7;
  --color-compubutton-primary: #7d45fc;
  --color-compubutton-dark: #030712;
  --color-compubutton-light: #3530a2;
  --color-compubutton-shadow: #04408d;
  --color-compubutton-black: #000000;
  --color-compubutton-white: #ffffff;
  --color-blue-50: #f0faff;
  --color-blue-100: #e0f3fe;
  --color-blue-200: #bbe9fc;
  --color-blue-300: #7fd8fa;
  --color-blue-400: #3bc5f5;
  --color-blue-500: #12b3ec;
  --color-blue-600: #058cc4;
  --color-blue-700: #066f9e;
  --color-blue-800: #095e83;
  --color-blue-900: #0e4f6c;
  --color-blue-950: #093248;
  --color-blue: #12b3ec;
  --color-green-50: #effefc;
  --color-green-100: #c8fff8;
  --color-green-200: #91fef3;
  --color-green-300: #42f6eb;
  --color-green-400: #1ee3dd;
  --color-green-500: #05c7c5;
  --color-green-600: #019fa0;
  --color-green-700: #067c7f;
  --color-green-800: #0a6265;
  --color-green-900: #0e5053;
  --color-green-950: #002f33;
  --color-green: #05c7c5;
  --color-red-50: #fef2f2;
  --color-red-100: #fee5e8;
  --color-red-200: #fccfd6;
  --color-red-300: #f9a8b4;
  --color-red-400: #f5778c;
  --color-red-500: #ed4667;
  --color-red-600: #d92551;
  --color-red-700: #b71944;
  --color-red-800: #99183f;
  --color-red-900: #83183c;
  --color-red-950: #49081c;
  --color-red: #ed4667;
  --color-yellow-50: #fefde8;
  --color-yellow-100: #fffdc2;
  --color-yellow-200: #fff688;
  --color-yellow-300: #ffea44;
  --color-yellow-400: #fed811;
  --color-yellow-500: #e4b704;
  --color-yellow-600: #cd9401;
  --color-yellow-700: #a46904;
  --color-yellow-800: #87520c;
  --color-yellow-900: #734310;
  --color-yellow-950: #432305;
  --color-yellow: #e4b704;
}


html,
body {
  @apply bg-gray-50 dark:bg-gray-950;

  @media (prefers-color-scheme: dark) {
    color-scheme: dark;
  }
}
