@forward "AFieldset";
@forward "AForm";
@forward "ASwitch";
@forward "ASelect";
@forward "AErrors";
@forward "AInputFile";
@forward "ADatepicker";
@forward "ACheckbox";
@forward "ARadio";
@forward "AJson";
@forward "AMultiselectOrdered";
@forward "ASlider";

.a_form_element__parent {
  width: 100%;
  --a_form_element_error_color: var(--a_color_danger);
  --a_form_element_label_float_top: 1.125rem;
}
.a_fieldset__content {
  --a_form_element_error_color: var(--a_color_danger);
}

.a_form_element__parent_float {
  position: relative;
  .a_form_element_label {
    position: absolute;
    left: 0.625rem;
    top: var(--a_form_element_label_float_top);
    transform: translateY(-50%);
    color: #9f9185;
    font-size: 1rem;
    background: #fff;
    padding: 0 0.2rem;
    z-index: 4;
    max-width: calc(100% - 1.25rem);
    width: auto !important;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;

    &_error {
      color: var(--a_form_element_error_color);
    }
  }
  &:focus-within,
  &.a_form_element__parent_not_empty {
    .a_form_element_label {
      transition: all .3s;
      top: 0;
      color: #555;
      font-size: 0.875rem;

      &_error {
        color: var(--a_form_element_error_color);
      }
    }
  }
}
.a_form_element__parent_float_has_icon_prepend {
  .a_form_element_label {
    left: 1.5rem;
  }
  .a_form_control {
    padding-left: 1.5rem;
  }
}
.a_form_element__parent_float_has_error_icon {
  .a_form_control {
    padding-left: 1.5rem;
  }
}
.a_form_element__parent_float_has_two_icons_prepend {
  .a_form_control {
    padding-left: 2.35rem;
  }
}

.a_form_element_label__spinner {
  margin-left: .5rem;
}

.a_form_element_label_error {
  color: var(--a_form_element_error_color);
}

.a_form_element {
  position: relative;
  .a_form_element_with_one_btn {
    padding-right: 1.875rem;
  }
  .a_form_element_with_two_btns {
    padding-right: 3.125rem;
  }
  .a_form_element_with_three_btns {
    padding-right: 4.375rem;
  }
  .a_form_element_with_four_btns {
    padding-right: 5.625rem;
  }
}

.a_form_control {
  display: block;
  width: 100%;
  padding: 0.375rem 0.75rem;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ced4da;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  border-radius: var(--a_border_radius);
  transition: border-color .15s ease-in-out,box-shadow .15s ease-in-out;
  &:focus,
  &.a_file__label:focus-within {
    color: #212529;
    background-color: #fff;
    border-color: #86b7fe;
    outline: 0;
    box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  }
  &:disabled, &.disabled {
    background-color: #e9ecef;
    opacity: 1;
  }
}
.a_form_control__actions {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: .2rem;
}
.a_form_control__actions__btn {
  --a_btn_padding_x: 0.2rem;
  --a_btn_padding_y: 0.1rem;
}

.a_form_control_invalid,
.a_group_invalid .a_form_control {
  border-color: var(--a_form_element_error_color);
  &:focus {
    border-color: var(--a_form_element_error_color);
    box-shadow: 0 0 0 0.25rem rgba(220, 53, 69, 0.25);
  }
}
.a_form_control_lg {
  min-height: calc(1.5em + 1rem + 2px);
  padding: 0.5rem 1rem;
  font-size: 1.25rem;
  border-radius: 0.5rem;
}
.a_form_control_sm {
  min-height: calc(1.5em + 0.5rem + 2px);
  padding: 0.25rem 0.5rem;
  font-size: .875rem;
  border-radius: 0.25rem;
}

.a_input__icon_prepend,
.a_input__icon_error {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
}
.a_input__icon_error {
  left: .4rem;
  color: var(--a_form_element_error_color);
}
.a_input__icon_prepend {
  left: .4rem;
}
.a_form_element__parent_float_has_error_icon {
  .a_input__icon_prepend {
    left: 1.5rem;
  }
}


.a_form_element__help_text {
  width: 100%;
  margin-top: 0.25rem;
  font-size: .875em;
}
.a_form_element__invalid_text {
  width: 100%;
  font-size: .875em;
  color: var(--a_form_element_error_color);
  list-style: none;
  margin: 0;
  padding: 0;
}
.a_form_element_label_static {
  font-weight: bolder;
}

.a_required {
  margin-bottom: 1rem;
}

.a_form_element_readonly_value_range {
  display: flex;
  flex-wrap: wrap;
  .a_form_element_readonly {
    display: flex;
    flex-wrap: wrap;
    + .a_form_element_readonly {
      margin-left: .5rem;
    }
  }
  .a_form_element_readonly_label + .a_form_element_readonly_value {
    margin-left: .5rem;
  }
}
.a_form_element_readonly_value_fieldset {
  margin-left: .5rem;
}

// fix für autofill
input:-webkit-autofill {
  // Expose a hook for JavaScript when auto fill is shown.
  // JavaScript can capture 'animationstart' events
  animation-name: onAutoFillStart;

  // Make the background color become yellow _really slowly_
  transition: background-color 50000s ease-in-out 0s;
}

input:not(:-webkit-autofill) {
  // Expose a hook for JS onAutoFillCancel
  // JavaScript can capture 'animationstart' events
  animation-name: onAutoFillCancel;
}

//password/
input[type="password"]::-ms-reveal {
  display: none;
}
input[type="text"]::-ms-clear {
  display: none;
}

@keyframes onAutoFillStart {
  from {/**/}
  to {/**/}
}

@keyframes onAutoFillCancel {
  from {/**/}
  to {/**/}
}