/*
 * Copyright 2017-2020 IBM Corporation
 *
 * Licensed under the Apache License, Version 2.0 (the "License");
 * you may not use this file except in compliance with the License.
 * You may obtain a copy of the License at
 *
 * http://www.apache.org/licenses/LICENSE-2.0
 *
 * Unless required by applicable law or agreed to in writing, software
 * distributed under the License is distributed on an "AS IS" BASIS,
 * WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
 * See the License for the specific language governing permissions and
 * limitations under the License.
 */

@import "carbon-components/scss/components/tabs/_tabs.scss";
@import "../../scss/components/common/narrow-window";

/* override the carbon color when tabbing through sidecar tabs */
.bx--tabs__nav-item:not(.bx--tabs__nav-item--selected):not(.bx--tabs__nav-item--disabled):not(.bx--tabs__nav-item--selected)
  .bx--tabs__nav-link:focus,
.bx--tabs__nav-item:not(.bx--tabs__nav-item--selected):not(.bx--tabs__nav-item--disabled):not(.bx--tabs__nav-item--selected)
  a.bx--tabs__nav-link:active {
  color: var(--color-text-02);
}
.bx--tabs__nav-item--selected:not(.bx--tabs__nav-item--disabled) .bx--tabs__nav-link:focus,
.bx--tabs__nav-item--selected:not(.bx--tabs__nav-item--disabled) .bx--tabs__nav-link:active {
  outline-color: var(--color-brand-03);
}

[kui-theme-style] .kui--sidecar {
  .bx--tabs,
  .bx--tabs .bx--tabs__nav,
  .bx--tabs .bx--tabs__nav li,
  .bx--tabs .bx--tabs__nav li a {
    width: unset;
    min-height: unset;
    position: unset;
    font-size: unset;
  }
  a.bx--tabs__nav-link,
  a.bx--tabs__nav-link:active {
    outline: none;
    width: unset;
    min-width: 8rem;
  }

  .bx--tabs {
    overflow-x: auto;
    .bx--tabs__nav {
      background: none;
      box-shadow: none;
    }
    .bx--tabs__nav--hidden {
      display: flex;
      flex-direction: row;
      max-height: unset;
    }
  }
  .bx--tabs-trigger {
    display: none;
  }
  .bx--tabs__nav-item {
    background: transparent;
  }

  .bx--tabs__nav-item--selected:not(.bx--tabs__nav-item--disabled) {
    display: flex;
    background-color: transparent;
  }

  .bx--tabs__nav-item--selected .bx--tabs__nav-link {
    color: var(--color-text-01);
    font-weight: 600;
    border-bottom: 2px solid var(--color-brand-03);
    opacity: 1;
  }
}

body[kui-theme-style] a.bx--tabs__nav-link {
  color: var(--color-text-01);
  border-bottom: 2px solid var(--color-text-02);
  opacity: 0.875;
}

/* override carbon color when hovering over tab */
[kui-theme-style]
  .bx--tabs__nav-item:hover:not(.bx--tabs__nav-item--selected):not(.bx--tabs__nav-item--disabled)
  .bx--tabs__nav-link {
  color: var(--color-text-01) !important;
  border-color: var(--color-text-01) !important;
}

@include somewhat-narrow-window {
  [kui-theme-style] .kui--sidecar {
    a.bx--tabs__nav-link,
    a.bx--tabs__nav-link:active {
      min-width: 6em;
    }
  }
}

@include medium-width-window {
  [kui-theme-style] .kui--sidecar {
    a.bx--tabs__nav-link,
    a.bx--tabs__nav-link:active {
      min-width: 7em;
    }
  }
}
