Nav Walker for Sub Menu

I have a problem with my Nav Walker in Wordpress. I want to create a Navigation Menu that looks like the code below:

<nav class="nav" id="menu">
    <ul class="nav__inner">
        <li>
            <a href="#"> Navelement 1 </a>
        </li>

        <li>
            <div id="dropBtn" class="nav__inner-dropBtn">
                Navelement 2
                <span>
                            <img src="assets/images/icons/chevron.svg" alt=""/>
                          </span>
            </div>

            <div class="nav__inner-overlay" id="drop">
                <div class="nav__inner-dropdown">
                    <a href="#"> Sub 1 </a>
                    <a href="#"> Sub 2 </a>
                    <a href="#"> Sub 3 </a>
                    <a href="#"> Sub 4 </a>
                </div>
            </div>
        </li>
    </ul>
</nav>

My Nav Walker class looks like this:

function start_el(&$output, $item, $depth = 0, $args = [], $id = 0)
{

    if ($depth == 0) {
        if ($args->walker->has_children) {
            $output .= '<li>
                    <div id="dropBtn" class="nav__inner-dropBtn">';
            $output .= $item->title;
            $output .= '
                        <span>
                <img src="';
            $output .= get_template_directory_uri();
            $output .= '/assets/images/icons/chevron.svg" alt="" />
              </span>
                    </div>';

        } else {
            $output .= '<li><a href="';
            $output .= $item->url . '">';
            $output .= $item->title;
            $output .= $depth;
            $output .= '</a></li>';
        }

    }

    if ($depth == 1) {

        $output .= '<a href="';
        $output .= $item->url . '">';
        $output .= $item->title;
        $output .= $depth;
        $output .= '</a>';


    }


}

The output in HTML looks like it should - except from the Dropdown List as you can see here:

<li>
    <div id="dropBtn" class="nav__inner-dropBtn">Seite 2
        <span>
    <img src="#" alt=""/>
        </span>
    </div>
    <div class="nav__inner-overlay" id="drop">
        <div class="nav__inner-dropdown"><a href="#">Seite 881</a>
</li>
<a href="#">Seite 2/31</a></li>
<a href="#">Seite 2/41</a></li>
<a href="##">Seite 2/21</a></li>
<a href="#">Seite 2/11</a></li>
</ul>
</li>

Can somebody help me to fix this issue? Thank You already!