{*
    Icons from Lucide v1.70.0 (https://lucide.dev): sun-moon, sun, moon, moon-star, monitor,
    chevron-down, check.
    ISC License, Copyright (c) 2026 Lucide Icons and Contributors.
    moon, monitor, chevron-down and check are derived from Feather, MIT License, Copyright (c) 2013-present Cole Bemis.
    Full license texts: template/colorModeSwitch/LICENSE-lucide.txt

    Parameters:
    - icon: one of the icon names above
    - mode: color mode the icon stands for (system, light or dark), empty for UI icons
*}
<svg class="tpl-colorModeSwitch__icon{if !$mode} tpl-colorModeSwitch__icon--{$icon}{/if}"
     {if $mode}data-mode="{$mode}"{/if}
     xmlns="http://www.w3.org/2000/svg"
     width="24"
     height="24"
     viewBox="0 0 24 24"
     fill="none"
     stroke="currentColor"
     stroke-width="2"
     stroke-linecap="round"
     stroke-linejoin="round"
     aria-hidden="true"
     focusable="false">
{if $icon === 'sun'}
    <circle cx="12" cy="12" r="4"/>
    <path d="M12 2v2"/>
    <path d="M12 20v2"/>
    <path d="m4.93 4.93 1.41 1.41"/>
    <path d="m17.66 17.66 1.41 1.41"/>
    <path d="M2 12h2"/>
    <path d="M20 12h2"/>
    <path d="m6.34 17.66-1.41 1.41"/>
    <path d="m19.07 4.93-1.41 1.41"/>
{elseif $icon === 'moon'}
    <path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401"/>
{elseif $icon === 'moon-star'}
    <path d="M18 5h4"/>
    <path d="M20 3v4"/>
    <path d="M20.985 12.486a9 9 0 1 1-9.473-9.472c.405-.022.617.46.402.803a6 6 0 0 0 8.268 8.268c.344-.215.825-.004.803.401"/>
{elseif $icon === 'chevron-down'}
    <path d="m6 9 6 6 6-6"/>
{elseif $icon === 'check'}
    <path d="M20 6 9 17l-5-5"/>
{elseif $icon === 'monitor'}
    <rect width="20" height="14" x="2" y="3" rx="2"/>
    <line x1="8" x2="16" y1="21" y2="21"/>
    <line x1="12" x2="12" y1="17" y2="21"/>
{else}
    <path d="M12 2v2"/>
    <path d="M14.837 16.385a6 6 0 1 1-7.223-7.222c.624-.147.97.66.715 1.248a4 4 0 0 0 5.26 5.259c.589-.255 1.396.09 1.248.715"/>
    <path d="M16 12a4 4 0 0 0-4-4"/>
    <path d="m19 5-1.256 1.256"/>
    <path d="M20 12h2"/>
{/if}
</svg>