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

{# {% block title %}{{ sayfa.title }}{% endblock %} #}
{# {% block description %}{{ sayfa.description }}{% endblock %} #}
{% block pageStyle %}

    <style>
        #loader-container {
            position: fixed;
            top: 0;
            left: 0;
            width: 100%;
            height: 100%;
            background-color: #40e0d0 !important;
            display: flex;
            flex-direction: row;
            justify-content: center;
            align-items: center;
            z-index: 9999;
            transition: top 1s ease-out;
            column-gap: 1%;
        }

        #loader {
            width: 100px;
            height: 100px;
        }

        #loader-container img:first-child {
            width: 3%;
            height: auto;
        }

        #loader-container img {
            width: 15%;
            height: auto;
        }

        @media (max-width: 992px) {
            #loader-container img:first-child {
                width: 8%;
                height: auto;
            }

            #loader-container img {
                width: 40%;
                height: auto;
            }
        }

        #loader-container.hidden {
            transition: 0.6s ease-in;
            opacity: 0;
            visibility: hidden;
        }

    </style>
    <link rel="stylesheet"  href="https://cdnjs.cloudflare.com/ajax/libs/OwlCarousel2/2.3.4/assets/owl.carousel.min.css"/>
    <link rel="stylesheet"  href="https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.min.css"/>

    <link rel="stylesheet"  href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css"/>
    <link href="https://stackpath.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css" rel="stylesheet">
    <link rel="stylesheet"  href="{{ asset('assets/main/css/form.css') }}"/>

{% endblock %}
{% block content %}
    <div id="loader-container">
        <img loading="lazy" src="{{ asset('assets/main/img/logoSmile.png') }}" alt="Loading...">
        <img loading="lazy" src="{{ asset('assets/main/img/dentmaxLogotxt.svg') }}" alt="Loading...">
    </div>
    <header>
        <div class="header-img">
            {% if entity.banner %}
                <img loading="lazy" src="{{ asset('uploads/yonetim/banner/' ~ entity.banner) }}" alt="Dentmax Basından">
            {% else %}
                <img loading="lazy" src="{{ asset('assets/main/img/dentmax-basindan.webp') }}" alt="Dentmax Basından">
            {% endif %}
        </div>

        <div class="header-content">
            <h1 data-aos="fade-right" data-aos-duration="800" data-aos-delay="200">{{ 'kadromuz'|trans }}</h1>
        </div>
        <div class="header-invisalign">
            <img loading="lazy" src="{{ asset('assets/main/img/icons/dentMax.webp') }}" alt="Dentmax invisailgn"
                 data-aos="fade-in" data-aos-duration="800"
                 data-aos-delay="600">
        </div>
        <div class="header-document-path">
            <strong class="path-title">{{ 'kadromuz'|trans|upper }}</strong>
            <div class="content-router-links-path">
                <a href="{{ path('app_main_default') }}">{{ 'anasayfa'|trans }} /</a>
                <a href="javascript:void(0)">{{ 'kadromuz'|trans }}</a>
            </div>
        </div>
    </header>

    {% block container %}
        <div class="wrapper">
            {% block navbar %}
                {{ render(controller('App\\Controller\\Main\\DefaultController::header', {request: app.request})) }}
            {% endblock %}
            <div class="content">
                <div class="global-content">
                    <div class="content-router content-router-global">
                        {#<div class="content-router-links">
                            <ul>
                                <li><a href="#">Yrd. Doç. Dr. Fatih Kahraman</a></li>
                                <li><a href="#">Dt. Ayşe Nur Kahraman</a></li>
                                <li><a href="#">Dt. Çiğdem Kahraman</a></li>
                                <li><a href="#">Uzm. Dr. Sedanur Eroglu Efe</a></li>
                                <li><a href="#">Dt. Sinem Gümüş</a></li>
                                <li><a href="#">Dt. İlayda Ektik</a></li>
                                <li><a href="#">Gülnur Sivri</a></li>
                                <li><a href="#">Mesure Çelik</a></li>
                            </ul>
                        </div>#}
                        <div class="content-router-contact-wrapper">
                            <div class="content-router-contact" id="content-router-contact">
                                {{ include('main/default/contact-wrapper.html.twig') }}
                            </div>
                        </div>
                    </div>

                    <div class="content-wrapper">
                        <div class="content-wrapper-links-path">
                            <a href="{{ path('app_main_default') }}">{{ 'anasayfa'|trans }} /</a>
                            <a href="javascript:void(0)">{{ 'kadromuz'|trans }}</a>
                        </div>

                        <div class="our-staff-main">
                            <div class="staff-filter-items-wrapper">
                                <div class="staff-filter-items-line">
                                    <div class="staff-filter-items-line-color"></div>
                                </div>
                                <div class="staff-filter-items product-filter-btns">
                                    <div class="staff-filter-item {{ app.request.get('sube') ? '' : 'active' }}">
                                        <a href="{{ path('app_main_kadromuz') }}"
                                           class="staff-filter-item-header btn-filter">
                                            {{ 'tumu'|trans }}
                                        </a>
                                    </div>
                                    {% set mevcutSube = null %}
                                    {% for sube in subeler %}
                                        {% set subeDil = sube.diller|first %}
                                        {% if subeDil.link|default == app.request.get('sube') %}
                                            {% set mevcutSube = sube %}
                                        {% endif %}
                                        <div class="staff-filter-item {{ app.request.get('sube') == subeDil.link|default ? 'active' : '' }}">
                                            <h2 class="staff-filter-item-header">
                                                <a href="{{ path('app_main_kadromuz', {'sube': subeDil.link|default}) }}"
                                                   class="btn-filter"
                                                   data-code="{{ sube.code|default }}">{{ subeDil.baslik|default }}</a>
                                            </h2>
                                        </div>
                                    {% endfor %}
                                </div>
                            </div>
                            <div class="product-filter-items">
                                {% for departman in departmanlar %}
                                    {% set departmanDil = departman.diller|first %}
                                    <div class="departman-wrapper">
                                        <div class="departman">
                                            <div class="section-header section-header-staff">
                                                <div class="section-header-text" data-aos="fade-right"
                                                     data-aos-duration="700">
                                                    <h3 class="section-header-title text-main">{{ departmanDil.baslik|default }}
                                                        <span class="section-header-text-line"></span>
                                                    </h3>
                                                </div>
                                                <div class="section-header-right">
                                                    <div class="section-header-right-border"></div>
                                                </div>
                                            </div>
                                            <div class="members our-staff-main-items mix">
                                                {% for uye in departman.ekipler %}
                                                    {% set uyeDil = uye.diller|first %}
                                                    {% set unvanDil = uye.unvan.diller|first %}

                                                    <div class="yt-box our-staff-main-item"
                                                         data-aos="fade-right"
                                                         data-aos-duration="700"
                                                         data-aos-delay="200">
                                                        <a href="{{ path('app_main_kadro_detay', {'link': uye.link|default}) }}"
                                                           class="our-staff-main-item-link">
                                                            <div class="our-staff-main-item-box">
                                                                <div class="our-staff-main-box-text">
                                                                    <img loading="lazy" src="{{ asset('assets/main/img/logoSmile.png') }}" alt="Dentmax"> DENTMAX
                                                                    <br>
                                                                </div>
                                                                <span class="description">
                                                                    {% set ekipDescription = uyeDil.description|default %}
                                                                    {% set text = ekipDescription |split(' ') %}
                                                                    {% if text|length > 10 %}
                                                                        {% for t in text|slice(0, 10) %} {{ t }}{% endfor %}...
                                                                    {% else %}
                                                                        {{ text|join(' ') }}
                                                                    {% endif %}
                                                                </span>
                                                                <div class="our-staff-main-item-box-profile-img">
                                                                    {% if uye.resim %}
                                                                        <img loading="lazy" src="{{ asset('uploads/ekip/'~uye.resim) }}" alt="">
                                                                    {% endif %}
                                                                </div>
                                                            </div>

                                                            <div class="our-staff-main-item-box-social">

                                                                {% for social in uye.user.profile.sosyalMedyalar|default %}
                                                                    {% if social.tip == 'instagram' %}
                                                                        <a href={{ social.link }} target="_blank">

                                                                            <img loading="lazy" src="{{ asset('assets/main/img/insta.svg') }}"
                                                                                 alt="Dentmax">
                                                                        </a>
                                                                    {% elseif social.tip == 'facebook' %}
                                                                        <a href={{ social.link }} target="_blank">
                                                                            <img loading="lazy" src="{{ asset('assets/main/img/face.svg') }}"
                                                                                 alt="Dentmax" >
                                                                        </a>
                                                                    {% elseif social.tip == 'linkedin' %}
                                                                        <a href={{ social.link }} target="_blank">
                                                                            <img loading="lazy" src="{{ asset('assets/main/img/linkedin.png') }}"
                                                                                 alt="Dentmax">
                                                                        </a>
                                                                    {% endif %}
                                                                {% endfor %}
                                                            </div>
                                                            <div class="our-staff-main-item-text">
                                                                <h4 class="our-staff-name">{{ uyeDil.unvanKisa|default ~' '~ uye.ad ~' '~ uye.soyad }}</h4>
                                                                <h5 class="our-staff-title">{{ unvanDil.baslik|default }}</h5>
                                                            </div>
                                                        </a>
                                                    </div>
                                                {% endfor %}
                                            </div>
                                        </div>
                                    </div>
                                {% endfor %}
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        {{ render(controller('App\\Controller\\Main\\DefaultController::popup', {request: app.request, 'sayfaAlias':'kadromuz'})) }}
    {% endblock %}

{% endblock %}

{% block pageScript %}
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.7.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/aos@2.3.4/dist/aos.min.js"></script>
    {# <script src="{{ asset('assets/main/js/mixitup.js') }}"></script> #}
    <script src="https://cdnjs.cloudflare.com/ajax/libs/mixitup/3.3.1/mixitup.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/vanilla-tilt/1.8.1/vanilla-tilt.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/swiper@9/swiper-bundle.min.js"></script>
    <script src="{{ asset('assets/main/js/validation.js') }}" type="text/javascript"></script>

    <script>
        AOS.init({once: true});
        VanillaTilt.init(document.querySelectorAll(".our-staff-main-item-box-profile-img img"), {
            max: 6,
            speed: 1800,
            axis: 'x',
            perspective: 500,
            glare: true
        });
    </script>
    {{ render(controller('App\\Controller\\Main\\DefaultController::popupScript', {request: app.request, 'sayfaAlias':'kadromuz'})) }}
{% endblock %}