{{define "admin-theme-toggle"}}
<details class="dropdown dropdown-end">
    <summary data-theme-toggle class="btn btn-ghost btn-circle list-none" aria-label="Theme settings">
        <svg class="icon size-5" data-theme-icon aria-hidden="true"><use href="/admin/public/icons.svg#sun"></use></svg>
    </summary>
    <ul data-theme-menu role="menu" class="dropdown-content menu bg-base-100 text-base-content rounded-box z-50 w-40 p-2 shadow-lg">
        <li>
            <button type="button" role="menuitem" class="theme-option" data-value="system">
                {{ icon "sun-moon" "size-4" }}
                <span>System</span>
                {{ icon "check" "size-4 ml-auto text-secondary theme-check invisible" }}
            </button>
        </li>
        <li>
            <button type="button" role="menuitem" class="theme-option" data-value="light">
                {{ icon "sun" "size-4" }}
                <span>Light</span>
                {{ icon "check" "size-4 ml-auto text-secondary theme-check invisible" }}
            </button>
        </li>
        <li>
            <button type="button" role="menuitem" class="theme-option" data-value="dark">
                {{ icon "moon" "size-4" }}
                <span>Dark</span>
                {{ icon "check" "size-4 ml-auto text-secondary theme-check invisible" }}
            </button>
        </li>
    </ul>
</details>
{{end}}