<!doctype html>
<html lang="{{ app.request.locale }}">
<head>
    {% set head_title %}
        {% block title %}
            {{ 'checkout.title'|trans }}
        {% endblock %}
    {% endset %}
    {% set head_meta %}
        {% block meta %}{% endblock %}
    {% endset %}
    {% set head_stylesheets %}
        {% block stylesheets %}{% endblock %}
    {% endset %}
    {% set head_javascripts %}
        {% block javascripts %}{% endblock %}
    {% endset %}
    {{ include('partials/head.html.twig', {
        head_title: head_title,
        head_meta: head_meta,
        head_stylesheets: head_stylesheets,
        head_javascripts: head_javascripts
    }) }}
    <link rel="apple-touch-icon" sizes="180x180" href="{{ asset(viti_theme_asset('images/favicon/apple-touch-icon.png')) }}">
    <link rel="icon" type="image/png" sizes="32x32" href="{{ asset(viti_theme_asset('images/favicon/favicon-32x32.png')) }}">
    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset(viti_theme_asset('images/favicon/favicon-16x16.png')) }}">
    <link rel="manifest" href="{{ asset(viti_theme_asset('images/favicon/site.webmanifest')) }}">
    <link rel="mask-icon" href="{{ asset(viti_theme_asset('images/favicon/safari-pinned-tab.svg')) }}" color="#8c827a">
    <meta name="msapplication-TileColor" content="#8c827a">
    <meta name="theme-color" content="#141414">
    <link rel="icon" type="image/x-icon" href="{{ asset(viti_theme_asset('images/favicon/favicon.ico')) }}">
    <link rel="preconnect" href="https://fonts.googleapis.com">
    <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
    <link rel="stylesheet" href="https://fonts.googleapis.com/css2?family=Josefin+Sans:wght@100;300;400&family=Roboto:ital,wght@0,100;0,400;0,500;0,700;1,400&display=swap">
    <link rel="stylesheet" href="https://use.typekit.net/wup2esi.css">
</head>
{% set canonical_route = app.request.attributes.get('_canonical_route')|default(app.request.get('_route')|default('')) %}
<body class="theme-checkout-shell {{ canonical_route }} {{ app.request.get('_route')|default('')|replace({'.': '-'}) }}">
{{ component('tracking:Scripts', { position: 'body' }) }}
<div class="theme-checkout-shell__page">
    {% block checkout_header %}
        <header class="theme-checkout-header">
            <div class="theme-checkout-header__inner">
                <a href="{{ path('homepage') }}" class="theme-checkout-header__brand" aria-label="{{ 'company'|trans }}">
                    {% block checkout_brand %}
                        <twig:theme:BrandMark variant="logo" alt="{{ 'content.logo'|trans({}, 'img') }}" />
                    {% endblock %}
                </a>
                <nav class="theme-checkout-header__nav" aria-label="{{ 'balise.menu'|trans({}, 'meta') }}">
                    <a href="{{ path('shop') }}" class="theme-checkout-header__link">{{ 'checkout_design.back_shop'|trans }}</a>
                </nav>
            </div>
        </header>
    {% endblock %}

    <main id="main" class="theme-checkout-main">
        {% block main %}{% endblock %}
    </main>

    {% block checkout_footer %}
        <footer class="theme-checkout-footer">
            <div class="theme-checkout-footer__inner">
                <div class="theme-checkout-footer__brand">
                    <span>{{ 'company'|trans }}</span>
                    <nav class="theme-checkout-footer__links" aria-label="{{ 'checkout_footer.links_label'|trans }}">
                        <a href="{{ path('legals') }}">{{ 'checkout_footer.legal_mentions'|trans }}</a>
                        <a href="{{ path('private-policy') }}">{{ 'checkout_footer.privacy_policy'|trans }}</a>
                        <a href="{{ path('cgv') }}">{{ 'checkout_footer.cgv'|trans }}</a>
                        <a href="{{ path('shop_withdrawal') }}">{{ 'withdrawal.access_link'|trans }}</a>
                    </nav>
                </div>
                <span>{{ 'alcool_announcement'|trans }}</span>
            </div>
        </footer>
    {% endblock %}
</div>
{{ include('partials/notifier.html.twig') }}
</body>
</html>
