:root {
  --float-label--default--top: 10px;
  --float-label--default--left: 10px;
  --float-label--default--color: black;
  --float-label--default--font-size: inherit;
  --float-label--active--top: 0;
  --float-label--active--left: var(--float-label--default--left);
  --float-label--active--color: var(--float-label--default--color);
  --float-label--active--font-size: var(--float-label--default--font-size);
  --float-label--top: var(--float-label--default--top);
  --float-label--left: var(--float-label--default--left);
  --float-label--color: var(--float-label--default--color);
  --float-label--font-size: var(--float-label--default--font-size);
  --float-label--animation-duration: 0.2s;
}

.float-label {
  position: relative;
}
.float-label__label {
  position: absolute;
  top: var(--float-label--top);
  left: var(--float-label--left);
  margin: 0;
  padding: 0;
  color: var(--float-label--color);
  font-size: var(--float-label--font-size);
  transition: all var(--float-label--animation-duration);
  pointer-events: none;
}
.float-label__input::placeholder {
  color: transparent !important;
  opacity: 0 !important;
}
.float-label__label:has(+ .float-label__input:focus), .float-label__label:has(+ * .float-label__input:focus), .float-label__label:has(+ .float-label__input:not(:placeholder-shown)) {
  --float-label--top: var(--float-label--active--top);
  --float-label--left: var(--float-label--active--left);
  --float-label--color: var(--float-label--active--color);
  --float-label--font-size: var(--float-label--active--font-size);
  color: var(--float-label--active--color);
  pointer-events: initial;
}

/*# sourceMappingURL=float-label.css.map */