bootstrap некорректно работает модальное окно

подскажите, кто сталкивался, взял 2 модалки из bootstap, когда открываешь первую с модалку с авторизацией, в ней есть кнопка чтобы открыть вторую с регистрацией. Проблема в том, что по моему наблюдению когда открывается модалка с регистрацией, те данные которые я туда ввожу, они как будто записываеются в первую модалку.Если закоментить модалку с авторизацией в html, то регистрация прекрасно работает. Возможно где то упустил какой то класс и не вижу.

modal.php

<div class="modal fade" id="exampleModalToggle" aria-hidden="true" aria-labelledby="exampleModalToggleLabel" tabindex="-1">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalToggleLabel">Aвторизация</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        <form>
          <div class="mb-3">
            <label for="exampleInputLogin" class="form-label">Логин</label>
            <input type="text" name="login"  class="form-control" id="exampleInputLogin" aria-describedby="loginHelp">
            <div id="loginHelp" class="form-text login"></div>
          </div>
          <div class="mb-3">
            <label for="exampleInputPassword1" class="form-label">Пароль</label>
            <input type="password" name="password" class="form-control" id="exampleInputPassword1">
            <div id="passwordHelp" class="form-text password"></div>
          </div>
        </form>
        <p class="authWin"></p>
        <button type="submit" class="btn btn-primary btn__auth">авторизироваться</button>
        <button class="btn btn-primary" data-bs-target="#exampleModalToggle2" data-bs-toggle="modal" data-bs-dismiss="modal">или зарегистрироваться</button>
      </div>
    </div>
  </div>
</div>









<div class="modal fade" id="exampleModalToggle2" aria-hidden="true" aria-labelledby="exampleModalToggleLabel2" tabindex="-1">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalToggleLabel2">Регистрация</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
      <form>
      <div class="mb-3">
            <label for="exampleInputLogin2" class="form-label">Логин</label>
            <input type="text" name="login"  class="form-control" id="exampleInputLogin2" aria-describedby="loginHelp">
            <div id="loginHelp2" class="form-text login"></div>
          </div>
          <div class="mb-3">
            <label for="exampleInputEmail12" class="form-label">Email</label>
            <input type="email" name="email" class="form-control" id="exampleInputEmail12" aria-describedby="emailHelp">
            <div id="emailHelp2" class="form-text email"></div>
          </div>
          <div class="mb-3">
            <label for="exampleInputPassword12" class="form-label">Пароль</label>
            <input type="password" name="password" class="form-control" id="exampleInputPassword12">
            <div id="passwordHelp"2 class="form-text password"></div>
          </div>
          <div class="mb-3">
            <label for="exampleInputPasswordConfirm12" class="form-label">Повторите пароль</label>
            <input type="password" name="passwordConfirm" class="form-control" id="exampleInputPasswordConfirm12">
            <div id="passwordConfirmHelp2" class="form-text password__confirm"></div>
          </div>
          <div class="mb-3 form-check">
            <input type="checkbox" class="form-check-input" id="exampleCheck1">
            <label class="form-check-label" for="exampleCheck1">Check me out</label>
          </div>
          <button type="submit" class="btn btn-primary btn__reg">зарегистрироваться</button>
          <button class="btn btn-primary" data-bs-target="#exampleModalToggle" data-bs-toggle="modal" data-bs-dismiss="modal">или авторизируйтесь</button>
        </form>
      </div>
    </div>
  </div>
</div>

Код из bootstap

<div class="modal fade" id="exampleModalToggle" aria-hidden="true" aria-labelledby="exampleModalToggleLabel" tabindex="-1">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalToggleLabel">Modal 1</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        Show a second modal and hide this one with the button below.
      </div>
      <div class="modal-footer">
        <button class="btn btn-primary" data-bs-target="#exampleModalToggle2" data-bs-toggle="modal" data-bs-dismiss="modal">Open second modal</button>
      </div>
    </div>
  </div>
</div>
<div class="modal fade" id="exampleModalToggle2" aria-hidden="true" aria-labelledby="exampleModalToggleLabel2" tabindex="-1">
  <div class="modal-dialog modal-dialog-centered">
    <div class="modal-content">
      <div class="modal-header">
        <h5 class="modal-title" id="exampleModalToggleLabel2">Modal 2</h5>
        <button type="button" class="btn-close" data-bs-dismiss="modal" aria-label="Close"></button>
      </div>
      <div class="modal-body">
        Hide this modal and show the first with the button below.
      </div>
      <div class="modal-footer">
        <button class="btn btn-primary" data-bs-target="#exampleModalToggle" data-bs-toggle="modal" data-bs-dismiss="modal">Back to first</button>
      </div>
    </div>
  </div>
</div>
<a class="btn btn-primary" data-bs-toggle="modal" href="#exampleModalToggle" role="button">Open first modal</a>