label:has( > span):has(input:not([type="checkbox"], [type="radio"], [type="range"]), textarea, select), .has-float-label {
  & > span, & label {
    opacity: .75;
    padding-block-start: .25rem;
    padding-inline-start: calc(1rem + 1px);
    transition: all .25s;
  }

  & input, & textarea, & select {
    margin-block-start: 0;
    padding-block: 1.125rem .375rem;
    padding-inline-start: 1rem;

    &::placeholder {
      opacity: 1;
      transition: all .25s;
    }
  }

  &:has(:placeholder-shown:not(:focus)) {
    & > span, & label {
      padding-block: .75rem;
    }
  }
}