/* src/styles.scss */
:root {
  --body-font-family: "Inter", sans-serif;
  --heading-font-family: "Inter", sans-serif;
  --background-color: hsla(228, 29%, 97%, 1);
  --body-font-color: hsla(0, 0%, 40%, 1);
  --notification-font-color: hsla(0, 0%, 14%, 1);
  --bread-crumb-color: hsla(0, 0%, 22%, 1);
  --heading-1-font-color: hsla(0, 0%, 22%, 1);
  --heading-2-font-color: hsla(0, 0%, 22%, 1);
  --heading-3-font-color: hsla(0, 0%, 22%, 1);
  --heading-4-font-color: hsla(0, 0%, 22%, 1);
  --heading-5-font-color: hsla(0, 0%, 28%, 1);
  --body-bg-color: hsl(0 0% 96%);
  --foreground-bg-color: hsl(0 0% 100%);
  --in-card-background-color: hsla(0, 0%, 98%, 1);
  --primary: hsla(229, 83%, 60%, 1);
  --primary-hover: hsl(220 90% 50%);
  --primary-text-color: hsl(0 0% 100%);
  --secondary: hsla(0, 0%, 98%, 1);
  --secondary-border-color: hsla(210, 11%, 93%, 1);
  --secondary-text-color: hsla(210, 29%, 7%, 1);
  --danger: hsla(357, 80%, 50%, 1);
  --danger-text-color: hsl(0 0% 100%);
  --card-border-color: hsla(233, 20%, 92%, 1);
  --card-background-color: hsla(0, 0%, 98%, 1);
}
* {
  box-sizing: border-box;
}
html,
body {
  margin: 0;
  padding: 0;
  color: var(--body-font-color);
  background-color: var(--body-bg-color);
}
html,
body,
input,
button,
textarea,
select {
  font-family: var(--body-font-family);
}
a {
  color: var(--primary);
}
a:hover {
  text-decoration: underline;
}
p {
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  font-size: 14px;
  margin: 0;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(--heading-font-family);
  margin: 0;
}
h1 {
  color: var(--heading-1-font-color);
  font-size: 48px;
  font-style: normal;
  font-weight: 600;
  line-height: 120%;
}
h2 {
  color: var(--heading-2-font-color);
  font-size: 24px;
  font-style: normal;
  font-weight: 600;
  line-height: 140%;
}
h3 {
  color: var(--heading-3-font-color);
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
h4 {
  color: var(--heading-4-font-color);
  font-size: 16px;
  font-style: normal;
  font-weight: 600;
  line-height: 150%;
}
h5 {
  color: var(--heading-5-font-color);
}
.controls {
  display: flex;
  flex-direction: column;
  gap: 32px;
}
.page-wrap {
  max-width: 900px;
  padding: 20px;
  margin: 0 auto;
}
@media (max-width: 900px) {
  .page-wrap {
    padding: 12px;
  }
}

/* angular:styles/global:styles */
/*# sourceMappingURL=styles.css.map */