<aside class="op-sidebar" id="sidebar" role="navigation" aria-label="Main navigation">
    {# -- Logo ------------------------------------------- #}
    <div class="op-sidebar-header">
        <a href="/admin" class="op-logo">
            <img src="/assets/img/logo-light.svg" alt="{{ app_name ?? 'OwnPay' }}" class="op-logo-img op-logo-light" style="height: 32px; width: auto;">
            <img src="/assets/img/logo-dark.svg" alt="{{ app_name ?? 'OwnPay' }}" class="op-logo-img op-logo-dark" style="height: 32px; width: auto;">
        </a>
    </div>

    {# -- Brand Switcher -------------------------------- #}
    {% if is_superadmin %}
    <div class="op-sidebar-brand" id="brand-switcher">
        {% set active_brand = null %}
        {% for b in brands %}
            {% if b.id == active_brand_id %}
                {% set active_brand = b %}
            {% endif %}
        {% endfor %}

        <button class="op-brand-pill" id="brand-pill-btn" type="button">
            <div class="op-brand-pill-icon" style="background: {{ active_brand ? active_brand.color|default('#0F96ED') : 'var(--op-text-dim)' }}">
                {{ active_brand ? active_brand.initials|default('OP') : 'GL' }}
            </div>
            <span class="op-brand-pill-name">{{ active_brand ? active_brand.name : 'All Brands' }}</span>
            <svg class="op-brand-pill-chevron" width="12" height="12" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><polyline points="6 9 12 15 18 9"/></svg>
        </button>

        <div class="op-brand-dropdown" id="brand-dropdown">
            <a href="/admin/brands/switch?id=0" class="op-brand-dropdown-item {% if active_brand_id is empty %}active{% endif %}" data-brand-id="0">
                <div class="op-brand-dropdown-icon" style="background: var(--op-text-dim)">
                    <svg width="14" height="14" fill="none" stroke="#fff" stroke-width="2" viewBox="0 0 24 24"><rect x="3" y="3" width="7" height="7" rx="1"/><rect x="14" y="3" width="7" height="7" rx="1"/><rect x="14" y="14" width="7" height="7" rx="1"/><rect x="3" y="14" width="7" height="7" rx="1"/></svg>
                </div>
                <div class="op-brand-dropdown-info">
                    <span>{{ __('navbar.global_view') }}</span>
                    <small>View all brands</small>
                </div>
            </a>
            {% for b in brands %}
            <a href="/admin/brands/switch?id={{ b.id }}" class="op-brand-dropdown-item {% if active_brand_id == b.id %}active{% endif %}" data-brand-id="{{ b.id }}">
                <div class="op-brand-dropdown-icon" style="background: {{ b.color|default('#0F96ED') }}">
                    {{ b.initials|default('??') }}
                </div>
                <div class="op-brand-dropdown-info">
                    <span>{{ b.name }}</span>
                    <small>{{ b.description|default('') }}</small>
                </div>
                {% if active_brand_id == b.id %}
                <svg class="op-brand-dropdown-check" width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><polyline points="20 6 9 17 4 12"/></svg>
                {% endif %}
            </a>
            {% endfor %}
            <div class="op-brand-dropdown-divider" style="border-top: 1px solid var(--op-border-color, rgba(255,255,255,0.08)); margin: 6px 0;"></div>
            <a href="/admin/brands/create" class="op-brand-dropdown-item op-brand-dropdown-create-btn">
                <div class="op-brand-dropdown-icon" style="background: rgba(13, 148, 136, 0.1); color: var(--op-primary-color, #0d9488); display: flex; align-items: center; justify-content: center; font-size: 16px; font-weight: bold;">
                    +
                </div>
                <div class="op-brand-dropdown-info">
                    <span>Create New Brand</span>
                    <small>Setup another brand store</small>
                </div>
            </a>
        </div>
    </div>
    {% endif %}

    {# -- Navigation ------------------------------------- #}
    <nav class="op-sidebar-nav" id="sidebarNav">

        {# 1. Dashboard #}
        <a href="/admin" class="op-nav-item-link {{ active_page == 'dashboard' ? 'op-active' : '' }}">
            <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><rect x="3" y="3" width="7" height="9" rx="1"/><rect x="14" y="3" width="7" height="5" rx="1"/><rect x="14" y="12" width="7" height="9" rx="1"/><rect x="3" y="16" width="7" height="5" rx="1"/></svg>
            <span>{{ __('menu.dashboard') }}</span>
        </a>

        {# 2. Payments #}
        <div class="op-nav-group {% if active_page in ['transactions', 'payment-intents', 'invoices', 'payment-links', 'disputes', 'refunds'] %}op-nav-expanded{% endif %}">
            <button class="op-nav-item-link" type="button">
                <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><rect x="1" y="4" width="22" height="16" rx="2" ry="2"/><line x1="1" y1="10" x2="23" y2="10"/></svg>
                <span>{{ __('menu.payments') }}</span>
                <svg class="op-nav-chevron" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
            </button>
            <div class="op-sub-nav">
                <a href="/admin/transactions" class="op-sub-nav-link {{ active_page == 'transactions' ? 'op-active' : '' }}">
                    <span>{{ __('menu.transactions') }}</span>
                </a>
                <a href="/admin/payment-intents" class="op-sub-nav-link {{ active_page == 'payment-intents' ? 'op-active' : '' }}">
                    <span>{{ __('menu.payment_intents') }}</span>
                </a>
                <a href="/admin/invoices" class="op-sub-nav-link {{ active_page == 'invoices' ? 'op-active' : '' }}">
                    <span>{{ __('menu.invoices') }}</span>
                </a>
                <a href="/admin/payment-links" class="op-sub-nav-link {{ active_page == 'payment-links' ? 'op-active' : '' }}">
                    <span>{{ __('menu.payment_links') }}</span>
                </a>
                <a href="/admin/disputes" class="op-sub-nav-link {{ active_page == 'disputes' ? 'op-active' : '' }}">
                    <span>{{ __('menu.disputes') }}</span>
                </a>
                <a href="/admin/refunds" class="op-sub-nav-link {{ active_page == 'refunds' ? 'op-active' : '' }}">
                    <span>{{ __('menu.refunds') }}</span>
                </a>
            </div>
        </div>

        {# 3. Gateways #}
        <div class="op-nav-group {% if active_page in ['gateways', 'fee-rules'] %}op-nav-expanded{% endif %}">
            <button class="op-nav-item-link" type="button">
                <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M12 2v8M17 5H7M10 10v6a2 2 0 004 0v-6M12 16v6"/></svg>
                <span>Gateways</span>
                <svg class="op-nav-chevron" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
            </button>
            <div class="op-sub-nav">
                <a href="/admin/gateways" class="op-sub-nav-link {{ active_page == 'gateways' ? 'op-active' : '' }}">
                    <span>{{ __('menu.payment_gateways') }}</span>
                </a>
                {% if active_brand_id is empty or active_brand_id == 0 %}
                <a href="/admin/fee-rules" class="op-sub-nav-link {{ active_page == 'fee-rules' ? 'op-active' : '' }}">
                    <span>{{ __('menu.fee_rules') }}</span>
                </a>
                {% endif %}
            </div>
        </div>

        {# 4. People #}
        <div class="op-nav-group {% if active_page in ['brands', 'customers', 'staff', 'roles'] %}op-nav-expanded{% endif %}">
            <button class="op-nav-item-link" type="button">
                <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75"/></svg>
                <span>{{ __('menu.people') }}</span>
                <svg class="op-nav-chevron" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
            </button>
            <div class="op-sub-nav">
                {% if active_brand_id is empty or active_brand_id == 0 %}
                <a href="/admin/brands" class="op-sub-nav-link {{ active_page == 'brands' ? 'op-active' : '' }}">
                    <span>{{ __('menu.brands') }}</span>
                </a>
                {% endif %}
                <a href="/admin/customers" class="op-sub-nav-link {{ active_page == 'customers' ? 'op-active' : '' }}">
                    <span>{{ __('menu.customers') }}</span>
                </a>
                <a href="/admin/staff" class="op-sub-nav-link {{ active_page == 'staff' ? 'op-active' : '' }}">
                    <span>{{ __('menu.staff') }}</span>
                </a>
                <a href="/admin/roles" class="op-sub-nav-link {{ active_page == 'roles' ? 'op-active' : '' }}">
                    <span>{{ __('menu.roles_permissions') }}</span>
                </a>
            </div>
        </div>

        {# 5. Mobile & SMS #}
        <div class="op-nav-group {% if active_page in ['sms-center', 'devices', 'sms-data', 'push-logs'] %}op-nav-expanded{% endif %}">
            <button class="op-nav-item-link" type="button">
                <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><rect x="5" y="2" width="14" height="20" rx="2" ry="2"/><line x1="12" y1="18" x2="12.01" y2="18"/></svg>
                <span>Mobile & SMS</span>
                <svg class="op-nav-chevron" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
            </button>
            <div class="op-sub-nav">
                <a href="/admin/sms-center" class="op-sub-nav-link {{ active_page == 'sms-center' ? 'op-active' : '' }}">
                    <span>{{ __('menu.sms_center') }}</span>
                </a>
                <a href="/admin/devices" class="op-sub-nav-link {{ active_page == 'devices' ? 'op-active' : '' }}">
                    <span>{{ __('menu.paired_devices') }}</span>
                </a>
                <a href="/admin/sms-data" class="op-sub-nav-link {{ active_page == 'sms-data' ? 'op-active' : '' }}">
                    <span>SMS Logs</span>
                </a>
                <a href="/admin/devices/notifications" class="op-sub-nav-link {{ active_page == 'push-logs' ? 'op-active' : '' }}">
                    <span>Device Notifications</span>
                </a>
            </div>
        </div>

        {# 6. Reports & Finance #}
        <div class="op-nav-group {% if active_page in ['reports', 'ledger', 'balance-verification'] %}op-nav-expanded{% endif %}">
            <button class="op-nav-item-link" type="button">
                <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><line x1="18" y1="20" x2="18" y2="10"/><line x1="12" y1="20" x2="12" y2="4"/><line x1="6" y1="20" x2="6" y2="14"/></svg>
                <span>Reports & Finance</span>
                <svg class="op-nav-chevron" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
            </button>
            <div class="op-sub-nav">
                <a href="/admin/reports" class="op-sub-nav-link {{ active_page == 'reports' ? 'op-active' : '' }}">
                    <span>{{ __('menu.reports') }}</span>
                </a>
                <a href="/admin/ledger" class="op-sub-nav-link {{ active_page == 'ledger' ? 'op-active' : '' }}">
                    <span>{{ __('menu.ledger') }}</span>
                </a>
                {% if active_brand_id is empty or active_brand_id == 0 %}
                <a href="/admin/balance-verification" class="op-sub-nav-link {{ active_page == 'balance-verification' ? 'op-active' : '' }}">
                    <span>{{ __('menu.balance_verification') }}</span>
                </a>
                {% endif %}
            </div>
        </div>

        {# 7. Developers #}
        <div class="op-nav-group {% if active_page in ['developer', 'webhook_events', 'gateway_webhooks'] %}op-nav-expanded{% endif %}">
            <button class="op-nav-item-link" type="button">
                <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><polyline points="16 18 22 12 16 6"/><polyline points="8 6 2 12 8 18"/></svg>
                <span>Developers</span>
                <svg class="op-nav-chevron" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
            </button>
            <div class="op-sub-nav">
                <a href="/admin/developer" class="op-sub-nav-link {{ active_page == 'developer' ? 'op-active' : '' }}">
                    <span>{{ __('menu.developer_hub') }}</span>
                </a>
                <a href="/admin/gateway-webhooks" class="op-sub-nav-link {{ active_page == 'gateway_webhooks' ? 'op-active' : '' }}">
                    <span>Gateway Callback URLs</span>
                </a>
            </div>
        </div>

        {# 8. Appearance #}
        {% if active_brand_id is empty or active_brand_id == 0 %}
        <div class="op-nav-group {% if active_page in ['themes'] %}op-nav-expanded{% endif %}">
            <button class="op-nav-item-link" type="button">
                <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 14.7255 3.09032 17.1962 4.85857 19C4.85857 19 6.5 17.5 7.5 18.5C8.5 19.5 7.5 21 7.5 21C9.28913 21.6549 10.6012 22 12 22Z"/><circle cx="7.5" cy="10.5" r="1.5"/><circle cx="11.5" cy="7.5" r="1.5"/><circle cx="16.5" cy="9.5" r="1.5"/><circle cx="15.5" cy="14.5" r="1.5"/></svg>
                <span>Appearance</span>
                <svg class="op-nav-chevron" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
            </button>
            <div class="op-sub-nav">
                <a href="/admin/themes" class="op-sub-nav-link {{ active_page == 'themes' ? 'op-active' : '' }}">
                    <span>Themes</span>
                </a>
            </div>
        </div>
        {% endif %}
        {% if active_brand_id is not empty and active_brand_id != 0 %}
        <div class="op-nav-group {% if active_page in ['appearance'] %}op-nav-expanded{% endif %}">
            <button class="op-nav-item-link" type="button">
                <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><path d="M12 22C17.5228 22 22 17.5228 22 12C22 6.47715 17.5228 2 12 2C6.47715 2 2 6.47715 2 12C2 14.7255 3.09032 17.1962 4.85857 19C4.85857 19 6.5 17.5 7.5 18.5C8.5 19.5 7.5 21 7.5 21C9.28913 21.6549 10.6012 22 12 22Z"/><circle cx="7.5" cy="10.5" r="1.5"/><circle cx="11.5" cy="7.5" r="1.5"/><circle cx="16.5" cy="9.5" r="1.5"/><circle cx="15.5" cy="14.5" r="1.5"/></svg>
                <span>Appearance</span>
                <svg class="op-nav-chevron" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
            </button>
            <div class="op-sub-nav">
                <a href="/admin/appearance" class="op-sub-nav-link {{ active_page == 'appearance' ? 'op-active' : '' }}">
                    <span>Appearance</span>
                </a>
            </div>
        </div>
        {% endif %}

        {# 9. System #}
        <div class="op-nav-group {% if active_page in ['settings', 'plugins', 'system-update', 'activities', 'login-attempts', 'audit_integrity'] %}op-nav-expanded{% endif %}">
            <button class="op-nav-item-link" type="button">
                <svg width="18" height="18" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24" stroke-linecap="round" stroke-linejoin="round"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 01-2.83 0l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83 0 2 2 0 010-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z"/></svg>
                <span>System</span>
                <svg class="op-nav-chevron" width="10" height="10" viewBox="0 0 24 24" fill="none" stroke="currentColor" stroke-width="2"><polyline points="9 6 15 12 9 18"/></svg>
            </button>
            <div class="op-sub-nav">
                <a href="/admin/settings" class="op-sub-nav-link {{ active_page == 'settings' ? 'op-active' : '' }}">
                    <span>{% if active_brand_id is empty or active_brand_id == 0 %}System Settings{% else %}Brand Settings{% endif %}</span>
                </a>
                {% if active_brand_id is empty or active_brand_id == 0 %}
                <a href="/admin/plugins" class="op-sub-nav-link {{ active_page == 'plugins' ? 'op-active' : '' }}">
                    <span>Plugins & Addons</span>
                </a>
                <a href="/admin/system-update" class="op-sub-nav-link {{ active_page == 'system-update' ? 'op-active' : '' }}">
                    <span>System Update</span>
                </a>
                {% endif %}
                <a href="/admin/activities" class="op-sub-nav-link {{ active_page == 'activities' ? 'op-active' : '' }}">
                    <span>Audit Log</span>
                </a>
                <a href="/admin/login-attempts" class="op-sub-nav-link {{ active_page == 'login-attempts' ? 'op-active' : '' }}">
                    <span>Login Security Log</span>
                </a>
                {% if active_brand_id is empty or active_brand_id == 0 %}
                <a href="/admin/audit-integrity" class="op-sub-nav-link {{ active_page == 'audit_integrity' ? 'op-active' : '' }}">
                    <span>{{ __('menu.audit_integrity') }}</span>
                </a>
                {% endif %}
            </div>
        </div>

        {# Plugin-registered menu items #}
        {{ hook('admin.menu.register')|raw }}
    </nav>

    {# -- Sidebar Footer - User --------------------------- #}
    <div class="op-sidebar-footer">
        <div class="op-sidebar-actions">
            <a href="/admin/contributors" class="op-sidebar-donate-btn op-sidebar-contributors-btn">
                <svg width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M17 21v-2a4 4 0 00-4-4H5a4 4 0 00-4 4v2"/><circle cx="9" cy="7" r="4"/><path d="M23 21v-2a4 4 0 00-3-3.87M16 3.13a4 4 0 010 7.75"/></svg>
                <span>Contributors</span>
            </a>
            <a href="https://ownpay.org/donate" target="_blank" rel="noopener" class="op-sidebar-donate-btn">
                <svg width="16" height="16" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M20.84 4.61a5.5 5.5 0 00-7.78 0L12 5.67l-1.06-1.06a5.5 5.5 0 00-7.78 7.78l1.06 1.06L12 21.23l7.78-7.78 1.06-1.06a5.5 5.5 0 000-7.78z"/></svg>
                <span>Donate</span>
            </a>
        </div>
        <div class="op-sidebar-user" id="sidebar-user-btn">
            <div class="op-sidebar-user-avatar">
                {{ current_user.name is not empty ? current_user.name|slice(0, 2)|upper : 'AD' }}
                <span class="op-online-dot"></span>
            </div>
            <div class="op-sidebar-user-info">
                <div class="op-sidebar-user-name">{{ current_user.name|default('Admin') }}</div>
                <div class="op-sidebar-user-role">{{ current_user.role|default('Administrator') }}</div>
            </div>
            <button class="op-sidebar-user-ellipsis" id="sidebar-user-menu-btn" type="button" aria-label="User menu">
                <svg width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><circle cx="12" cy="5" r="1"/><circle cx="12" cy="12" r="1"/><circle cx="12" cy="19" r="1"/></svg>
            </button>
        </div>
        <div class="op-sidebar-user-menu" id="sidebar-user-menu">
            <a href="/admin/my-account" class="op-sidebar-user-menu-item">
                <svg width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><circle cx="12" cy="12" r="3"/><path d="M19.4 15a1.65 1.65 0 00.33 1.82l.06.06a2 2 0 010 2.83 2 2 0 01-2.83 0l-.06-.06a1.65 1.65 0 00-1.82-.33 1.65 1.65 0 00-1 1.51V21a2 2 0 01-4 0v-.09A1.65 1.65 0 009 19.4a1.65 1.65 0 00-1.82.33l-.06.06a2 2 0 01-2.83 0 2 2 0 010-2.83l.06-.06A1.65 1.65 0 004.68 15a1.65 1.65 0 00-1.51-1H3a2 2 0 010-4h.09A1.65 1.65 0 004.6 9a1.65 1.65 0 00-.33-1.82l-.06-.06a2 2 0 012.83-2.83l.06.06A1.65 1.65 0 009 4.68a1.65 1.65 0 001-1.51V3a2 2 0 014 0v.09a1.65 1.65 0 001 1.51 1.65 1.65 0 001.82-.33l.06-.06a2 2 0 012.83 2.83l-.06.06A1.65 1.65 0 0019.4 9a1.65 1.65 0 001.51 1H21a2 2 0 010 4h-.09a1.65 1.65 0 00-1.51 1z"/></svg>
                <span>{{ __('menu.my_account') }}</span>
            </a>
            <a href="/admin/my-account/2fa" class="op-sidebar-user-menu-item">
                <svg width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><rect x="3" y="11" width="18" height="11" rx="2"/><path d="M7 11V7a5 5 0 0110 0v4"/></svg>
                <span>{{ __('menu.2fa_setup') }}</span>
            </a>
            <div class="op-sidebar-user-menu-divider"></div>
            <form method="POST" action="/admin/logout" data-no-ajax>
                <input type="hidden" name="_csrf_token" value="{{ csrf_token }}">
                <button type="submit" class="op-sidebar-user-menu-item op-sidebar-user-menu-logout">
                    <svg width="14" height="14" fill="none" stroke="currentColor" stroke-width="2" viewBox="0 0 24 24"><path d="M9 21H5a2 2 0 01-2-2V5a2 2 0 012-2h4"/><polyline points="16 17 21 12 16 7"/><line x1="21" y1="12" x2="9" y2="12"/></svg>
                    <span>{{ __('navbar.logout') }}</span>
                </button>
            </form>
        </div>
    </div>
</aside>
