/* CSS files of components */
@import url("../Components/Typography/typography.css");
@import url("../Components/List/list.css");
@import url("../Components/Alert/alert.css");
@import url("../Components/Avatar/avatar.css");
@import url("../Components/Button/button.css");
@import url("../Components/Badge/badge.css");
@import url("../Components/Card/card.css");
@import url("../Components/Image/image.css");
@import url("../Components/Input/input.css");
@import url("../Components/Navigation/navigation.css");
@import url("../Components/Modal/modal.css");
@import url("../Components/Rating/rating.css");
@import url("../Components/Slider/slider.css");
@import url("../Components/Toast/toast.css");
@import url("../Components/Grid/grid.css");

* {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
  font-family: "Outfit", sans-serif;
}

:root {
  --default-color: #171717;
  --primary-color: #6366f1;
  --secondary-color: #f3f4f6;
  --danger-color: #f44336;
  --success-color: #4caf50;
  --warning-color: #ff9800;

  --default-hover: #222222;
  --primary-hover: #4f46e5;
  --secondary-hover: #e5e7eb;
  --danger-hover: #d31609;
  --success-hover: #11a016;
  --warning-hover: #ec930e;
  --active-hover: #058ce0;

  --off-white: #f6f9fc;
  --active-color: #1ea7fd;

  --grey-color-light: #b3b2b2;
  --grey-color-medium: #868484;
  --grey-color-dark: #585858;
}