// utility classes for text sizes
@for $i from -1 through 8 {
  .text-size-#{$i} {
    @include text-size($i);
  }
}

// heading font-sizes
@each $type-level, $details in $typography {
  @if map-get($details, 'tag') {
    :where(#{$type-level}),
    :where(.#{$type-level}) {
      @include typo($type-level, $details);
    }
  } @else {
    :where(.text-#{$type-level}) {
      @include typo($type-level, $details);
    }
  }
}

// Root font family
html,
body {
  font-family: var(
    --go-body-font-family,
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    'Helvetica Neue',
    sans-serif
  );
  font-size: var(--go-size-0, 1rem);
}

// ----------------------------------
// Style native html elements
// ----------------------------------
h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: var(
    --go-heading-font-family,
    -apple-system,
    BlinkMacSystemFont,
    'Segoe UI',
    Roboto,
    Oxygen-Sans,
    Ubuntu,
    Cantarell,
    'Helvetica Neue',
    sans-serif
  );
}
blockquote {
  font-style: italic;
  font-size: var(--go-size-0);
  border-left: var(--border-size-3) solid var(--go-color-neutral-400);
  margin: 0;
  padding-left: 2rem;
}
p {
  line-height: 1.5;
}
code {
  padding: 0 0.4em;
  border-radius: var(--radius-2);
  background-color: var(--go-color-code-bg);
  color: var(--go-color-code-fg);
  line-height: 1.5;
}
pre {
  padding: 1rem 0.5rem;
  border-radius: var(--radius-2);
  background-color: var(--go-color-code-bg);
  line-height: 1.5;
  code {
    padding: 0;
    background-color: transparent;
  }
}

// text alignments
.text-start {
  text-align: start;
}
.text-center {
  text-align: center;
}
.text-end {
  text-align: end;
}
.text-justify {
  text-align: justify;
}
.text-lowercase {
  text-transform: lowercase;
}
.text-uppercase {
  text-transform: uppercase;
}
.text-capitalize {
  text-transform: capitalize;
}

.font-heading {
  font-family: var(--go-heading-font-family);
}

a {
  color: var(--go-color-link);
  background-color: var(--go-color-link-bg);
  font-weight: var(--go-link-fw);
  @include underline;

  &:hover,
  &:focus-visible {
    --go-color-link: var(--go-color-link-hover);
    --go-color-link-bg: var(--go-color-link-hover-bg);

    text-decoration: none;
  }
}

.unstyled-list {
  @include unstyled-list;
}
