.tabs {
  display: flex;
  border-bottom: 2px solid var(--color-gray-eee);

  .tab {
    cursor: pointer;
    margin-right: 20px;
    padding-bottom: 8px;
    color: var(--color-gray-888);

    &.selected {
      position: relative;
      color: var(--accent-color-bg);
      font-weight: 500;

      &::after {
        content: '';

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

        display: block;

        width: auto;
        height: 2px;

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

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