username change

<?php
session_start();

if (isset($_SESSION['id']) && isset($_SESSION['user_name'])) {

 ?>
<!DOCTYPE html>
<html id="suka">

<body>
<div style="position:fixed; top:5vh; left:5vh; width: 100px; height: 100px; justify-content: flex-start; align-items: flex-start; gap: 10px; display: inline-flex">
    <img style=" position:absolute; top:5%; left:5%; width: 80px; height: 80px; border-radius: 9999px" src="src/media/logo.png" />
  </div>
  <div style="position:fixed; top:9vh; left:13vh; width: 175px; height: 30px; padding: 10px; justify-content: center; align-items: center; display: inline-flex">
    <a href="index.php" class="mont" style="text-decoration: none;">UNO-WTF.TK</a>
  </div>
  <div>
  <a href="home.php" class="mont" style="position:fixed; text-decoration: none; top:9vh; right:20vh;  width: 205px; height: 30px; padding: 10px;" >Личный кабинет</a>
  <a href="forum.php" class="mont" style="position:fixed; text-decoration: none; top:9vh; right:5vh;  width: 100px; height: 30px; padding: 10px;">Форум</a>
  </div>
  </body>

<head>
    <title>Профиль: <?php echo $_SESSION['user_name']; ?></title>
     <link rel="stylesheet" type="text/css" href="style.css">
    <link rel="stylesheet" href="fonts/fonts.css">
</head>
<body>

<body style="background: #11191F; display: flex; justify-content: center; align-items: center; height: 100vh; flex-direction: column;">
<div style="width: 415px; height: 400px; position: fixed; left: 3%; top:30%">
     <div style="width: 415px; height: 400px; left: 0px; top: 0px; position: absolute; background: #141E26; border-radius: 65px"></div>
     <a href="settings.php" class="mont" style="filter: drop-shadow(0 0 0px #ffffff); text-decoration: none; width: 253px; height: 40px; left: 81px; top: 177px; position: absolute; ">⚙    Настройки</a>
     <a href="safety.php" class="mont" style="filter: drop-shadow(0 0 0px #ffffff); text-decoration: none; width: 253px; height: 40px; left: 81px; top: 269px; position: absolute; ">🔐    Безопасность</a>
     <a href="avatar.php" class="mont" style="filter: drop-shadow(0 0 0px #ffffff); text-decoration: none; width: 253px; height: 40px; left: 81px; top: 85px; position: absolute; ">🖼    Аватар </a>
     </div>


     <div style="width: 603px; height: 400px; position: fixed; top:30%; right: 2%;">
      <div class="wow" style="width: 603px; height: 400px; left: 0px; top: 0px; position: absolute; background: #141E26; border-radius: 65px;"></div>
      <a href="logout.php" style="z-index:1; text-decoration: none; position:absolute; right:25%; top:80%;">
      <button  type="submit" style="    float: right; background: #000AFF; padding: 10px 15px; color: #fff; border-radius: 5px; left: 180vh; border: none;">Выйти из аккаунта</button>
      </a>
      <button onclick="confirmDelete()" style="z-index:1; text-decoration: none; position:absolute; right:50%; top:80%; background: #000AFF; padding: 10px 15px; color: #fff; border-radius: 5px; border: none;">Удалить аккаунт</button>
      <script>
            function confirmDelete() {
                if (confirm("Вы уверены, что хотите удалить свой аккаунт?")) {
                    window.location = "dell_acc.php";
                }else{
                  window.location = "settings.php";
                }
            }
      </script>
      <div class="wow" style="width: 160.94px; left: 45%; top: 82px; position: absolute; text-align:centr;"><?php echo $_SESSION['user_name']; ?></div>
      <img style="width: 122.23px; height: 120px; left: 240.39px; top: 140px; border-radius: 9999px; position: absolute" src="<?php echo $_SESSION['avatar']; ?>" />
      <div class="wow" style="width: 265.85px; height: 28px; left: 30%; top: 25px; position: absolute; ">Добро пожаловать,</div>
    </div>


     <div style="width: 741px; height: 400px; position: fixed; top: 30%; left: 28%;">

      <div class="wow" style="width: 650px; height: 400px; left: 0px; top: 0px; position: absolute; background: #141E26; border-radius: 65px">
      <?php if (isset($_GET['error'])) { ?>
            <p class="error" style="position:fixed; right:5%; top:20%; width:500px; hight:100px;"><?php echo $_GET['error']; ?></p>
        <?php } ?>
    </div>
      <form action="update_nickname.php" method="post"  style="width: 500px; border: 2px solid #141E26; padding: 30px; background: #141E26; border-radius: 15px; z-index:4; position:absolute; top:0%; left:10%;">
      <h2 style="color: #ccc; text-align: center; margin-bottom: 40px;">Смена UserName</h2>
      <h4 style="color: #FF0000;  text-align: center; margin-bottom: 40px;">ПОСЛЕ СМЕНЫ USERNAME СЕССИЯ БУДЕТ ПРИНУДИТЕЛЬНО ОКОНЧЕННА!</h4>
      <label for="new_nickname"></label><br>
        <input type="text" id="new_nickname" maxlength="11"  name="new_nickname"><br>
        <input type="submit" class="wow" style="background: #141E26;" value="Изменить UserName">
      </form>
    </div>

     <script src="./src/visual/dop.js"></script>
     <script src="./src/visual/back.js"></script>
     <script src="./src/visual/app.js"></script>
</body>
</html>

<?php
}else{
     header("Location: index.php");
     exit();
}
 ?>