.d-tabs {
  display: flex;
  flex-direction: column;
  overflow-x: hidden;
}

.d-tabs-header {
  display: flex;
  overflow-x: auto;
  z-index: 1;
}

.d-tab-label {
  padding: 11px 16px;
  border-radius: 4px 4px 0 0;
  border: 1px solid var(--d-color-neutral-20);
  background-color: var(--d-color-neutral-00);
  color: var(--d-color-neutral-60);
  font-family: var(--d-font-stacks);
  font-size: 14px;
  font-weight: 500;
  line-height: 20px;
  white-space: nowrap;
  text-align: center;
  cursor: pointer;
  user-select: none;

  &.active {
    color: var(--d-color-red-50);
    border-bottom-color: var(--d-color-neutral-00);
  }

  &.disabled {
    color: var(--d-color-neutral-30);
    background-color: var(--d-color-neutral-10);
    border-color: var(--d-color-neutral-10);
    cursor: not-allowed;
  }
}

.d-tab-content {
  display: none;

  &.active {
    display: block;
  }
}

.d-tabs-content-card {
  .d-tabs-body {
    background-color: var(--d-color-neutral-00);
    border: 1px solid var(--d-color-neutral-20);
    border-radius: 0 8px 8px;
    margin-top: -1px;
    z-index: 0;
  }
}