.p-floatlabel {
  @apply block relative;

  label {
    @apply absolute top-1/2 pointer-events-none leading-none left-4 text-gray-50 bg-transparent transition-all duration-200;
  }

  &:has(.p-textarea) label {
  }

  &:has(.p-inputicon:first-child) label {
  }

  &:has(.p-invalid) label {
    @apply text-danger;
  }

  &:has(input:focus) label,
  &:has(input.p-filled) label,
  &:has(input:-webkit-autofill) label,
  &:has(textarea:focus) label,
  &:has(textarea.p-filled) label,
  &:has(.p-inputwrapper-focus) label,
  &:has(.p-inputwrapper-filled) label {
    @apply top-0 left-2 text-caption px-1 bg-white text-primary z-[1];
  }

  &:has(input.p-filled) label,
  &:has(textarea.p-filled) label,
  &:has(.p-inputwrapper-filled) label {
  }

  &:has(input:focus) label,
  &:has(input:-webkit-autofill) label,
  &:has(textarea:focus) label,
  &:has(.p-inputwrapper-focus) label {
  }

  &-in .p-inputtext,
  &-in .p-textarea,
  &-in .p-select-label,
  &-in .p-multiselect-label,
  &-in .p-autocomplete-input-multiple,
  &-in .p-cascadeselect-label,
  &-in .p-treeselect-label {
  }

  &-in:has(input:focus) label,
  &-in:has(input.p-filled) label,
  &-in:has(input:-webkit-autofill) label,
  &-in:has(textarea:focus) label,
  &-in:has(textarea.p-filled) label,
  &-in:has(.p-inputwrapper-focus) label,
  &-in:has(.p-inputwrapper-filled) label {
  }

  &-on:has(input:focus) label,
  &-on:has(input.p-filled) label,
  &-on:has(input:-webkit-autofill) label,
  &-on:has(textarea:focus) label,
  &-on:has(textarea.p-filled) label,
  &-on:has(.p-inputwrapper-focus) label,
  &-on:has(.p-inputwrapper-filled) label {
  }
}
