//
// Typography
// --------------------------------------------------

// Headings
// -------------------------

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6 {

  small,
  .small {
    font-weight: $font-weight-normal;
    line-height: 1;
  }

  a {
    &:hover, &:focus {
      text-decoration: none;
      color: inherit;
    }

    color: inherit;
  }
}


h3, .h3,
h4, .h4,
h5, .h5 {
  color: var(--#{$prefix}body-color);
}


h1, .h1,
h2, .h2,
h3, .h3 {

  small,
  .small {
    font-size: .6em;
  }
}


h4, .h4,
h5, .h5,
h6, .h6 {

  small,
  .small {
    font-size: .75em;
  }
}


h4, .h4 {
  font-weight: $font-weight-bold
}


// Body text
// -------------------------

a {
  outline: 0;

  .icon {
    &:before, &:after {
      color: $primary;
    }
  }

}


strong, b {
  font-weight: $font-weight-bold;
}


sup {
  top: -.33em;
}


.lead {
  margin-bottom: 1.5em;
  font-size: $lead-font-size;
  font-weight: $lead-font-weight;
  line-height: 1.5;
}


.backline {
  background-color: $primary;
  color: #fff;
  display: inline-block;
  line-height: 1;
  padding: 0.5em;
  margin-bottom: 0.2em;
  margin-right: -0.5em;
  white-space: nowrap;
  @include media-breakpoint-down(sm) {
    white-space: normal;
  }

}


// Lists
// --------------------------------------------------

// Unordered and Ordered lists
ul,
ol {
  * + & {
    //margin-top: $line-height-computed;
    //margin-bottom: 0;
  }

  ul,
  ol {
    margin-top: 0;
    margin-bottom: 0;
  }
}


// List options

// Unstyled keeps list items block level, just removes default browser padding and list-style
.list-unstyled {
  padding-left: 0;
  list-style: none;
}


// Inline turns list items into inline-block
.list-inline {
  @extend .list-unstyled;

  > li {
    display: inline-block;
    padding-left: 5px;
    padding-right: 5px;

    &:first-child {
      padding-left: 0;
    }
  }
}


.list-features, .csc-bulletlist-0 {
  list-style: none;
  padding-left: 1.5em;

  li {
    position: relative;
    margin-top: $line-height-base * .25;
    @include icon('icon', $icons, 'ok');

    &:before {
      margin-left: -1.5em;
      color: $primary;
    }
  }
}


.list-tags {
  @extend .list-unstyled;

  li {
    display: inline-block;
    background-color: rgba($black, .1);
    border-radius: $border-radius;
    padding: .25em .5em;
    margin-bottom: .25em;
    margin-right: .25em;

  }
}


// Description Lists
dl {
  margin-top: 0; // Remove browser default
  margin-bottom: $line-height-base;
}


dt,
dd {
  line-height: $line-height-base;
}


dt {
  font-weight: $font-weight-bold;
  color: $primary;
}


dd {
  margin-left: 0; // Undo browser default
}


// Horizontal description lists
//
// Defaults to being stacked without any of the below styles applied, until the
// grid breakpoint is reached (default of ~768px).

$component-offset-horizontal: 170px;

@include media-breakpoint-up(sm) {

  .dl-horizontal {
    dt {
      float: left;
      width: ($component-offset-horizontal - 20);
      clear: left;
      text-align: right;
    }

    dd {
      margin-left: $component-offset-horizontal;
      margin-bottom: 0;
    }
  }
}


a.download-link {
  white-space: nowrap;

  &:before {
    color: $primary;
  }

  @include icon-inline('icon', $icons, 'download');

  &[href$=".doc"], &[href$=".docx"] {
    @include icon-inline('icon', $icons, 'file-word');
  }

  &[href$=".xsl"], &[href$=".xslx"] {
    @include icon-inline('icon', $icons, 'file-word');
  }

  &[href$=".zip"] {
    @include icon-inline('icon', $icons, 'file-archive');
  }

  &[href$=".pdf"] {
    @include icon-inline('icon', $icons, 'file-pdf');
  }

}
