@use '../core/variables' as *;
@use '../core/mixins' as *;
@use '../core/bootstrap';

body {
  font-family: $site-font-family-base;
  font-size: $font-size-base;
  font-weight: 400;
  color: $site-color-body;
}

section {
  position: relative;
}

h1, h2, h3, h4, h5, h6 {
  font-family: $site-font-family-gsans;
  font-weight: 400;
  color: $site-color-body;
}

h1, .h1 {
  font-family: $site-font-family-gsans-display;
  font-size: bootstrap.$h1-font-size;
  margin-top: 0;
  margin-bottom: 0;
}

h2, .h2 {
  font-size: bootstrap.$h2-font-size;
}

h3, .h3 {
  font-size: bootstrap.$h3-font-size;
}

h4, .h4 {
  font-size: bootstrap.$h4-font-size;
}

h5, .h5 {
  font-size: bootstrap.$h5-font-size;
}

h6, .h6 {
  font-size: bootstrap.$h6-font-size;
}

dt {
  a {
    font-weight: bootstrap.$font-weight-bold
  }
}

a, button {
  text-decoration: none;
  color: $brand-primary;
  font-family: $site-font-family-base;
  font-weight: 400;

  &:visited {
    color: $brand-primary;
  }

  &:hover, &:focus, &:active {
    color: $flutter-color-blue-700;
    outline: none;
    text-decoration: none;
  }

  &:active {
    color: $flutter-color-blue-800;
  }
}

img {
  max-width: 100%;
  height: auto;
}

blockquote {
  border: solid #b3b3b3;
  border-width: 1px 0;
  margin: 20px;
  padding: 10px 20px 0 20px;
}

details {
  margin-bottom: 0.75rem;

  > summary {
    font-weight: 500;
    user-select: none;

    &:hover {
      color: $brand-primary;
    }
  }

  &[open] {
    margin-bottom: unset;

    > summary {
      margin-bottom: 0.75rem;
    }
  }

  > :not(:first-child) {
    margin-left: 0.75rem;
    margin-right: 0.75rem;
  }
}
