{# Must be replaced with a web component #}
<header class="container-fluid">
    <div class="row">
        <div class="sidebar navbar-brand col-md-3 col-lg-2 p-0"><a
                class="offcanvas-md col-md-3 col-lg-2 me-0 px-0 link-underline link-underline-opacity-0" href="/"><span
                    class="Logo_logo-wrapper__rneju"><svg fill="none" height="400" viewBox="0 0 400 400" width="400"
                        xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
                        <clipPath id="a">
                            <path d="m0 0h400v400h-400z"></path>
                        </clipPath>

                    </svg><span>Metawarc</span></span></a></div>
    </div>
    <style>
        .Logo_logo-wrapper__rneju {
            padding-top: 1rem;
            padding-left: 1rem;
            gap: 1rem;
            flex: 0 0 auto;
            display: flex;
            text-decoration: none;
            box-sizing: border-box;
            color: buttontext;
        }

        .Logo_logo-wrapper__rneju svg {
            color: buttontext;
            display: flex;
            width: 2rem;
            height: 2rem;
        }

        .fs-1 {
            font-size: 2rem !important;
        }
        .navbar {
            --bs-navbar-brand-padding-y: 1.01rem;
        }
    </style>
</header>