{% if text is defined %}
    <div class="relative">
        <div class="absolute inset-0 flex items-center">
            <span class="w-full border-t {{ colors.rule }}"></span>
        </div>
        <div class="relative flex justify-center text-xs">
            <span class="px-2 {{ colors.body }}">
                {{ text }}
            </span>
        </div>
    </div>
{% else %}
    <hr class="{{ colors.rule }}" />
{% endif %}
