@import "tailwindcss";

@theme {
  /* palette */
  --color-neutral-50: #ffffff;
  --color-neutral-200-1: #c6c6c6;
  --color-neutral-950: #000000;
  --color-neutral-900: #0f0f0f;
  --color-violet-600: #7a00df;
  --color-blue-600: #005a87;
  --color-violet-500: #9b51e0;
  --color-red-300: #f78da7;
  --color-neutral-300: #abb8c3;
  --color-green-300: #00d084;
  --color-neutral-200-2: #dddddd;
  --color-blue-500-1: #007cba;
  --color-orange-400: #ff6900;
  --color-blue-400: #0693e3;
  --color-blue-200: #8ed1fc;
  --color-neutral-100: #e5e5e5;
  --color-yellow-200: #fcb900;
  --color-orange-500: #cf2e2e;
  --color-teal-200: #7bdcb5;
  --color-blue-500-2: #006ba1;

  /* surfaces */
  --color-surface-0: #ffffff;
  --color-surface-1: #e5e5e5;
  --color-surface-2: #c6c6c6;
  --color-surface-3: #abb8c3;
  --color-surface-4: #0f0f0f;

  /* fonts */
  --font-inter: "Inter", ui-sans-serif, system-ui, sans-serif;
  --font-times-new-roman: "Times New Roman", ui-sans-serif, system-ui, sans-serif;

  /* type scale (utilities: text-{role}, leading-{role}, tracking-{role}) */
  --text-display: 32px;
  --text-display--line-height: 1.4;
  --text-display--letter-spacing: nullpx;
  --text-body: 17px;
  --text-body--line-height: 1.4;
  --text-body--letter-spacing: nullpx;
  --text-h3: 17px;
  --text-h3--line-height: 1.4;
  --text-h3--letter-spacing: nullpx;
  --text-link: 17px;
  --text-link--line-height: 1.4;
  --text-link--letter-spacing: nullpx;
  --text-ui-action: 17px;
  --text-ui-action--line-height: 1;
  --text-ui-action--letter-spacing: nullpx;
  --text-ui-input: 17px;
  --text-ui-input--line-height: 1;
  --text-ui-input--letter-spacing: nullpx;

  /* radii (utilities: rounded-{name}) */
  --radius-none: 0;
  --radius-md: 6px;

  /* spacing (utilities: p-{key}, m-{key}, gap-{key}, …) */
  --spacing-base: 1px;
}