CSS Bootstrap form-floating textarea label Dark Mode

[Pfandfinder]

hallo,

ich möchte mit Bootstrap eine form im Dark Mode bauen. mit diesem CSS läuft soweit alles auch korrekt ab, nur das label bei der textarea bei active hat so einen hellen Hintergrund. selbst die KI kann mir nicht helfen. weiß jemand wie ich das auch noch ändere ? bei den normalen inputs ist es ja korrekt.

<div class="col-12">
    <div class="form-floating">
        <textarea name="textare" id="textare" class="form-control" placeholder=""></textarea>
        <label for="textare">Das ist der Label-Text</label>
    </div>
</div>

[data-theme="dark"] {
  .form-control {
    background-color: #2C2C2C;
    color: #e0e0f0;
    border-color: #444;
  }

  .form-control:focus {
    background-color: #2C2C2C;
    color: #e0e0f0;
    border-color: #7b7bff;
    box-shadow: 0 0 0 0.25rem rgba(123, 123, 255, 0.25);
  }

  .form-control::placeholder {
    color: #888899;
  }

  .form-control:-webkit-autofill,
  .form-control:-webkit-autofill:focus {
    -webkit-box-shadow: 0 0 0 1000px #2C2C2C inset;
    -webkit-text-fill-color: #e0e0f0;
    caret-color: #e0e0f0;
    border-color: #444;
    transition: background-color 5000s ease-in-out 0s;
  }

  .form-floating > label {
    color: #888899;
  }

  .form-floating > .form-control:focus ~ label,
  .form-floating > .form-control:not(:placeholder-shown) ~ label {
    color: #a0a0ff;
    opacity: 1;
  }
}

 

[Cool Master]

Poste doch bitte das gesamte CSS und HTML