2 row navbar full width

HTML

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.5.3/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.15.1/css/all.min.css">
<nav class="navbar navbar-expand-md fixed-top nav-wrapper">
        <a class="navbar-brand" href="/">
            <img id="brandLogo" src="https://getbootstrap.com/docs/4.0/assets/brand/bootstrap-solid.svg" class="img-fluid" width="30" height="30" alt="brand logo">
        </a>
        <button class="navbar-toggler mb-2 mr-2" type="button" data-toggle="collapse" data-target="#navbarCollapse">
            <span class="navbar-toggler-icon">
                <i class="fa fa-bars bg-primary p-2 text-white" style="font-size:28px;">
                    
                </i>
            </span>
        </button>
        <div style="border: solid 0px red;" 
             class="collapse navbar-collapse flex-column align-items-start ml-lg-2 ml-0" 
             id="navbarCollapse">
            <div style="border:solid 0px green;" id="quickMenu"
                 class="navbar-nav w-100 d-flex flex-md-row-reverse flex-sm-column-reverse pr-md-5">
                <div class="nav-item" style="border: solid 0px blue" id="ctaMenu">
                    <div class="d-flex">
                        <div class="nav-item mr-3">
                            <a href='/calendar' title="Calendar"
                               class="text-dark nav-link mb-sm-2 font-weight-bold py-0">
                            <i class="fa fa-calendar"></i></a>
                        </div>
                        <div class="nav-item">
                            <a href='#' title="Apply"
                               class="font-weight-bold btn btn-danger px-4 text-uppercase text-white">Apply</a>
       ...