//
// @description :
// @author      : Adarsh Pastakia
// @copyright   : 2017
// @license     : MIT

// HEADINGS
h1 {
  font-size: 2.5em;
}

h2 {
  font-size: 2.2em;
}

h3 {
  font-size: 2em;
}

h4 {
  font-size: 1.8em;
}

h5 {
  font-size: 1.5em;
}

h6 {
  font-size: 1.2em;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  line-height: 1.5;

  small {
    font-size  : 0.7em;
    line-height: 1;
    display    : block;
    opacity    : 0.8;
  }
}

p {
  line-height: 1.5;
  margin     : 0 0 1em;
}

p.ui-para {
  &.emphasis:first-letter {
    font-size  : 1.5em;
    line-height: 1;
    color      : $secondary;
  }

  &.emphasis-big:first-letter {
    font-size  : 2.5em;
    line-height: 1;
    color      : $secondary;
  }

  &.emphasis-large:first-letter {
    font-size  : 4em;
    line-height: 1;
    color      : $secondary;
  }
}

// LARGE DISPLAY TEXT
.ui-display-1 {
  font-size  : 4em;
  font-weight: 300;
}

.ui-display-2 {
  font-size  : 3em;
  font-weight: 300;
}

.ui-display-3 {
  font-size  : 2em;
  font-weight: 300;
}

// FONT SIZES
.ui-font-large {
  font-size: 1.5em;
}

.ui-font-big,
big {
  font-size: 1.2em;
}

.ui-font-small,
small {
  font-size: 0.8em;
}

.ui-font-default {
  font-family: $base-font-family;
}

.ui-font-serif {
  font-family: $base-font-family-serif;
}

.ui-font-fixed {
  font-family: $base-font-family-fixed;
}

.ui-font-input {
  font-family: $base-font-family-input;
}

// FONT WEIGHTS
.ui-italic,
em,
i {
  font-style: italic;
}

.ui-bold,
b {
  font-weight: $font-weight-bold;
}

.ui-strong,
strong {
  font-weight: $font-weight-strong;
}

.ui-thin {
  font-weight: $font-weight-thin;
}

// TRANSFORM
.ui-uppercase {
  text-transform: uppercase;
}

.ui-lowercase {
  text-transform: lowercase;
}

.ui-titlecase {
  text-transform: capitalize;
}

.ui-small-caps {
  font-variant: small-caps;
}

.ui-ellipsis {
  display: block;
  @include ellipsis();
}

// ALIGNMENTS
.ui-text-center {
  text-align: center;
}

.ui-text-start {
  text-align: left;
  text-align: start;
}

.ui-text-end {
  text-align: right;
  text-align: end;
}

.ui-text-justify {
  text-align: justify;
}

//BADGES
.ui-badge {
  position     : absolute;
  top          : -.5em;
  right        : -.5em;
  font-size    : 0.9em;
  line-height  : 1.2;
  border-radius: 1em;
  padding      : 0 0.5em;
  color        : $white;
  box-shadow   : 1px 1px 2px 0 rgba($base-shadow-color, .75);

  .ui-bg-dark {
    background: $dark;
  }

  .ui-bg-primary {
    background: $primary;
  }

  .ui-bg-secondary {
    background: $secondary;
  }

  .ui-bg-info {
    background: $info;
  }

  .ui-bg-danger {
    background: $danger;
  }

  .ui-bg-success {
    background: $success;
  }

  .ui-bg-warning {
    background: $warning;
  }
}
