{% extends 'main_base.html.twig' %}
{% block title %}{{ entity.title }}{% endblock %}
{% block description %}{{ entity.description }}{% endblock %}

{% block content %}
    <style>
        {#    <header>#}
        {#        <div class="header-image"><img src="{{ asset('assets/main/images/iletisim.webp') }}" alt=""></div>#}
        {#        <div class="header-text">#}
        {#            <a href="{{ path('app_main_default') }}">#}
        {#                <div class="header-logo"><img src="{{ asset('assets/main/images/elefante.svg') }}" alt=""></div>#}
        {#            </a>#}
        {#            <div class="header-name"><span>{{ entity.title }}</span></div>#}
        {#            <div class="header-text-line">#}
        {#                <span>SINCE</span>#}
        {#                <span>1995</span>#}
        {#            </div>#}
        {#        </div>#}
        {#    </header>#}

        {#    <div class="about-us-cotton-svg-1 contact-us-cotton-svg-1">#}
        {#        <img src="{{ asset('assets/main/images/cotton.svg') }}" alt="">#}
        {#    </div>#}


        {#    <div id="container">#}
        {#        <div class="content">#}

        {#            <div class="router-url">#}
        {#                <a href="{{ path('app_main_default') }}">{{ 'anasayfa'|trans }}</a> /#}
        {#                <a href="{{ path('app_main_iletisim') }}">{{ entity.title }}</a>#}
        {#            </div>#}

        {#            <div class="contact-us">#}
        {#                <h2 class="contact-us-header">{{ 'iletisim.bizeulasin'|trans }}</h2>#}
        {#                <hr class="contact-us-line">#}
        {#                <div class="contact-us-text">{{ 'iletisim.urunveuretimler'|trans }}</div>#}
        {#                <div class="contact-us-content">#}
        {#                    <div class="contact-form">#}
        {#                        <form action="{{ path('app_main_iletisim') }}" method="post">#}
        {#                            <div class="contact-form-line">#}
        {#                                <input type="text" placeholder="{{ 'iletisim.adinizinput'|trans }}" name="ad" required>#}
        {#                                <input type="text" placeholder="{{ 'iletisim.soyadinizinput'|trans }}" name="soyad" required>#}
        {#                            </div>#}
        {#                            <div class="contact-form-line">#}
        {#                                <input type="text" placeholder="{{ 'iletisim.epostainput'|trans }}" name="email" required>#}
        {#                                <input type="text" placeholder="{{ 'iletisim.telefonnoinput'|trans }}" name="telefon" required>#}
        {#                            </div>#}
        {#                            <div class="contact-form-line">#}
        {#                                <textarea name="not" id="" placeholder="{{ 'iletisim.notunuzinput'|trans }}"></textarea>#}
        {#                            </div>#}
        {#                            <div class="kvkk-hakkinda-text">#}
        {#                                {{ 'iletisim.sahsima'|trans }}#}
        {#                                <a href="{{ path('app_main_kvkk') }}">{{ 'iletisim.kisiselverilerin'|trans }}</a>#}
        {#                            </div>#}
        {#                            <div class="contact-us-content-button">#}
        {#                                <button class="global-normal-btn">{{ 'iletisim.gonder'|trans }}</button>#}
        {#                            </div>#}
        {#                        </form>#}
        {#                        {% set urlMailStatus = app.request.get('mailStatus') %}#}
        {#                        {% if urlMailStatus %}#}
        {#                            <div id="mailStatusMessage">#}
        {#                                {% if urlMailStatus == 'success' %}#}
        {#                                    <p class="mail-status-text text-success">{{ 'iletisim.iletisimformuulasdi'|trans }}</p>#}
        {#                                {% else %}#}
        {#                                    <p class="mail-status-text text-error">{{ 'iletisim.iletisimformuulasmadi'|trans }}</p>#}
        {#                                {% endif %}#}
        {#                            </div>#}
        {#                        {% endif %}#}
        {#                    </div>#}
        {#                    <div class="contact-info">#}

        {#                        <!--    -->#}
        {#                        <div class="contact-content-text-image content-text-image">#}
        {#                            <img src="{{ asset('assets/main/images/ourPassionB.png') }}" alt="">#}
        {#                            <div class="content-text-image-text">{{ 'anasayfa.irtibatagecin'|trans }}</div>#}
        {#                        </div>#}
        {#                        <!--    -->#}

        {#                        {% for adres in adresler %}#}
        {#                            <h3 data-aos="fade-left" data-aos-duration="400" data-aos-easing="linear"#}
        {#                                data-aos-delay="200">{{ 'iletisim.fabrikauretimirtibat'|trans }}</h3>#}
        {#                            {% for telefon in adres.telefonlar %}#}
        {#                                <div class="contact-no" data-aos="fade-left" data-aos-duration="400"#}
        {#                                     data-aos-easing="linear" data-aos-delay="300">#}
        {#                                    <a href="tel:0(258)-371-94-74">#}
        {#                                        <i class="fas fa-phone"></i>#}
        {#                                        {{ telefon.telefon }}#}
        {#                                    </a>#}
        {#                                </div>#}
        {#                            {% endfor %}#}
        {#                            <div class="contact-email" data-aos="fade-left" data-aos-duration="400"#}
        {#                                 data-aos-easing="linear" data-aos-delay="400">#}
        {#                                <a href="mailto:elefante@elefante.com.tr">#}
        {#                                    {{ adres.email }}#}
        {#                                </a>#}
        {#                            </div>#}
        {#                            <div class="contact-text" data-aos="fade-left" data-aos-duration="400"#}
        {#                                 data-aos-easing="linear" data-aos-delay="500">#}
        {#                                {{ 'iletisim.herhangibirsoru'|trans }}#}
        {#                            </div>#}
        {#                            <div class="contact-address" data-aos="fade-left" data-aos-duration="400"#}
        {#                                 data-aos-easing="linear" data-aos-delay="600">#}
        {#                                <i class="fas fa-map-marker-alt"></i>#}
        {#                                <div class="contact-address-info">#}
        {#                                    <a href="https://goo.gl/maps/mrhfx6BRhvSQacAg8">#}
        {#                                        <p>{{ adres.adres }}</p>#}
        {#                                    </a>#}
        {#                                </div>#}
        {#                            </div>#}
        {#                            <div class="contact-address-button">#}
        {#                                <button class="global-btn"><a href="{{ adres.harita }}" target="_blank">{{ 'iletisim.yoltarifial'|trans }}</a></button>#}
        {#                            </div>#}
        {#                        {% endfor %}#}
        {#                    </div>#}
        {#                </div>#}
        {#            </div>#}

        {#        </div>#}
        {#    </div>#}

        {#    <!--    -->#}
        {#    <div class="location">#}
        {#        <div id="map"></div>#}
        {#        <div class="map-follow-us-box follow-us-box">#}
        {#            <div class="follow-us-box-content">#}
        {#                <h3 data-aos="fade-right" data-aos-duration="400" data-aos-easing="linear" data-aos-delay="300">{{ 'bizitakipedin'|trans }}</h3>#}
        {#                <p data-aos="fade-right" data-aos-duration="400" data-aos-easing="linear"#}
        {#                   data-aos-delay="500">{{ entity.metin|raw }}</p>#}
        {#                <div class="follow-us-box-buttons" data-aos="fade-right" data-aos-duration="400"#}
        {#                     data-aos-easing="linear" data-aos-delay="700">#}
        {#                    {% for sm in sosyalmedya %}#}
        {#                        <button class="global-btn">#}
        {#                            <a href="{{ sm.link }}" target="_blank">#}
        {#                                <i class="fab fa-{{ sm.tip }}"></i>#}
        {#                                <span>{{ sm.tip|capitalize }}</span>#}
        {#                            </a>#}
        {#                        </button>#}
        {#                    {% endfor %}#}
        {#                </div>#}
        {#            </div>#}
        {#        </div>#}
        {#    </div> #}</style>
    <style> .navbar__section-links__wrapper :not(.CONTACT) {
            opacity: 0.4 !important;
        }

        .navbar__section-logo__wrapper-img {
            filter: brightness(0) invert(1) !important;
        }

        .production__section-sliders-slider-description {
            margin-right: 10rem;
        }

        .navbar__section::before {
            content: "";
            position: absolute;
            top: 0;
            right: 0;
            left: 0;
            bottom: 0;
            background: rgba(0, 0, 0, 0.4);
            z-index: -1;

        }

        .navbar__section::after {
            content: "";
            background-image: url("{{ asset('assets/main/images/navbar/navbar-bg-contact.png') }}");
            background-position: center;
            background-size: cover;

            position: absolute;
            top: 0;
            right: 0;
            left: 0;
            bottom: 0;
            z-index: -2;

        }

        .video__section {
            margin-top: 0 !important;
            padding-bottom: 8% !important;
        }

        .contact__section-description h2 {
            margin-right: 0;
        }

        .contact__section-description p a {
            text-decoration: none;
            font-weight: 600;
            color: #000000;
            margin-left: 5px;
        }
    </style>
    <div>
        {% include 'main/default/loader.html.twig' %}
        {% include 'main/default/cookie.html.twig' %}
        <div class="main-container">
            <div class="contact__section">
                <div class="contact__section-mail__and__contact__section">
                    <div class="contact__section-left">
                        <div class="contact__section-description">
                            <h4>{{ entity.baslik|raw }}</h4>

                            <p>{{ entity.metin|raw }}</p>
                        </div>
                        {% for adres in adresler %}
                            <div class="contact__section-left-head__office">
                                <h4>Head Office</h4>
                                <a href="">{{ adres.adres }}</a>

                            </div>
                            <div class="contact__section-left-phone">
                                <h4>Phone</h4>
                                {% for telefon in adres.telefonlar %}
                                    <a href="tel: {{ telefon.telefon }}">{{ telefon.telefon }}</a><br>
                                {% endfor %}
                            </div>
                            <div class="contact__section-left-e__mail">
                                <h4>E-Mail Adress</h4>
                                <a href="mailto: {{ adres.email }}">{{ adres.email }}</a>
                            </div>     {% endfor %}
                        <div class="contact__section-left-logos">
                            <img src="{{ asset('uploads/ayarlar/referans/' ~ ayarlar.referans) }}">
                        </div>
                    </div>
                    <div class="contact__section-right">
                        <form method="post" {{ path('app_main_iletisim') }} class="overflow-hidden"
                              ID="applicationForm">
                            <h2>Send us your <br>question</h2>
                            <div class="contact__section-right-name__surname">
                                <input type="text" placeholder="{{ 'iletisim.adinizinput'|trans }}" name="ad" required>
                                <input type="text" placeholder="{{ 'iletisim.soyadinizinput'|trans }}" name="soyad"
                                       required>
                            </div>
                            <div class="contact__section-right-mail__phone">
                                <input type="text" placeholder="{{ 'iletisim.epostainput'|trans }}" name="email"
                                       required>
                                <input type="text" placeholder="{{ 'iletisim.telefonnoinput'|trans }}" name="telefon"
                                       required>
                            </div>
                            <div class="contact__section-right-question">
                                <textarea name="not" id="" rows="5"
                                          placeholder="{{ 'iletisim.notunuzinput'|trans }}"></textarea>

                            </div>


                            <div class="g-recaptcha" data-sitekey="6LeisUApAAAAALqx41lBMXWo2Z-mnECvkQWPN7UJ"></div>
                            <div class="contact__section-right-agree">
                                <input type="checkbox" id="agree" name="agree" required>
                                <label for="agree">I agree to the <a href="#">privacy conditions</a></label>

                            </div>
                            <div class="contact__section-right-agree">
                                <button class="sub__button">{{ 'iletisim.gonder'|trans }}</button>


                            </div>
                        </form>
                    </div>


                </div>

            </div>
            <div class="contact__section-map__section">
                <div id="map"></div>
            </div>
        </div>
    </div>


{% endblock %}

{% block body_js %}
    {% include 'main/default/scripts.html.twig' %}
    <script async defer
            src="https://maps.googleapis.com/maps/api/js?key=AIzaSyCaVmIIj8Xl8XSxcYX59jP9A2058NyMWaE&amp;callback=initMap">
    </script>

{% endblock %}