@tailwind base;

/* FOUNDATIONAL COLOR PALETTE DECLARATIONS */

@layer base {
  :root {
    --white: 0, 0%, 100%; /* #FFFFFF */
    --black: 0, 0%, 0%; /* #000000 */

    --gray-50: 0, 0%, 97%; /* #F7F7F7 +1 */
    --gray-100: 0, 0%, 93%; /* #EDEDED ±1 */ /* TODO: Confirm */
    --gray-150: 0, 0%, 87%; /* #DEDEDE ±1 */ /*  TODO: Confirm */
    --gray-200: 0, 0%, 81%; /* #CECECE +1 */
    --gray-300: 0, 0%, 67%; /* #ABABAB ±1 */
    --gray-400: 0, 0%, 55%; /* #8C8C8C ±1 */
    --gray-500: 0, 0%, 38%; /* #616161 ±1 */
    --gray-600: 0, 0%, 20%; /* #333333 ±1 */
    --gray-700: 0, 0%, 13%; /* #222222 -2 */
    --gray-800: 0, 0%, 11%; /* #1B1B1B +2 */
    --gray-900: 0, 0%, 7%; /* #121212 ±1 */
    --gray-950: 0, 0%, 4%; /* #0A0A0A ±1 */

    --purple-50: 262, 100%, 96%; /* #F3ECFF */
    --purple-100: 263, 100%, 94%; /* #EDE2FF */
    --purple-200: 263, 91%, 88%; /* #DAC5FC */
    --purple-300: 263, 94%, 84%; /* #CCAFFC */
    --purple-400: 263, 77%, 75%; /* #B38DF0 */
    --purple-500: 263, 88%, 65%; /* #945AF4 */
    --purple-600: 263, 75%, 51%; /* #6C24DF */
    --purple-700: 263, 74%, 41%; /* #561BB5 */
    --purple-800: 263, 77%, 31%; /* #41128B */
    --purple-900: 263, 86%, 15%; /* #1E0546 */

    --blue-50: 214, 100%, 99%; /* #F8FBFF */
    --blue-100: 217, 100%, 95%; /* #E8F1FF */
    --blue-200: 214, 86%, 89%; /* #CADFFB */
    --blue-300: 221, 79%, 74%; /* #88AAF1 */
    --blue-400: 221, 90%, 69%; /* #6995F7 */
    --blue-500: 224, 84%, 60%; /* #4473EF */
    --blue-600: 235, 81%, 58%; /* #3C4CEB */
    --blue-700: 235, 59%, 41%; /* #2B36A8 */
    --blue-800: 231, 53%, 29%; /* #232F71 */
    --blue-900: 217, 36%, 17%; /* #1B273A */

    --pink-50: 325, 63%, 93%; /* #F8E0EE */
    --pink-100: 322, 78%, 87%; /* #F8C5E5 */
    --pink-200: 323, 100%, 85%; /* #FFB2E2 */
    --pink-300: 323, 100%, 83%; /* #FFA6DD */
    --pink-400: 323, 91%, 75%; /* #F986CD */
    --pink-500: 323, 100%, 66%; /* #FF51BC */
    --pink-600: 323, 93%, 51%; /* #F6109E */
    --pink-700: 323, 99%, 39%; /* #C7017B */
    --pink-800: 323, 87%, 29%; /* #8C0A5A */
    --pink-900: 323, 82%, 18%; /* #530836 */

    --teal-50: 164, 100%, 98%; /* #F4FFFC */
    --teal-100: 164, 79%, 95%; /* #E6FCF6 */
    --teal-200: 163, 81%, 85%; /* #BBF8E7 */
    --teal-300: 163, 96%, 78%; /* #91FDDE */
    --teal-400: 163, 90%, 65%; /* #58F6C9 */
    --teal-500: 163, 76%, 48%; /* #1DD8A3 */
    --teal-600: 163, 88%, 39%; /* #0CB988 */
    --teal-700: 163, 82%, 33%; /* #0F9971 */
    --teal-800: 163, 93%, 21%; /* #04674B */
    --teal-900: 162, 97%, 13%; /* #01422F */

    --yellow-50: 48, 100%, 96%; /* #FFFBEB */
    --yellow-100: 48, 96%, 89%; /* #FEF3C7 */
    --yellow-200: 48, 97%, 77%; /* #FDE68A */
    --yellow-300: 46, 97%, 65%; /* #FCD34D */
    --yellow-400: 43, 96%, 56%; /* #FBBF24 */
    --yellow-500: 38, 92%, 50%; /* #F59E0B */
    --yellow-600: 32, 95%, 44%; /* #D97706 */
    --yellow-700: 26, 90%, 37%; /* #B45309 */
    --yellow-800: 23, 88%, 22%; /* #6B2D07 */
    --yellow-900: 22, 84%, 15%; /* #471E06 */

    --red-50: 0, 86%, 97%; /* #fef2f2 */
    --red-100: 0, 93%, 94%; /* #fee2e2 */
    --red-200: 0, 96%, 89%; /* #fecaca */
    --red-300: 0, 94%, 82%; /* #fca5a5 */
    --red-400: 0, 91%, 71%; /* #f87171 */
    --red-500: 0, 84%, 60%; /* #ef4444 */
    --red-600: 0, 72%, 51%; /* #dc2626 */
    --red-700: 0, 74%, 42%; /* #b91c1c */
    --red-800: 0, 70%, 35%; /* #991b1b */
    --red-900: 0, 82%, 19%; /* #5A0909 */

    --green-50: 138, 76%, 97%; /* #F0FDF4 */
    --green-100: 141, 84%, 93%; /* #DCFCE7 */
    --green-200: 141, 79%, 85%; /* #BBF7D0 */
    --green-300: 142, 77%, 73%; /* #86EFAC */
    --green-400: 142, 69%, 58%; /* #4ADE80 */
    --green-500: 142, 71%, 45%; /* #22C55E */
    --green-600: 142, 76%, 36%; /* #16A34A */
    --green-700: 142, 72%, 29%; /* #15803D */
    --green-800: 143, 74%, 19%; /* #0D5629 */
    --green-900: 143, 79%, 11%; /* #063418 */

    --orange-100: 30, 100%, 94%; /* #FFF0DB */
    --orange-800: 10, 76%, 28%; /* #7D2711 */
    --orange-900: 20, 33%, 15%; /* #3A291D */

    --amber-500: 38, 92%, 50%; /* #f59e0b */
    --cyan-500: 188, 86%, 53%; /* #06b6d4 */
  }
}
