{{- if .Site.Params.header.logo }}
  {{- $logo := resources.Get .Site.Params.header.logo }}
  {{- $logo_dark := resources.Get .Site.Params.header.logoDark }}
  {{- if $logo }}
    {{- $logoResized1x := $logo.Resize "160x webp" }}
    {{- $logoResized2x := $logo.Resize "320x webp" }}
    {{- $logoDarkResized1x := "" }}
    {{- $logoDarkResized2x := "" }}
    {{- if $logo_dark }}
      {{- $logoDarkResized1x = $logo_dark.Resize "160x webp" }}
      {{- $logoDarkResized2x = $logo_dark.Resize "320x webp" }}
    {{- end }}
    <a href="{{ "" | relLangURL }}" class="mr-2">
      <!-- prettier-ignore-attribute -->
      <img
        src="{{ $logoResized1x.RelPermalink }}"
        srcset="{{ $logoResized1x.RelPermalink }} 1x, {{ $logoResized2x.RelPermalink }} 2x"
        width="{{ $logoResized1x.Width }}"
        height="{{ $logoResized1x.Height }}"
        class="max-h-[10rem] max-w-[10rem] object-scale-down object-left
        {{ if $logo_dark }}hidden dark:flex{{ end }}"
        alt="{{ .Site.Title }}"
      />
      {{- if $logo_dark }}
        <img
          src="{{ $logoDarkResized1x.RelPermalink }}"
          srcset="{{ $logoDarkResized1x.RelPermalink }} 1x, {{ $logoDarkResized2x.RelPermalink }} 2x"
          width="{{ $logoDarkResized1x.Width }}"
          height="{{ $logoDarkResized1x.Height }}"
          class="max-h-[10rem] max-w-[10rem] object-scale-down object-left dark:hidden"
          alt="{{ .Site.Title }}"
        />
      {{- end }}
    </a>
  {{- end }}
{{- end }}
{{- if .Site.Params.header.showTitle | default true }}
  <a
    class="decoration-primary-500 hover:underline hover:decoration-2 hover:underline-offset-2"
    rel="me"
    href="{{ "" | relLangURL }}"
    >{{ .Site.Title | markdownify | emojify }}</a
  >
{{- end }}