<div class="datetime flex flex-col max-w-2xl lg:flex-row">
    <div class="flex flex-col flex-wrap">
        <div class="font-medium mb-2 text-gray-900 text-sm dark:text-gray-200">
            {{ date_label }}
        </div>

        {% with widget=widget.subwidgets.0 %}
            <div class="flex flex-row">
                {% include widget.template_name %}
            </div>
        {% endwith %}
    </div>

    <div class="flex flex-col flex-wrap lg:ml-auto mt-3 md:mt-0">
        <div class="font-medium mb-2 text-gray-900 text-sm dark:text-gray-200">
            {{ time_label }}
        </div>

        {% with widget=widget.subwidgets.1 %}
            <div class="flex flex-row">
                {% include widget.template_name %}
            </div>
        {% endwith %}
    </div>
</div>
