@import "../lib.less";
@import "../variables/components/input.less";

.@{veui-prefix}-input-group {
  display: inline-flex;
  align-items: stretch;

  .@{veui-prefix}-span,
  .@{veui-prefix}-label {
    display: flex;
    align-items: center;
    line-height: 1;
    border: 1px solid @veui-input-border-color;
    padding: 0 @veui-input-padding;
    border-radius: inherit;
    font-size: inherit;
  }

  .@{veui-prefix}-input {
    width: @veui-input-group-width;
  }

  & > [class*="@{veui-prefix}"] {
    position: relative;
    margin-right: -1px;
    z-index: 1;

    &:not(:only-child):first-child {
      .border-right-radius(0);
    }

    &:not(:only-child):last-child {
      .border-left-radius(0);
    }

    &:not(:first-child):not(:last-child) {
      border-radius: 0;
    }

    &:hover {
      z-index: 2;
    }

    &[class*="-focus"],
    &[data-focus-visible-added] {
      z-index: 3;
    }

    &.@{veui-prefix}-disabled {
      z-index: 0;
    }
  }
}