<div class="topbar template-columns">
    <div class="template-column topbar-left hide-on-mobile">
        {locale group="quiqqer/template-cologne" var="template.topbar.content.left"}
    </div>

    <div class="topbar-right template-column">
        {* product search *}
        <div class="template-search">
            {$Search->create()}
        </div>

        {* language & currency switch *}
        {if $Template->getAttribute('showTopbarLanguageSwitch')}
            {control control="\QUI\Bricks\Controls\LanguageSwitches\DropDown" showArrow=false}
        {/if}

        {* Show separator only if both controls are enabled *}
        {if $Template->getAttribute('showTopbarLanguageSwitch') && $Template->getAttribute('showTopbarCurrencySwitch')}
            <span class="tobpar--separator"></span>
        {/if}

        {if $Template->getAttribute('showTopbarCurrencySwitch')}
            {control control="QUI\TemplateCologne\Controls\CurrencySwitch"}
        {/if}
        {* END language & currency switch *}

        <div class="cologne-header-control-user">
            {if $User->getId()}
                {$Avatar->create()}
            {else}
                <span class="fa fa-user-o round-icon"
                      title="{locale group='quiqqer/template-cologne' var='template.login'}"></span>
            {/if}
            <span class="cologne-header-control-user-loader">
                <span class="fa fa-pulse fa-circle-o-notch"></span>
            </span>
        </div>
    </div>
</div>