@custom-variant dark (&:where(.dark, .dark *));

@theme {
  --font-sans: "Quicksand", sans-serif;
  --color-primary-50: oklch(0.962 0.0179 272.31); /* #eef2ff */
  --color-primary-100: oklch(0.93 0.0334 272.79); /* #e0e7ff */
  --color-primary-200: oklch(0.8699 0.0622 274.04); /* #c7d2fe */
  --color-primary-300: oklch(0.7853 0.1041 274.71); /* #a5b4fc */
  --color-primary-400: oklch(0.6801 0.1583 276.93); /* #818cf8 */
  --color-primary-500: oklch(0.5854 0.2041 277.12); /* #6366f1 */
  --color-primary-600: oklch(0.5106 0.2301 276.97); /* #4f46e5 */
  --color-primary-700: oklch(0.4568 0.2146 277.02); /* #4338ca */
  --color-primary-800: oklch(0.3984 0.1773 277.37); /* #3730a3 */
  --color-primary-900: oklch(0.3588 0.1354 278.7); /* #312e81 */
  --color-primary-950: oklch(0.2573 0.0861 281.29); /* #1e1b4b */

  --color-secondary-50: oklch(0.9842 0.0034 247.86); /* #f8fafc */
  --color-secondary-100: oklch(0.9683 0.0069 247.9); /* #f1f5f9 */
  --color-secondary-200: oklch(0.9288 0.0126 255.51); /* #e2e8f0 */
  --color-secondary-300: oklch(0.869 0.0198 252.89); /* #cbd5e1 */
  --color-secondary-400: oklch(0.7107 0.0351 256.79); /* #94a3b8 */
  --color-secondary-500: oklch(0.5544 0.0407 257.42); /* #64748b */
  --color-secondary-600: oklch(0.4455 0.0374 257.28); /* #475569 */
  --color-secondary-700: oklch(0.3717 0.0392 257.29); /* #334155 */
  --color-secondary-800: oklch(0.2795 0.0368 260.03); /* #1e293b */
  --color-secondary-900: oklch(0.2077 0.0398 265.75); /* #1e293b */
  --color-secondary-950: oklch(0.1288 0.0406 264.7); /* #020617 */

  --animate-toast-from-right: toast-from-right 0.5s
    cubic-bezier(0.68, -0.55, 0.27, 1.55);
  --animate-toast-from-left: toast-from-left 0.5s
    cubic-bezier(0.68, -0.55, 0.27, 1.55);

  --color-body-bg: rgb(245, 246, 250);
  --color-primary: rgb(115, 93, 255);
  --color-primary-rgb: rgb(115, 93, 255);
  --color-secondary: rgb(255, 90, 41);
  --color-warning: rgb(255 154 19);
  --color-info: rgb(12 156 252);
  --color-success: rgb(12 199 99);
  --color-danger: rgb(255 56 60);
  --color-light: rgb(247 248 250);
  --color-dark: rgb(10 10 10);
  --color-orange: rgb(254 124 88);
  --color-pink: rgb(254 84 155);
  --color-teal: rgb(0 216 216);
  --color-purple: rgb(123 118 254);
  --color-green: rgb(1 239 140);
  --color-default-body-bg-color: rgb(245 246 250);
  --color-default-text-color: rgb(34 47 54);
  --color-default-border: rgb(243 242 249);
  --color-default-background: rgb(249 250 251);
  --color-menu-bg: rgb(255 255 255);
  --color-menu-prime-color: rgb(101 122 153);
  --color-menu-border-color: rgb(243 242 249);
  --color-header-bg: rgb(255 255 255);
  --color-header-prime-color: rgb(101 122 153);
  --color-header-border-color: rgb(243 242 249);
  --color-custom-white: rgb(255 255 255);
  --color-custom-black: rgb(0 0 0);
  --color-list-hover-focus-bg: rgb(245 246 247);
  --color-text-muted: rgb(152 165 195);
  --color-input-border: rgb(226 230 241);
  --color-form-control-bg: rgb(255 255 255);
  --color-bs-link-color-rgb: rgb(33 43 55);
  --color-facebook: rgb(59 89 152);
  --color-twitter: rgb(0 172 238);
  --color-github: rgb(51 51 51);
  --color-google: rgb(207 78 67);
  --color-youtube: rgb(255 0 0);

  --body-bg: 245, 246, 250;
  --primary: 115 93 255;
  --primary-rgb: 115, 93, 255;
  --secondary: 255 90 41;
  --warning: 255 154 19;
  --info: 12 156 252;
  --success: 12 199 99;
  --danger: 255 56 60;
  --light: 247 248 250;
  --dark: 10 10 10;
  --orange: 254 124 88;
  --pink: 254 84 155;
  --teal: 0 216 216;
  --purple: 123 118 254;
  --green: 1 239 140;
  --default-body-bg-color: 245 246 250;
  --default-text-color: 34 47 54;
  --default-border: 243 242 249;
  --default-background: 249 250 251;
  --menu-bg: 255 255 255;
  --menu-prime-color: 101 122 153;
  --menu-border-color: 243 242 249;
  --header-bg: 255 255 255;
  --header-prime-color: 101 122 153;
  --header-border-color: 243 242 249;
  --custom-white: 255 255 255;
  --custom-black: 0 0 0;
  --list-hover-focus-bg: 245 246 247;
  --text-muted: 152 165 195;
  --input-border: 226 230 241;
  --form-control-bg: 255 255 255;
  --bs-link-color-rgb: 33 43 55;
  --facebook: 59 89 152;
  --twitter: 0 172 238;
  --github: 51 51 51;
  --google: 207 78 67;
  --youtube: 255 0 0;

  @keyframes toast-from-right {
    0% {
      transform: translateX(50%);
      opacity: 0%;
    }

    100% {
      transform: translateX(0);
      opacity: 100%;
    }
  }

  @keyframes toast-from-left {
    0% {
      transform: translateX(-50%);
      opacity: 0%;
    }

    100% {
      transform: translateX(0);
      opacity: 100%;
    }
  }
}

@layer base {
  *,
  ::after,
  ::before,
  ::backdrop,
  ::file-selector-button {
    border-color: var(--color-gray-200, currentColor);
  }
  body {
    font-size: 0.85rem;
    font-weight: 500;
    color: rgb(var(--default-text-color));
    line-height: 1.5;
  }
}

@plugin "@tailwindcss/typography";