@import '../global-sass-files/variables';

// Tab
.tab {
  margin: 20px;
  background-color: $gray-centreon-light;
  .tab-list {
    list-style: none;
    margin: 0;
    padding: 0;
    background-color: #009fdf;
    display: flex;
    -webkit-box-shadow: 1px 1px 5px 2px rgba(70,75,82,0.2);
    box-shadow: 1px 1px 5px 2px rgba(70,75,82,0.2);
    &-item {
      font-size: 14px;
      font-family: $primary-font-light;
      background-color: inherit;
      display: inline-block;
      border: none;
      outline: none;
      cursor: pointer;
      padding: 8px 20px;
      text-align: center;
      transition: 0.3s;
      border-bottom: 4px solid transparent;
      box-sizing: border-box;
      color: $white-color;
      text-transform: uppercase;
      &.has-error {
        border-bottom: 4px solid $content-red-color;
      }
    }
    &-active {
      border-bottom: 4px solid $blue-centreon-darken;
      font-family: $primary-font-bold;
    }
  }
  &-wrapper {
    display: flex;
    flex: 1;
    min-height: 0px;
  }
  &-overflow {
    flex: 1;
    overflow: auto;
  }
  &-content {
    padding: 20px;
    font-size: 12px;
    font-family: $primary-font-light;
    & > .has-error {
      color: #e00b3d;
      font-family: "Roboto Bold";
      font-size: 10px;
      text-align: center;
      margin: 5px 0 20px 0;
    }
  }
  .select-option {
    &:after {
      content: '';
      position: absolute;
      height: 1px;
      width: 92%;
      background-color: $lime-centreon-primary;
      left: 50%;
      transform: translateX(-50%);
      bottom: 1px;
    }
  }
  .tooltip {
    margin-top: 0;
  }
}