/*————————————

Tabs

————————————*/

/* Colors ————————————*/ .g-color-primary–active.active {

color: $g-color-primary;

}

.g-color-black–active.active {

color: $g-color-black;

}

.g-color-gray-dark-v2–active.active {

color: $g-color-gray-dark-v2;

}

.g-color-white–active.active {

color: $g-color-white;

}

/* Style for Icons ————————————*/ .u-tab-line-icon-pro {

position: relative;
top: 2px;

}

/* HZ ————————————*/ .nav-item > a, .nav-item > .nav-link, [class*=“u-tab-link”]:not() {

transition: {
  property: color, background-color, border-color;
  duration: .2s;
  timing-function: ease-in;
}

}

[role=“tablist”]:not(, [data-tabs-mobile-type=“accordion”], [data-scroll]) {

display: block;

.nav-item {
  display: inline-block;
}

.js-tabs-mobile {
  position: relative;
  display: none;

  &-control {
    position: relative;
    display: block;

    &::after {
      content: "";
      position: absolute;
      top: 50%;
      right: 0;
      display: block;
      width: 0;
      height: 0;
      border: {
        width: 5px 3.5px 0 3.5px;
        style: solid;
        color: $g-color-gray-dark-v4 transparent transparent transparent;
      }
      margin-top: -1px;
    }
  }

  .nav-inner {
    position: absolute;
    top: calc(100% + 1px);
    right: 0;
    display: none;
    background-color: $g-color-white;
    border: 1px solid;
    padding-left: 0;

    .nav-item {
      display: block;
      white-space: nowrap;
    }
  }
}

}

[data-scroll]:not(, [data-tabs-mobile-type=“accordion”]) {

width: 100%;
white-space: nowrap;
overflow-x: scroll;
overflow-y: hidden;

&::-webkit-scrollbar {
  display: none;
}

}

@-moz-document url-prefix() {

[data-scroll]:not([data-tabs-mobile-type="slide-up-down"], [data-tabs-mobile-type="accordion"]) {
  padding-bottom: 15px;
}

}

@media(min-width: $g-md) {

[data-scroll] {
  width: 100%;
  white-space: nowrap;
  overflow-x: scroll;
  overflow-y: hidden;

  &::-webkit-scrollbar {
    display: none;
  }
}

@-moz-document url-prefix() {
  [data-scroll] {
    padding-bottom: 15px;
  }
}

}

// // Imports //

@import “tabs-v1”; @import “tabs-v2”; @import “tabs-v3”; @import “tabs-v4”; @import “tabs-v5”; @import “tabs-v6”; @import “tabs-v7”; @import “tabs-v8”;

@media (max-width: #{$g-md}-1) {

[data-tabs-mobile-type="slide-up-down"],
[data-tabs-mobile-type="accordion"] {
  display: none;
}

[data-tabs-mobile-type="accordion"] {
  display: none;
}

[role="tablist"]:not([data-tabs-mobile-type="slide-up-down"], [data-tabs-mobile-type="accordion"]) {
  border-color: $g-color-primary;

  .nav-item > a,
  .nav-item > .nav-link,
  [class*="u-tab-link"]:not([class*="-icon"]) {
    white-space: nowrap;
    padding: 5px 10px;
  }

  .nav-item > a,
  .nav-item > .nav-link,
  [class*="u-tab-link"]:not([class*="-icon"], [class*="js-tabs-mobile-control"]) {
    display: block;
  }
}

// Slide-up-down
[data-tabs-mobile-type="slide-up-down"] {
  width: 100%;
  padding-top: 10px;
  border-bottom: none !important;

  .nav-item {
    margin: 0;
  }

  .nav-link {
    text-align: center;
    border: {
      style: solid !important;
      color: $g-color-gray-light-v4 !important;
      width: 1px !important;
      radius: 0 !important;
    }
    margin: -1px 0 0;
  }

  .nav-item:first-child .nav-link {
    margin-top: 0;
  }

  &.u-nav-primary,
  &.nav-pills {
    .nav-link {
      border-color: $g-color-primary !important;
    }

    .nav-link.active,
    .nav-item.show .nav-link {
      border-color: $g-color-primary !important;
    }
  }

  &.u-nav-dark {
    .nav-link {
      border-color: $g-color-gray-dark-v2 !important;
    }

    .nav-link.active,
    .nav-item.show .nav-link {
      border-color: $g-color-gray-dark-v2 !important;
    }
  }

  &.u-nav-light {
    .nav-item {
      &.show {
        .nav-link {
          border-color: $g-color-white;
        }
      }
    }

    .nav-link {
      color: $g-color-white;
      border-color: $g-color-white;

      &.active {
        color: $g-color-main;
        background-color: $g-color-white;
        border-color: $g-color-white;
      }
    }
  }

  &.u-nav-rounded-3 .nav-item:first-child .nav-link,
  &.nav-tabs .nav-item:first-child .nav-link,
  &.nav-pills .nav-item:first-child .nav-link {
    border-radius: 3px 3px 0 0 !important;
  }
  &.u-nav-rounded-3 .nav-item:last-child .nav-link,
  &.nav-tabs .nav-item:last-child .nav-link,
  &.nav-pills .nav-item:last-child .nav-link {
    border-radius: 0 0 3px 3px !important;
  }

  &.u-nav-rounded-5 .nav-item:first-child .nav-link {
    border-radius: 5px 5px 0 0 !important;
  }
  &.u-nav-rounded-5 .nav-item:last-child .nav-link {
    border-radius: 0 0 5px 5px !important;
  }

  &.u-nav-rounded-7 .nav-item:first-child .nav-link {
    border-radius: 7px 7px 0 0 !important;
  }
  &.u-nav-rounded-7 .nav-item:last-child .nav-link {
    border-radius: 0 0 7px 7px !important;
  }

  &.u-nav-rounded-10 .nav-item:first-child .nav-link {
    border-radius: 10px 10px 0 0 !important;
  }
  &.u-nav-rounded-10 .nav-item:last-child .nav-link {
    border-radius: 0 0 10px 10px !important;
  }
}

.tab-content {
  order: 2;
}

}