// ----------------------- //
// Manage colors
//

// ------------ //
// DEFAULT
//
.glyphicon {
  color: @hwk-blue-light;
}
#carousel-header,
#top,
#footer-bottom {
  .glyphicon {
    color: white;
  }
}
.navbar-fixed-top {
  .glyphicon {
    color: @hwk-blue-dark;
  }
}

// ------------ //
// BODY COLOR
//
body.color-hwk-blue-dark {
  // header-content
  .hwk-header-content {
    background-color: @hwk-blue-dark;
    .header-deco {
      .color-light {
        background-color: @hwk-blue-dark-75;
      }
      .color-lighter {
        background-color: @hwk-blue-dark-50;
      }
    }
  }
  // content elements
  #content .content {
    h1, h2, h3, h4, h5, h6,
    .h1, .h2, .h3, .h4, .h5, .h6 {
      span {
        color: @hwk-blue-dark;
      }
    }
    .glyphicon {
      color: @hwk-blue-dark;
    }
    blockquote {
      --blockquote-color: @hwk-blue-dark;
    }
    ul:not(.nav-tabs):not(.pagination):not(.aria-structure) {
       color: @hwk-blue-dark;
    }
    .listgroup-color,
    .listgroup-info p {
      color: @hwk-blue-dark;
    }
    .listgroup-intro {
      h1, h2, h3, h4, h5, h6,
      .h1, .h2, .h3, .h4, .h5, .h6 {
        color: @hwk-blue-dark;
      }
    }
  }
  // svg
}
body.color-hwk-blue-light {
  // header-content
  .hwk-header-content {
    background-color: @hwk-blue-light;
    .header-deco {
      .color-light {
        background-color: @hwk-blue-light-75;
      }
      .color-lighter {
        background-color: @hwk-blue-light-50;
      }
    }
  }
  // content elements
  #content .content {
    h1, h2, h3, h4, h5, h6,
    .h1, .h2, .h3, .h4, .h5, .h6 {
      span {
        color: @hwk-blue-light;
      }
    }
    .glyphicon {
      color: @hwk-blue-light;
    }
    blockquote {
      --blockquote-color: @hwk-blue-light;
    }
    ul:not(.nav-tabs):not(.pagination):not(.aria-structure) {
      color: @hwk-blue-light;
    }
    .listgroup-color,
    .listgroup-info p {
      color: @hwk-blue-light;
    }
    .listgroup-intro {
      h1, h2, h3, h4, h5, h6,
      .h1, .h2, .h3, .h4, .h5, .h6 {
        color: @hwk-blue-light;
      }
    }
  }
  // svg
}

body.color-hwk-green-dark {
  // header-content
  .hwk-header-content {
    background-color: @hwk-green-dark;
    .header-deco {
      .color-light {
        background-color: @hwk-green-light;
      }
      .color-lighter {
        background-color: @hwk-green-light-75;
      }
    }
  }
  // content elements
  #content .content {
    h1, h2, h3, h4, h5, h6,
    .h1, .h2, .h3, .h4, .h5, .h6 {
      span {
        color: @hwk-green-dark;
      }
    }
    .glyphicon {
      color: @hwk-green-dark;
    }
    blockquote {
      --blockquote-color: @hwk-green-dark;
    }
    ul:not(.nav-tabs):not(.pagination):not(.aria-structure) {
      color: @hwk-green-dark;
    }
    .listgroup-color,
    .listgroup-info p {
      color: @hwk-green-dark;
    }
    .listgroup-intro {
      h1, h2, h3, h4, h5, h6,
      .h1, .h2, .h3, .h4, .h5, .h6 {
        color: @hwk-green-dark;
      }
    }
  }
}
body.color-hwk-orange {
  // header-content
  .hwk-header-content {
    background-color: @hwk-orange;
    .header-deco {
      .color-light {
        background-color: @hwk-yellow;
      }
      .color-lighter {
        background-color: @hwk-yellow-75;
      }
    }
  }
  // content elements
  #content .content {
    h1, h2, h3, h4, h5, h6,
    .h1, .h2, .h3, .h4, .h5, .h6 {
      span {
        color: @hwk-orange;
      }
    }
    .glyphicon {
      color: @hwk-orange;
    }
    blockquote {
      --blockquote-color: @hwk-orange;
    }
    ul:not(.nav-tabs):not(.pagination):not(.aria-structure) {
      color: @hwk-orange;
    }
    .listgroup-color,
    .listgroup-info p {
      color: @hwk-orange;
    }
    .listgroup-intro {
      h1, h2, h3, h4, h5, h6,
      .h1, .h2, .h3, .h4, .h5, .h6 {
        color: @hwk-orange;
      }
    }
  }
}
body.color-hwk-red-dark {
  // header-content
  .hwk-header-content {
    background-color: @hwk-red-dark;
    .header-deco {
      .color-light {
        background-color: @hwk-red-light;
      }
      .color-lighter {
        background-color: @hwk-red-light-75;
      }
    }
  }
  // content elements
  #content .content {
    h1, h2, h3, h4, h5, h6,
    .h1, .h2, .h3, .h4, .h5, .h6 {
      span {
        color: @hwk-red-dark;
      }
    }
    .glyphicon {
      color: @hwk-red-dark;
    }
    blockquote {
      --blockquote-color: @hwk-red-dark;
    }
    ul:not(.nav-tabs):not(.pagination):not(.aria-structure) {
      color: @hwk-red-dark;
    }
    .listgroup-color,
    .listgroup-info p {
      color: @hwk-red-dark;
    }
    .listgroup-intro {
      h1, h2, h3, h4, h5, h6,
      .h1, .h2, .h3, .h4, .h5, .h6 {
        color: @hwk-red-dark;
      }
    }
  }
}




// -------------------- //
// HEADER SLIDER COLORS
//

// slider ON TOP //
.color-hwk-green-dark #carousel-header.carousel .carousel-inner .item.text-on-top .slider-text,
#carousel-header.carousel .carousel-inner .item.text-on-top.color-hwk-green-dark .slider-text,
#carousel-header.carousel .carousel-inner .item.text-on-top .color-hwk-green-dark + .slider-text {
  h1, .h1 {
    background-color: @hwk-green-dark;
    .slider-text-h1-deco {
      background-color: @hwk-green-light;
    }
  }
}
.color-hwk-orange #carousel-header.carousel .carousel-inner .item.text-on-top .slider-text,
#carousel-header.carousel .carousel-inner .item.text-on-top.color-hwk-orange .slider-text,
#carousel-header.carousel .carousel-inner .item.text-on-top .color-hwk-orange + .slider-text {
  h1, .h1 {
    background-color: @hwk-orange;
    .slider-text-h1-deco {
      background-color: @hwk-yellow;
    }
  }
}
.color-hwk-red-dark #carousel-header.carousel .carousel-inner .item.text-on-top .slider-text,
#carousel-header.carousel .carousel-inner .item.text-on-top.color-hwk-red-dark .slider-text,
#carousel-header.carousel .carousel-inner .item.text-on-top .color-hwk-red-dark + .slider-text {
  h1, .h1 {
    background-color: @hwk-red-dark;
    .slider-text-h1-deco {
      background-color: @hwk-red-light;
    }
  }
}

// slider DEFAULT //
.color-hwk-green-dark #carousel-header.carousel .carousel-inner .item:not(.text-on-top) .slider-text,
#carousel-header.carousel .carousel-inner .item:not(.text-on-top).color-hwk-green-dark .slider-text,
#carousel-header.carousel .carousel-inner .item:not(.text-on-top) .slider-text.color-hwk-green-dark {
  h1, .h1 {
    color: @headings-color;
    &::before {
      background-color: @hwk-green-dark;
    }
    span {
      color: @hwk-green-dark;
    }
  }
}
.color-hwk-orange #carousel-header.carousel .carousel-inner .item:not(.text-on-top) .slider-text,
#carousel-header.carousel .carousel-inner .item:not(.text-on-top).color-hwk-orange .slider-text,
#carousel-header.carousel .carousel-inner .item:not(.text-on-top) .slider-text.color-hwk-orange {
  h1, .h1 {
    color: @headings-color;
    &::before {
      background-color: @hwk-orange;
    }
    span {
      color: @hwk-orange;
    }
  }
}
.color-hwk-red-dark #carousel-header.carousel .carousel-inner .item:not(.text-on-top) .slider-text,
#carousel-header.carousel .carousel-inner .item:not(.text-on-top).color-hwk-red-dark .slider-text,
#carousel-header.carousel .carousel-inner .item:not(.text-on-top) .slider-text.color-hwk-red-dark {
  h1, .h1 {
    color: @headings-color;
    &::before {
      background-color: @hwk-red-dark;
    }
    span {
      color: @hwk-red-dark;
    }
  }
}


// --------------- //
// COLOR CLASSES
//

h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
p, a, span, blockquote, caption, li, code {
  &.color-hwk-blue-dark {
    color: @hwk-blue-dark !important;
  }
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
p, a, span, blockquote, caption, li, code {
  &.color-hwk-blue-light {
    color: @hwk-blue-light!important;
  }
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
p, a, span, blockquote, caption, li, code {
  &.color-hwk-green-dark {
    color: @hwk-green-dark !important;
  }
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
p, a, span, blockquote, caption, li, code {
  &.color-hwk-orange {
    color: @hwk-orange !important;
  }
}
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
p, a, span, blockquote, caption, li, code {
  &.color-hwk-red-dark {
    color: @hwk-red-dark !important;
  }
}