@import '../../../theme/styles/default';

@ad-shf-prefix: ~'.ad-shf';
@ad-shf-label-color: rgba(0, 0, 0, 0.85);
@ad-shf-field-bottom: @layout-gutter;

@{ad-shf-prefix} {
  &__wrap {
    display: flex;
    flex-wrap: wrap;
    &@{ad-shf-prefix}__vertical {
      display: block;
    }
  }
  &__item {
    display: block;
  }
  &__label {
    text-align: right;
    color: @ad-shf-label-color;
    white-space: nowrap;
    display: table-cell;
    flex: 0 0 auto;
    &:not(@{ad-shf-prefix}__nolabel) {
      &:after {
        content: ':';
        margin: 0 @layout-gutter 0 2px;
        position: relative;
        top: -0.5px;
      }
    }
  }
  &__control {
    flex: 1 0 0;
  }
  &__horizontal {
    @{ad-shf-prefix}__item {
      display: flex;
      margin-bottom: @ad-shf-field-bottom;
      &:last-child {
        margin-bottom: 0;
      }
    }
  }
  &__inline,
  &__vertical {
    @{ad-shf-prefix}__nolabel {
      display: none !important;
    }
  }
  &__inline {
    @{ad-shf-prefix}__item {
      width: auto;
      &:last-child {
        margin-right: 0;
      }
    }
  }
}
