@import "../tokens/spacing";
@import "./error_state_mixin";

[class^=pb_form_group_kit] {
  display: inline-flex;
  flex-direction: row;
  align-items: flex-end;
  justify-content: flex-start;

  &[class*=_full] {
    display: flex;
    justify-content: space-between;
    & > div {
      width: 100%;
    }
  }

@include error-state-flex-start-selectors;
@include error-state-center-selectors;
@include error-state-flex-end-selectors;
@include error-state-left-side-select-kit;
@include error-state-right-side-select-kit;

  // &:has(.pb_text_input_kit.error):has(.pb_text_input_kit),
  // &:has(.pb_text_input_kit):has(.pb_date_picker_kit.error),
  // &:has(.pb_text_input_kit):has(.pb_select_kit_wrapper.error),
  // &:has(.pb_text_input_kit.error):has(.pb_text_input_kit_label):has(.pb_select_kit_wrapper.error) {
  //   align-items: flex-start;
  // }

  // &:has(.pb_text_input_kit:not(.error)):has(.pb_text_input_kit_label):has(.pb_select_kit_wrapper.error),
  // &:has(.pb_text_input_kit.error):has(.pb_text_input_kit_label):has(.pb_select_kit_wrapper) {
  //   align-items: flex-start;
  //   .pb_select_kit_wrapper,
  //   .pb_select_kit_wrapper.error {
  //     padding-top: $space_md;
  //     margin-top: 2px;
  //     .pb_select_kit_caret {
  //       padding-top: $space_xl;
  //     }
  //   }
  // }

  // &:has(.pb_select_kit_label):has(.pb_select_kit_wrapper.error):has(.pb_phone_number_input),
  // &:has(.pb_text_input_kit.error):has(.pb_text_input_kit_label):has([class^=pb_button_kit]) {
  //   align-items: center;
  // }

  // &:has(.pb_select_kit_label):has(.pb_select_kit_wrapper.error):has(.pb_phone_number_input):has(.pb_text_input_kit.error) {
  //   align-items: flex-end;
  // }

  // &:has(.pb_select_kit_label):has(.pb_select_kit_wrapper):has(.pb_phone_number_input):has(.pb_text_input_kit.error) {
  //   align-items: flex-start;
  //   .pb_text_input_kit.error {
  //     padding-top: $space_md;
  //     margin-top: 2px;
  //   }
  // }

  & [class^=pb_text_input_kit] .text_input_wrapper,
  & [class^=pb_date_picker_kit] .input_wrapper,
  & [class^=pb_select] {
    margin-bottom: 0;
  }

  [class^=pb_text_input_kit].dark .text_input_wrapper {
    margin-bottom: 0
  }

  & > [class^=pb_text_input_kit]:not(:last-child) {
    .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
      border-right-width: 0;

      &:focus {
        outline: $primary solid 1px;
        outline-offset: -1px;
      }
    }
    .text_input_wrapper_add_on .add-on-right [class^=pb_card_kit] {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
      border-right-width: 0;
    }
    .text_input_wrapper_add_on .add-on-right.border_left_on .card-right-aligned {
      border-left: 1px $border_light solid;
      &.dark {
        border-left: 1px rgba($white, 0.15) solid;
      }
    }
  }

  & > [class^=pb_text_input_kit]:not(:first-child) {
    .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
      border-bottom-left-radius: 0;
      border-top-left-radius: 0;
    }
    .text_input_wrapper_add_on .add-on-left [class^=pb_card_kit] {
      border-bottom-left-radius: 0;
      border-top-left-radius: 0;
    }
  }

  & > [class^=pb_button_kit]:not(:last-child) {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    min-height: 45px;
    margin-bottom: 16px;
  }

  & > [class^=pb_button_kit]:not(:first-child) {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
    border-left-width: 0;
    min-height: 45px;
    margin-bottom: 16px;
  }

  & > [class^=pb_phone_number_input]:not(:last-child) {
    .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
      border-right-width: 0;
    }
  }

  & > [class^=pb_phone_number_input]:not(:first-child) {
    .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
      border-bottom-left-radius: 0;
      border-top-left-radius: 0;
    }
  }

  & > div:not(:first-child) > [class^=pb_phone_number_input] {
    .text_input {
      border-bottom-left-radius: 0;
      border-top-left-radius: 0;
    }
  }

  & > div:not(:last-child) > [class^=pb_phone_number_input] {
    .text_input {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
      border-right: none;
    }
  }

  &[class*=rails] > [class^=pb_date_picker_kit] {
    margin-bottom: 0px;
  }

  & > [class^=pb_date_picker_kit]:not(:last-child) {
    .input_wrapper input, [class^=pb_text_input_kit] .date_picker_input_wrapper .flatpickr-wrapper {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
      border-right-width: 0;
    }
  }

  & > [class^=pb_date_picker_kit]:not(:first-child) {
    .input_wrapper input, [class^=pb_text_input_kit] .date_picker_input_wrapper .flatpickr-wrapper {
      border-bottom-left-radius: 0;
      border-top-left-radius: 0;
    }
  }

  & > [class^=pb_select]:not(:last-child) {
    margin-bottom: 0px;
    .pb_select_kit_wrapper select {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
      border-right-width: 0;
      &:focus {
        outline: $primary solid 1px;
        outline-offset: -1px;
      }
    }
  }

  & > [class^=pb_select]:not(:first-child) {
    margin-bottom: 0px;
    .pb_select_kit_wrapper select {
      border-bottom-left-radius: 0;
      border-top-left-radius: 0;
    }
  }

  & > [class^=pb_selectable_card_kit]:not(:last-child) label {
    border-bottom-right-radius: 0;
    border-top-right-radius: 0;
    border-right-color: transparent;
  }
  & > [class^=pb_selectable_card_kit] input[type="checkbox"]:not(:checked) ~ label, [class^=pb_selectable_card_kit] input[type="radio"]:not(:checked) ~ label {
    &:hover {
      border-right-color: $slate;
    }
  }

  & > [class^=pb_selectable_card_kit]:not(:first-child) label {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
  }

  & > [class^=pb_selectable_card_icon_kit]:not(:last-child) [class^=pb_selectable_card_kit] label {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
  }

  & > [class^=pb_selectable_card_icon_kit]:not(:first-child) [class^=pb_selectable_card_kit] label {
    border-bottom-left-radius: 0;
    border-top-left-radius: 0;
  }

  & > [class^=pb_selectable_card_icon_kit]:not(:last-child) {
    [class^=pb_selectable_card_kit] input[type="checkbox"]:not(:checked) ~ label, [class^=pb_selectable_card_kit] input[type="radio"]:not(:checked)~ label {
      border-right-color: transparent;
      &:hover {
        border-right-color: $slate;
      }
    }
  }

  & > [class^=pb_typeahead_kit] {
    min-width: 200px;
  }

  & > [class^=pb_typeahead_kit]:not(:last-child) {
    [class^=pb_text_input_kit] .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
      border-bottom-right-radius: 0;
      border-top-right-radius: 0;
      border-right-width: 0;
      min-height: 26px;
    }
  }

  & > [class^=pb_typeahead_kit]:not(:first-child) {
    [class^=pb_text_input_kit] .text_input_wrapper input, [class^=pb_text_input_kit] .text_input_wrapper .text_input {
      border-bottom-left-radius: 0;
      border-top-left-radius: 0;
    }
  }
}