.tabs {
  display: flex;
  gap: 16px;
  line-height: 18px;
  border-bottom: 1px solid var(--color-gray-eee);

  .tab {
    cursor: pointer;
    padding-bottom: 5px;
    font-weight: 500;
    color: var(--color-gray-888);

    &.selected,
    :hover {
      position: relative;
      color: var(--accent-color-bg);

      &::after {
        content: '';

        position: absolute;
        z-index: 1;
        right: 0;
        bottom: -1px;
        left: 0;

        display: block;

        width: auto;
        height: 2px;

        background: var(--accent-color-bg);
      }
    }

    &.disabled {
      pointer-events: none;
      color: var(--color-gray-eee);
    }
  }
}
