<!DOCTYPE html>
<html lang="fr">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no">
    <title>{% block title %}Alphavigie{% endblock %} | Planning Sécurité</title>
    
    <!-- plugins:css -->
    <link rel="stylesheet" href="{{ asset('staradmin/vendors/feather/feather.css') }}">
    <link rel="stylesheet" href="{{ asset('staradmin/vendors/mdi/css/materialdesignicons.min.css') }}">
    <link rel="stylesheet" href="{{ asset('staradmin/vendors/ti-icons/css/themify-icons.css') }}">
    <link rel="stylesheet" href="{{ asset('staradmin/vendors/font-awesome/css/font-awesome.min.css') }}">
    <link rel="stylesheet" href="{{ asset('staradmin/vendors/typicons/typicons.css') }}">
    <link rel="stylesheet" href="{{ asset('staradmin/vendors/simple-line-icons/css/simple-line-icons.css') }}">
    <link rel="stylesheet" href="{{ asset('staradmin/vendors/css/vendor.bundle.base.css') }}">
    <!-- endinject -->
    <!-- inject:css -->
    <link rel="stylesheet" href="{{ asset('staradmin/css/style.css') }}">
    <!-- endinject -->
    <link rel="shortcut icon" href="{{ asset('staradmin/images/favicon.png') }}" />
    
    <!-- Bootstrap Icons pour compatibilité -->
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap-icons@1.11.1/font/bootstrap-icons.css">
    
    {% block stylesheets %}{% endblock %}
    
    <style>
        .planning-table th, .planning-table td {
            text-align: center;
            vertical-align: middle;
            font-size: 0.75rem;
            padding: 0.25rem;
        }
        .planning-table .day-header {
            min-width: 30px;
        }
        .shift-night {
            background-color: #e3f2fd;
        }
        .shift-day {
            background-color: #fff9c4;
        }
        .day-sunday {
            background-color: #ffebee;
        }
        .day-holiday {
            background-color: #ffcdd2;
            color: #b71c1c;
            font-weight: 600;
        }
        .status-vacation {
            background-color: #c8e6c9;
        }
        .status-leave {
            background-color: #bbdefb;
        }
        .status-absence {
            background-color: #ffcdd2;
        }
    </style>
</head>
<body class="with-welcome-text">
    {% if app.user %}
    <div class="container-scroller">
        <!-- partial:partials/_navbar.html -->
        <nav class="navbar default-layout col-lg-12 col-12 p-0 fixed-top d-flex align-items-top flex-row">
            <div class="text-center navbar-brand-wrapper d-flex align-items-center justify-content-start">
                <div class="me-3">
                    <button class="navbar-toggler navbar-toggler align-self-center" type="button" data-bs-toggle="minimize">
                        <span class="icon-menu"></span>
                    </button>
                </div>
                <div>
                    <a class="navbar-brand brand-logo" href="{{ path('app_dashboard') }}">
                        <img src="{{ asset('alphavigie-logo.png') }}" alt="Alphavigie" style="height: 52px !important; width: auto !important; object-fit: contain;">
                    </a>
                    <a class="navbar-brand brand-logo-mini" href="{{ path('app_dashboard') }}">
                        <img src="{{ asset('alphavigie-logo.png') }}" alt="Alphavigie" style="height: 40px !important; width: auto !important; object-fit: contain;">
                    </a>
                </div>
            </div>
            <div class="navbar-menu-wrapper d-flex align-items-top">
                <ul class="navbar-nav">
                    <li class="nav-item fw-semibold d-none d-lg-block ms-0">
                        <h1 class="welcome-text">Bonjour, <span class="text-black fw-bold">{{ app.user.firstName }} {{ app.user.lastName }}</span></h1>
                        <h3 class="welcome-sub-text">{% block welcome_subtitle %}Gestion de planning sécurité{% endblock %}</h3>
                    </li>
                </ul>
                <ul class="navbar-nav ms-auto">
                    <li class="nav-item dropdown d-none d-lg-block user-dropdown">
                        <a class="nav-link" id="UserDropdown" href="#" data-bs-toggle="dropdown" aria-expanded="false">
                            <i class="mdi mdi-account-circle fs-3"></i>
                        </a>
                        <div class="dropdown-menu dropdown-menu-right navbar-dropdown" aria-labelledby="UserDropdown">
                            <div class="dropdown-header text-center">
                                <p class="mb-1 mt-3 fw-semibold">{{ app.user.firstName }} {{ app.user.lastName }}</p>
                                <p class="fw-light text-muted mb-0">{{ app.user.email }}</p>
                            </div>
                            <a class="dropdown-item" href="{{ path('app_logout', {_csrf_token: csrf_token('logout')}) }}">
                                <i class="dropdown-item-icon mdi mdi-power text-primary me-2"></i> Déconnexion
                            </a>
                        </div>
                    </li>
                </ul>
                <button class="navbar-toggler navbar-toggler-right d-lg-none align-self-center" type="button" data-bs-toggle="offcanvas">
                    <span class="mdi mdi-menu"></span>
                </button>
            </div>
        </nav>
        <!-- partial -->
        <div class="container-fluid page-body-wrapper">
            <!-- partial:partials/_sidebar.html -->
            <nav class="sidebar sidebar-offcanvas" id="sidebar">
                <ul class="nav">
                    {% if is_granted('ROLE_ADMIN') %}
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_dashboard') }}">
                            <i class="mdi mdi-view-dashboard menu-icon"></i>
                            <span class="menu-title">Dashboard</span>
                        </a>
                    </li>
                    {% endif %}

                    <li class="nav-item nav-category">Planning</li>
                    {% if is_granted('ROLE_ADMIN') %}
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_planning_agent_index') }}">
                            <i class="menu-icon mdi mdi-calendar-account"></i>
                            <span class="menu-title">Planning Salarié</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_planning_client_index') }}">
                            <i class="menu-icon mdi mdi-calendar-multiple"></i>
                            <span class="menu-title">Planning Client</span>
                        </a>
                    </li>
                    {% else %}
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_planning_agent_show', {id: app.user.id, year: 'now'|date('Y'), month: 'now'|date('n')}) }}">
                            <i class="menu-icon mdi mdi-calendar-account"></i>
                            <span class="menu-title">Mon Planning</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_agent_agenda') }}">
                            <i class="menu-icon mdi mdi-calendar-remove"></i>
                            <span class="menu-title">Mon Agenda</span>
                        </a>
                    </li>
                    {% endif %}

                    {% if is_granted('ROLE_ADMIN') %}
                    <li class="nav-item nav-category">Gestion</li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_agent_index') }}">
                            <i class="menu-icon mdi mdi-account-group"></i>
                            <span class="menu-title">Agents</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_client_index') }}">
                            <i class="menu-icon mdi mdi-domain"></i>
                            <span class="menu-title">Clients</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_subcontracting_company_index') }}">
                            <i class="menu-icon mdi mdi-domain-plus"></i>
                            <span class="menu-title">Sous-traitance</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_contact_list') }}">
                            <i class="menu-icon mdi mdi-card-account-phone"></i>
                            <span class="menu-title">Contacts</span>
                        </a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_site_index') }}">
                            <i class="menu-icon mdi mdi-map-marker-multiple"></i>
                            <span class="menu-title">Sites</span>
                        </a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_admin_agenda') }}">
                            <i class="menu-icon mdi mdi-calendar-remove"></i>
                            <span class="menu-title">Agenda agents</span>
                        </a>
                    </li>

                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_admin_unavailability_requests') }}">
                            <i class="menu-icon mdi mdi-alert-octagon"></i>
                            <span class="menu-title">Indisponibilités</span>
                        </a>
                    </li>

                    <li class="nav-item nav-category">Communication</li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_email_send') }}">
                            <i class="menu-icon mdi mdi-email-send"></i>
                            <span class="menu-title">Envoi plannings</span>
                        </a>
                    </li>

                    <li class="nav-item nav-category">Système</li>
                    <li class="nav-item">
                        <a class="nav-link" href="{{ path('app_admin_backups') }}">
                            <i class="menu-icon mdi mdi-database"></i>
                            <span class="menu-title">Sauvegardes</span>
                        </a>
                    </li>
                    {% endif %}

                </ul>
            </nav>
            <!-- partial -->
            <div class="main-panel">
                <div class="content-wrapper">
                    {% for label, messages in app.flashes %}
                        {% for message in messages %}
                        <div class="alert alert-{{ label == 'error' ? 'danger' : label }} alert-dismissible fade show" role="alert">
                            {{ message }}
                            <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button>
                        </div>
                        {% endfor %}
                    {% endfor %}
                    
                    {% block body %}{% endblock %}
                </div>
                <!-- content-wrapper ends -->
                <!-- partial:partials/_footer.html -->
                <footer class="footer">
                    <div class="d-sm-flex justify-content-center justify-content-sm-between">
                        <span class="text-muted text-center text-sm-left d-block d-sm-inline-block">
                            Copyright © {{ 'now'|date('Y') }} <a href="#">Alphavigie</a>. Tous droits réservés.
                        </span>
                        <span class="float-none float-sm-end d-block mt-1 mt-sm-0 text-center">
                            <i class="mdi mdi-heart text-danger"></i>
                        </span>
                    </div>
                </footer>
                <!-- partial -->
            </div>
            <!-- main-panel ends -->
        </div>
        <!-- page-body-wrapper ends -->
    </div>
    {% else %}
    <div class="container-scroller">
        <div class="container-fluid page-body-wrapper full-page-wrapper">
            <div class="content-wrapper d-flex align-items-center auth px-0">
                <div class="row w-100 mx-0">
                    <div class="col-lg-4 mx-auto">
                        {% block login %}{% endblock %}
                    </div>
                </div>
            </div>
        </div>
    </div>
    {% endif %}
    
    <!-- plugins:js -->
    <script src="{{ asset('staradmin/vendors/js/vendor.bundle.base.js') }}"></script>
    <script src="{{ asset('staradmin/vendors/bootstrap-datepicker/bootstrap-datepicker.min.js') }}"></script>
    <!-- endinject -->
    <!-- inject:js -->
    <script src="{{ asset('staradmin/js/off-canvas.js') }}"></script>
    <script src="{{ asset('staradmin/js/template.js') }}"></script>
    <script src="{{ asset('staradmin/js/settings.js') }}"></script>
    <script src="{{ asset('staradmin/js/hoverable-collapse.js') }}"></script>
    <script src="{{ asset('staradmin/js/todolist.js') }}"></script>
    <!-- endinject -->
    
    {% block javascripts %}{% endblock %}
            {% block importmap %}{{ importmap('app') }}{% endblock %}
</body>
</html>
