@import 'tailwindcss';

@theme {
  --color-primary: rgba(255, 255, 255, 1);
  --color-secondary: rgba(229, 30, 125, 1);
  --color-three: rgba(245, 75, 126, 1);

  --color-accent-50: #f54378;
  --color-accent-100: #e51e7d;
  --color-accent-150: #c4035f;

  --color-black-50: #0c1018;

  /*system colors*/
  --color-error: oklch(57.7% 0.245 27.325);
  --color-warning: oklch(76.9% 0.188 70.08);

  /*disabled*/
  --color-text-disabled: oklch(55.1% 0.027 264.364);
  --color-bg-disabled: oklch(92.8% 0.006 264.531);
}

.lato-thin {
  font-family: 'Lato', sans-serif;
  font-weight: 100;
  font-style: normal;
}

.lato-light {
  font-family: 'Lato', sans-serif;
  font-weight: 300;
  font-style: normal;
}

.lato-regular {
  font-family: 'Lato', sans-serif;
  font-weight: 400;
  font-style: normal;
}

.lato-bold {
  font-family: 'Lato', sans-serif;
  font-weight: 700;
  font-style: normal;
}

.lato-black {
  font-family: 'Lato', sans-serif;
  font-weight: 900;
  font-style: normal;
}

.lato-thin-italic {
  font-family: 'Lato', sans-serif;
  font-weight: 100;
  font-style: italic;
}

.lato-light-italic {
  font-family: 'Lato', sans-serif;
  font-weight: 300;
  font-style: italic;
}

.lato-regular-italic {
  font-family: 'Lato', sans-serif;
  font-weight: 400;
  font-style: italic;
}

.lato-bold-italic {
  font-family: 'Lato', sans-serif;
  font-weight: 700;
  font-style: italic;
}

.lato-black-italic {
  font-family: 'Lato', sans-serif;
  font-weight: 900;
  font-style: italic;
}

.russo-one-regular {
  font-family: 'Russo One', sans-serif;
  font-weight: 700;
  font-style: normal;
}