{% put styles %}
<style>
    .notification--bullet {
        background: green !important;
    }
</style>
{% endput %}
<!-- BEGIN: Top Bar -->
<div
    class="top-bar-boxed h-[70px] md:h-[65px] z-[51] border-b border-white/[0.08] mt-12 md:mt-0 -mx-3 sm:-mx-8 md:-mx-0 px-3 md:border-b-0 relative md:fixed md:inset-x-0 md:top-0 sm:px-8 md:px-10 md:pt-10 md:bg-gradient-to-b md:from-slate-100 md:to-transparent dark:md:from-darkmode-700">
    <div class="h-full flex items-center">
        <!-- BEGIN: Logo -->
        <a href="/seller-home" class="logo -intro-x hidden md:flex xl:w-[180px] block" style="margin-left: 30px;">
            <img alt="Nurgul" class="logo__image" style="width: 6.5rem;" src="{{'assets/logo_white.svg'|theme}}">
            <!-- <span class=" logo__text text-white text-lg ml-3"> Enigma </span> -->
        </a>
        <!-- END: Logo -->
        <!-- BEGIN: Breadcrumb -->
        <nav aria-label="breadcrumb" class="-intro-x h-[45px] mr-auto">
            <ol class="breadcrumb breadcrumb-light">
                <li class="breadcrumb-item"><a href="/">Nurgul</a></li>
<!--                <li class="breadcrumb-item active" aria-current="page">{{ this.page.meta_title }}</li>-->
            </ol>
        </nav>
        <!-- END: Breadcrumb -->
        <!-- BEGIN: Account Menu -->
        <div class="intro-x dropdown w-8 h-8">
            <div class="dropdown-toggle w-8 h-8 rounded-full overflow-hidden shadow-lg image-fit zoom-in scale-110"
                role="button" aria-expanded="false" data-tw-toggle="dropdown">
                <img alt="NURGUL" src="{{'assets/profile.jpg'|theme}}">
            </div>
            <div class="dropdown-menu w-56">
                <ul
                    class="dropdown-content bg-primary/80 before:block before:absolute before:bg-black before:inset-0 before:rounded-md before:z-[-1] text-white">
                    <li class="p-2">
                        <div class="font-medium">{{user.name}} {{user.surname}}</div>
                        <div class="text-xs text-white/60 mt-0.5 dark:text-slate-500">{{user.email}}</div>
                    </li>
                    <li>
                        <hr class="dropdown-divider border-white/[0.08]">
                    </li>
                    <li>
                        <a href="" class="dropdown-item hover:bg-white/5"> <i data-lucide="help-circle"
                                class="w-4 h-4 mr-2"></i> {{'Help'|_}} </a>
                    </li>
                    <li>
                        <hr class="dropdown-divider border-white/[0.08]">
                    </li>
                    <li>
                        <a href="javascript:;" data-request="onLogout" data-request-data="redirect: '/seller-home'"
                            class="dropdown-item hover:bg-white/5"> <i data-lucide="toggle-right"
                                class="w-4 h-4 mr-2"></i> {{'logout.title'|_}} </a>
                    </li>
                </ul>
            </div>
        </div>
        <!-- END: Account Menu -->
    </div>
</div>
<!-- END: Top Bar -->
