:global(.ui-tabs) {
  &[data-state~='active-bar'] {
    & :global(.tab) {
      &:global(.active) {
        &:after {
          background-color: currentColor;
        }
      }
    }
    &[data-state~='horizontal'] {
      & :global(.tab) {
        &[data-state~="radius-none"] {
          padding-top: 4px;
          &:after {
            height: 4px;
          }
        }
        &[data-state~="radius-small"] {
          padding-top: var(--radius-small);
          &:after {
            height: var(--radius-small);
          }
        }
        &[data-state~="radius-medium"] {
          padding-top: var(--radius-medium);
          &:after {
            height: var(--radius-medium);
          }
        }
        &[data-state~="radius-large"] {
          padding-top: var(--radius-large);
          &:after {
            height: var(--radius-large);
          }
        }
        &[data-state~="radius-big"] {
          padding-top: var(--radius-big);
          &:after {
            height: var(--radius-big);
          }
        }
        &:global(.active) {
          &:after {
            border-radius: inherit;
            content: '';
            position: absolute;
            top: -1px;
            right: -1px;
            bottom: auto;
            left: -1px;
          }
        }
        &:first-of-type {
          &:global(.active) {
            &:after {
              left: 0;
            }
          }
        }
      }
    }
    &[data-state~='vertical'] {
      & :global(.tab) {
        &[data-state~="radius-none"] {
          &:after {
            width: 4px;
          }
        }
        &[data-state~="radius-small"] {
          &:after {
            width: var(--radius-small);
          }
        }
        &[data-state~="radius-medium"] {
          &:after {
            width: var(--radius-medium);
          }
        }
        &[data-state~="radius-large"] {
          &:after {
            width: var(--radius-large);
          }
        }
        &[data-state~="radius-big"] {
          &:after {
            width: var(--radius-big);
          }
        }
        &:global(.active) {
          &:after {
            border-radius: inherit;
            content: '';
            position: absolute;
            top: -1px;
            right: auto;
            bottom: -1px;
            left: -1px;
          }
        }
      }
    }
  }
}