{% load i18n insight_tags %}

<div class="flex gap-2 items-center min-w-0 sm:gap-3 {% if brand_mark_config.logo_position == 'end' %}justify-between{% endif %} {{ brand_mark_config.css_class }}">
    {% if brand_mark_config.logo_position != 'end' %}
        {% logo config=brand_mark_config.logo %}
    {% endif %}
    <div class="text-sm tracking-tight whitespace-nowrap sm:text-xl">
        <span class="font-medium {{ brand_mark_config.primary_text_color }}">{{ brand_mark_config.primary_text }}</span>
        <span class="font-bold {{ brand_mark_config.secondary_text_color }}">{{ brand_mark_config.secondary_text }}</span>
    </div>
    {% if brand_mark_config.logo_position == 'end' %}
        {% logo config=brand_mark_config.logo %}
    {% endif %}
</div>