/* =====================
   TEXTAREA PARTIAL
   ===================== */

/* Floating label container — replaces Bootstrap's .form-floating */
.form-floating {
  position: relative;
}

.custom-form .form-floating > .form-control {
  height: calc(3.5rem + 4px);
  line-height: 1.25;
  padding: 1.2rem 20px 0.4rem;
}

.custom-form .form-floating > .form-control::-moz-placeholder { color: transparent; opacity: 0; }
.custom-form .form-floating > .form-control::placeholder { color: transparent; opacity: 0; }

.custom-form .form-floating > .form-control:not(:-moz-placeholder-shown),
.custom-form .form-floating > .form-control:focus,
.custom-form .form-floating > .form-control:not(:placeholder-shown) {
  padding-top: 1.625rem;
  padding-bottom: 0.625rem;
}

.custom-form .form-floating > textarea.form-control {
  height: 110px;
  padding-top: 1.5rem;
  resize: vertical;
}

.form-floating > label {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 1rem 0.75rem;
  pointer-events: none;
  border: 1px solid transparent;
  transform-origin: 0 0;
  transition: opacity 0.1s ease-in-out, transform 0.1s ease-in-out;
  color: var(--p-color);
  font-size: 1rem;
  margin-top: 0;
  text-align: start;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.custom-form .form-floating > .form-control:focus ~ label,
.custom-form .form-floating > .form-control:not(:placeholder-shown) ~ label {
  opacity: 0.65;
  transform: scale(0.85) translateY(-0.5rem) translateX(0.1rem);
}