Changing div z-index when dropdown is opened

I'm developing a laravel project and I got stuck somewhere. I wanted to ask you people who know.

When I open a dropdown menu, I want to change the z-index parameter of another div class. I want the z-index to be restored when dropdown is closed.

nav dropdown

<div class="nav-item dropdown">
                <a href="#" class="nav-link d-flex lh-1 text-reset p-0" data-bs-toggle="dropdown" aria-label="Open user menu" aria-expanded="false">
                                        <span class="avatar avatar-sm" style="background-image: url(http://localhost/storage/avatar/1654729156.png)"></span>
                                        <div class="d-none d-xl-block ps-2">
                        <div>x</div>
                        <div class="mt-1 small text-muted">xxx@g...</div>
                    </div>
                </a>
              
                <div class="dropdown-menu dropdown-menu-end dropdown-menu-arrow">
                    <a href="http://localhost/profile/x" class="dropdown-item">Profil</a>
                    <a href="http://localhost/kaydedilenler" class="dropdown-item">Kaydedilenler</a>
                    <div class="dropdown-divider"></div>
                    <a href="http://localhost/hesap/düzenle" class="dropdown-item">Hesap</a>
                                                            <a href="http://localhost/logout" class="dropdown-item" onclick="event.preventDefault();
                                document.getElementById('logout-form').submit();">Çıkış Yap</a>
                    <form id="logout-form" action="http://localhost/logout" method="POST">
                        <input type="hidden" name="_token" value="kBUQFXTwUu3m13f">                    </form>
                </div>
            </div>

The navbar with the z-index I want to change

<div class="navbar-expand-md sticky-top shadow">
    <div class="collapse navbar-collapse" id="navbar-menu">
        <div class="navbar navbar-dark">
            <div class="container-xl">
                <ul class="navbar-nav">
                    <li class="nav-item active">
                        <a class="nav-link strong" href="http://localhost">
                            <span class="nav-link-icon d-lg-inline-block">
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><line x1="4" y1="6" x2="13" y2="6"></line><line x1="4" y1="12" x2="11" y2="12"></line><line x1="4" y1="18" x2="11" y2="18"></line><polyline points="15 15 18 18 21 15"></polyline><line x1="18" y1="6" x2="18" y2="18"></line></svg>
                            </span>
                            <span class="nav-link-title">
                                En Son
                            </span>
                        </a>
                    </li>
                    
                    <li class="nav-item ">
                        <a class="nav-link strong" href="http://localhost/viral">
                            <span class="nav-link-icon d-lg-inline-block">
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><line x1="3" y1="12" x2="6" y2="12"></line><line x1="12" y1="3" x2="12" y2="6"></line><line x1="7.8" y1="7.8" x2="5.6" y2="5.6"></line><line x1="16.2" y1="7.8" x2="18.4" y2="5.6"></line><line x1="7.8" y1="16.2" x2="5.6" y2="18.4"></line><path d="M12 12l9 3l-4 2l-2 4l-3 -9"></path></svg>
                            </span>
                            <span class="nav-link-title">
                                Viral
                            </span>
                        </a>
                    </li>
                    
                    <li class="nav-item ">
                        <a class="nav-link strong" href="http://localhost/random">
                            <span class="nav-link-icon d-lg-inline-block">
                                <svg xmlns="http://www.w3.org/2000/svg" class="icon" style="" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><path d="M3 17h5l1.67 -2.386m3.66 -5.227l1.67 -2.387h6"></path><path d="M18 4l3 3l-3 3"></path><path d="M3 7h5l7 10h6"></path><path d="M18 20l3 -3l-3 -3"></path></svg>
                            </span>
                            <span class="nav-link-title">
                                Rastgele
                            </span>
                        </a>
                    </li>

                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#sidebar-authentication" data-bs-toggle="dropdown" role="button" aria-expanded="false">
                            <span class="nav-link-icon d-lg-inline-block">
                            <i class="fa-solid fa-hands-bound" style=""></i>
                            </span>
                            <span class="nav-link-title">
                            Kategoriler
                            </span>
                            
                        </a>
                        <div class="dropdown-menu">
                                                                                        <a class="dropdown-item" href="http://localhost/category/genel">
                                                Genel
                                            </a>
                                                                                    </div>
                    </li>

                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#navbar-extra" data-bs-toggle="dropdown" role="button" aria-expanded="false">
                            <span class="nav-link-icon d-lg-inline-block">
	                            <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><circle cx="9" cy="7" r="4"></circle><path d="M3 21v-2a4 4 0 0 1 4 -4h4a4 4 0 0 1 4 4v2"></path><path d="M16 3.13a4 4 0 0 1 0 7.75"></path><path d="M21 21v-2a4 4 0 0 0 -3 -3.85"></path></svg>
                            </span>
                            <span class="nav-link-title">
                                Cinsiyet
                            </span>
                        </a>
                        <div class="dropdown-menu">
                                                        <a class="dropdown-item" href="http://localhost/gender/1/erkek">
                                Erkek
                            </a>
                                                    </div>
                    </li>
                    
                    <li class="nav-item dropdown">
                        <a class="nav-link dropdown-toggle" href="#sidebar-authentication" data-bs-toggle="dropdown" role="button" aria-expanded="false">
                            <span class="nav-link-icon d-lg-inline-block">
                            <i class="fa-solid fa-file-lines" style=""></i>
                            </span>
                            <span class="nav-link-title">
                            Sayfalar
                            </span>
                            
                        </a>
                        <div class="dropdown-menu">
                                                                                        <a href="http://localhost/page/sartlar-ve-politikalar" class="dropdown-item text-truncate">
                                                sartlar ve Politikalar
                                            </a>
                                                                                        <a href="http://localhost/page/iletisim" class="dropdown-item text-truncate">
                                                iletisim
                                            </a>
                                                                                        <a href="http://localhost/page/hos-geldiniz" class="dropdown-item text-truncate">
                                                hoş geldiniz
                                            </a>
                                                                                    </div>
                    </li>
                </ul>
                <div class="my-2 my-md-0 flex-grow-1 flex-md-grow-0 order-first order-md-last">
                    <a href="#" class="btn btn-white btn-pill strong" data-bs-toggle="modal" data-bs-target="#modal--write--story">
                        <svg xmlns="http://www.w3.org/2000/svg" class="icon" width="24" height="24" viewBox="0 0 24 24" stroke-width="2" stroke="currentColor" fill="none" stroke-linecap="round" stroke-linejoin="round"><path stroke="none" d="M0 0h24v24H0z" fill="none"></path><circle cx="12" cy="12" r="9"></circle><line x1="9" y1="12" x2="15" y2="12"></line><line x1="12" y1="9" x2="12" y2="15"></line></svg> Bir şeyler yaz
                    </a>
                </div>
            </div>
			
        </div>
        
    </div>

    
</div>