{%- set html_attributes = attrs()
    .set('lang', locale)
    .set('dir', 'rtl', rtl)
    .mergeWith(html_attributes|default)
-%}

<!DOCTYPE html>
<html{{ html_attributes|default }}>
<head>
{% block head %}
    <meta charset="UTF-8">
    <meta name="generator" content="Contao Open Source CMS">

    {% block viewport %}
        <meta name="viewport" content="width=device-width,initial-scale=1.0,shrink-to-fit=no">
    {% endblock %}

    {# Defer accessing the response context, so that elements coming after it can still affect it. #}
    {% defer %}
        {% block title %}
            {% set title = response_context.head.title|default %}
            {% if title and contao.page.rootPageTitle|default %}
                {% set title = title ~ ' - ' ~ contao.page.rootPageTitle %}
            {% endif %}
             <title>{{ title }}</title>
        {% endblock %}

        {% if response_context.head %}
            <meta name="robots" content="{{ response_context.head.metaRobots }}">
            <meta name="description" content="{{ response_context.head.metaDescription|u.truncate(320, '…') }}">
            {% for meta_tag in response_context.head.metaTags %}
                <meta{{ meta_tag }}>
            {% endfor %}

            {% if page['enableCanonical'] %}
                <link rel="canonical" href="{{ response_context.head.canonicalUriForRequest(app.request)|default }}">
            {% endif %}
            {% for link_tag in response_context.head.linkTags %}
                <link{{ link_tag }}>
            {% endfor %}
        {% endif %}

        {% block end_of_head %}
            {% for element in response_context.end_of_head|default %}
                {{ element|raw }}
            {% endfor %}
        {% endblock %}
    {% enddefer %}
{% endblock %}
</head>

{% defer %}
    {# Defer outputting the body tag so that extensions can still adjust the page's cssClass #}
    {% set body_attributes = attrs()
        .set('id', 'top')
        .addClass(contao.page.cssClass|default)
        .mergeWith(body_attributes|default)
    %}
    <body{{ body_attributes|default }}>
{% enddefer %}
{% block body %}
    {% block body_content %}
        {% slot header %}
            <header>{{ slot() }}</header>
        {% endslot %}

        {% slot main %}
            <main>{{ slot() }}</main>
        {% endslot %}

        {% slot footer %}
            <footer>{{ slot() }}</footer>
        {% endslot %}
    {% endblock %}

    {# Access the response context inside a "defer" block, so that elements coming after it can still affect it. #}
    {% defer %}
        {% block end_of_body %}
            {% for element in response_context.end_of_body|default %}
                {{ element|raw }}
            {% endfor %}

            {{ response_context.json_ld_scripts|default|raw }}
        {% endblock %}
    {% enddefer %}
{% endblock %}
</body>
</html>
