@import 'gabsocial-light/variables';

// $gab-brand-default: lighten(#149dfb, 10%);
$gab-brand-default: #0482d8;
$gab-background-base-light: #f2f3f6;
$gab-background: $gab-background-base-light;
$ui-base-color: #d9f2f9;
$ui-highlight-color: $gab-brand-default;
// $nav-ui-background-color: #000;
$nav-ui-highlight-color: #149dfb;
$ui-base-lighter-color: #b0c0cf;

@import 'application';
@import 'gabsocial-light/diff';

.tabs-bar__link {
  font-weight: bold;
  transition: 0.1s;
  outline: none;

  // &.active {
  //   color: darken(#04d8c4, 40%);
  // }
  //
  // &:hover {
  //   color: darken(#04d8c4, 60%);
  // }

  &::before {
    // background-color: darken($nav-ui-highlight-color, 10%);
    bottom: auto;
    opacity: 0;
    height: 15px;
    border-radius: 999px;
    z-index: -1;
    width: calc(100% + 20px);
    margin-left: -12px;

    @media screen and (max-width: 895px) {
      height: 0;
      border-radius: 3px 3px 0 0;
      bottom: 0;
    }
  }

  &.active::before,
  &:hover::before {
    height: 30px;
    opacity: 1;

    @media screen and (max-width: 895px) {
      height: 7px;
      width: 36px;
      margin: 0;
    }
  }

}

.tabs-bar__split--left:hover .tabs-bar__link {
  &::before {
    height: 15px;
    opacity: 0;

    @media screen and (max-width: 895px) {
      height: 0;
    }
  }

  &:hover::before {
    height: 30px;
    opacity: 1;

    @media screen and (max-width: 895px) {
      height: 7px;
    }
  }
}

.search__input {
  border-radius: 999px;
  border: 0;
  padding-left: 15px;
}

.search__icon .fa {
  right: 8px;
}