{% extends 'base.html.twig' %}

{% block stylesheets %}
    <link rel="stylesheet" href="{{ asset('styles/error.css') }}">
{% endblock %}

{% if error is defined %}
    {% set introTitle = "error_intro_title"|trans|title %}
    {% set introDescription = "error_intro_description"|trans %}
{% else %}
    {% set introTitle = "page_not_found_title"|trans|title %}
    {% set introDescription = "page_not_found_description"|trans %}
{% endif %}

{% set pageTitle = introTitle %}

{% block content %}
    {% include "components/_intro.html.twig" with {options: {
        title: introTitle,
        description: introDescription,
        skip: false,
        breadcrumb: true,
        img: false,
        linkSection: '
            <div class="intro-link-section">
                <a href="'~path('contact')~'" class="standart-button border-button big-button arrow-anim arrow-dark">' ~ 'contact_us'|trans|capitalize ~ '</a>
                <a href="'~path('homepage')~'" class="black-button standart-button big-button arrow-anim">' ~ 'back_to_homepage'|trans|capitalize ~ '</a>
            </div>'
    }} %}
    <div class="section-wrapper">
        <div class="content-section error-router">
            <div class="content-title-wrapper">
                <h2 class="content-title">{{"did_you_look_for_these"|trans|title}}</h2>
            </div>
            <div class="error-router-content">
                {% set routerItems = [
                    {
                        href: path('partners'),
                        img: asset('img/partners/intro.webp'),
                        name: "partners"|trans|title,
                        description: "partners_intro_description"|trans|capitalize
                    },
                    {
                        href: path('staff'),
                        img: asset('img/staff/intro.webp'),
                        name: "staff"|trans|title,
                        description: "staff_intro_description"|trans|capitalize
                    },
                    {
                        href: path('services'),
                        img: asset('img/services/intro-mvp.png'),
                        name: "services"|trans|title,
                        description: "services_intro_description"|trans|capitalize
                    }
                ] %}
                {% for routerItem in routerItems %}
                    <div class="router-item">
                        <div class="router-item-img">
                            <img src="{{routerItem.img}}"/>
                        </div>
                        <div class="router-item-content">
                            {% include 'components/_text-container.html.twig' with {content: {
                                title: routerItem.name,
                                description: routerItem.description,
                                link: routerItem.href
                            }} %}
                        </div>
                    </div>
                {% endfor %}
            </div>
        </div>
    </div>
{% endblock %}