<style>
    .logo-light {
        display: block;
    }

    .logo-dark {
        display: none;
    }

    html.dark .logo-light {
        display: none;
    }

    html.dark .logo-dark {
        display: block;
    }
    .brandTitle{
        font-size: 30px;
        margin-left: 10px;
    }
</style>
<div class="flex items-center space-x-4">
    <img src="{{ asset('assets/images/logo.png') }}" width="40" alt="Light Logo" class="h-10 logo-light">
    <img src="{{ asset('assets/images/logo.png') }}" width="40" alt="Dark Logo" class="h-10 logo-dark">
</div>
