//
// @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;
  font-weight: $base-font-weight;

  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 {
  &.ui-emphasis:first-letter {
    font-size  : 1.5em;
    line-height: 1;
  }

  &.ui-emphasis-big:first-letter {
    font-size  : 2.5em;
    line-height: 1;
  }

  &.ui-emphasis-large:first-letter {
    font-size  : 4em;
    line-height: 1;
  }
}

// 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;
}

// 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;
}


.ui-font-default {
  font-family: $base-font-family;
}

.ui-font-serif {
  font-family: $base-font-family-serif;
}

.ui-font-fixed,
.ui-font-mono {
  font-family: $base-font-family-mono;
}

.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-medium;
}

// 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;
}


.ui-table {
  table-layout: fixed;
  width       : 100%;

  thead {
    background : rgba($light, .25);
    font-weight: 600;
  }

  td,
  th {
    padding: 0.5em 0.75em;
  }

  tr:nth-child(even) {
    background: darken($white, 1%);
  }

  tbody td {
    font-size: 0.9em;
  }
}