<!DOCTYPE html>
<html dir="ltr" lang="{{ str_replace('_', '-', app()->getLocale()) }}">

<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <!-- Tell the browser to be responsive to screen width -->
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="keywords"
        content="wrappixel, admin dashboard, html css dashboard, web dashboard, bootstrap 5 admin, bootstrap 5, css3 dashboard, bootstrap 5 dashboard, ample admin admin bootstrap 5 dashboard, frontend, responsive bootstrap 5 admin template, material design, material dashboard bootstrap 5 dashboard template">
    <meta name="description" content="Admin Pro is powerful and clean admin dashboard template">
    <meta name="robots" content="noindex,nofollow">

    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>@yield('title')</title>

    <link rel="canonical" href="https://www.wrappixel.com/templates/ampleadmin/" />
    <!-- Favicon icon -->
    <link rel="icon" type="image/png" sizes="16x16" href="{{ asset('assets/images/favicon.png') }}">
    <!-- toastr CSS -->
    <link href="{{ asset('assets/extra-libs/toastr/dist/build/toastr.min.css') }}" rel="stylesheet">
    <link rel="stylesheet" type="text/css" href="{{ asset('assets/libs/select2/dist/css/select2.min.css') }}">

    <!-- Template's Custom CSS -->
    <link href="{{ asset('dist/css/style.min.css') }}" rel="stylesheet">

    <!-- HTML5 Shim and Respond.js IE8 support of HTML5 elements and media queries -->
    <!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
    <!--[if lt IE 9]>
    <script src="https://oss.maxcdn.com/libs/html5shiv/3.7.0/html5shiv.js"></script>
    <script src="https://oss.maxcdn.com/libs/respond.js/1.4.2/respond.min.js"></script>
 <![endif]-->

    <!-- your Custom CSS -->
    <link href="{{ asset('dist/css/style.min.css') }}" rel="stylesheet">

    <link href="{{ asset('css/stylepage.css') }}" rel="stylesheet">


    <!-- page's css -->
    <style>
        .page-item.active .page-link {
            z-index: 3;
            color: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_TEXT1'] }} !important;
            background-color: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_ETAB1'] }} !important;
            border-color: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_ETAB1'] }} !important;
        }

        #main-wrapper .topbar .top-navbar .navbar-header {
            border-right: 1px solid rgb(120 130 140 / 0%) !important;
            background: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_ETAB3'] }} !important;
            text-align: center;
        }

        #main-wrapper .topbar .top-navbar .navbar-header .logo-icon img {
            height: 2.2rem;
        }

        #main-wrapper[data-layout=vertical] .left-sidebar[data-sidebarbg=skin5] ul .sidebar-item .first-level .sidebar-item.active>.sidebar-link {
            opacity: 1;
            color: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_TEXT1'] }} !important;
            font-weight: 700;
        }

        .sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link:hover i {
            color: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_TEXT1'] }} !important;
        }

        .sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link:hover span {
            color: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_TEXT1'] }} !important;
        }

        .sidebar-nav ul .sidebar-item .first-level .sidebar-item .sidebar-link:hover .hide-menu {
            color: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_TEXT1'] }} !important;
        }

        .sidebar-nav ul .sidebar-item.selected>.sidebar-link {
            background-color: {{ Session::get('RESULTAT_DATA')['firstLight'] }} !important;
        }

        .sidebar-nav .has-arrow:not(.active)::after {
            color: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_TEXT1'] }} !important
        }

        .sidebar-nav ul .sidebar-item .sidebar-link:not(.active),
        .sidebar-nav ul .sidebar-item .sidebar-link:not(.active) i {
            color: {{ Session::get('RESULTAT_DATA')['RESULTAT_COULEUR_TEXT1'] }} !important;
        }

        .customizer .service-panel-toggle {
            background-color: {{ session('etablissementCouleur2') }};
        }


        .bg-title h4 {
            text-transform: uppercase;
            font-size: 14px;
            font-weight: 700 !important;
            margin-top: 6px;
        }

        .dropify-message p {
            text-align: center;
        }

        .setting {
            line-height: 29px;
            font-size: 15px
        }

        .well,
        pre {
            background: #fff;
            border-radius: 0;
        }

        .well {
            min-height: 20px;
            padding: 19px;
            margin-bottom: 20px;
            background-color: #f5f5f5;
            border: 1px solid #e3e3e3;
            border-radius: 4px;
            -webkit-box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
            box-shadow: inset 0 1px 1px rgb(0 0 0 / 5%);
        }

        .wizard-content .wizard>.steps>ul>li.current .step {
            border-color: #fff;
            background-color: #2cabe3;
            color: #fff;
        }

        .wizard-content .wizard>.steps>ul>li.done .step {
            background-color: #53e69d;
            border-color: #fff;
            color: #fff;
        }

        .has-error .select2-selection {
            border-color: rgb(185, 74, 72) !important;
        }
    </style>

    @yield('css')

</head>

<body>
    <!-- -------------------------------------------------------------- -->
    <!-- Preloader - style you can find in spinners.css -->
    <!-- -------------------------------------------------------------- -->
    <div class="preloader">
        <svg class="circular" viewBox="25 25 50 50">
            <circle class="path" cx="50" cy="50" r="20" fill="none" stroke-width="2"
                stroke-miterlimit="10" />
        </svg>
    </div>

    <!-- -------------------------------------------------------------- -->
    <!-- Main wrapper - style you can find in pages.scss -->
    <!-- -------------------------------------------------------------- -->
    <div id="main-wrapper">
        <!-- topbar -->
        @include('partials.topbar')

        <!-- Menu -->
        @include('partials.menu')

        <!-- -------------------------------------------------------------- -->
        <!-- Page wrapper  -->
        <!-- -------------------------------------------------------------- -->
        <div class="page-wrapper">
            <!-- Bread crumb -->
            @include('partials.breadcrumb')

            <!-- -------------------------------------------------------------- -->
            <!-- Container fluid  -->
            <!-- -------------------------------------------------------------- -->
            <div class="container-fluid page-content">

                <!-- Page Content -->
                @yield('content')
                <!-- End Page Content -->

            </div>
            <!-- -------------------------------------------------------------- -->
            <!-- End Container fluid  -->
            <!-- -------------------------------------------------------------- -->

            <!-- footer -->
            @include('partials.footer')

        </div>
        <!-- -------------------------------------------------------------- -->
        <!-- End Page wrapper  -->
        <!-- -------------------------------------------------------------- -->
    </div>
    <!-- -------------------------------------------------------------- -->
    <!-- End Wrapper -->
    <!-- -------------------------------------------------------------- -->

    <!-- right sidebar -->
    @include('partials.aside')

    <!-- -------------------------------------------------------------- -->
    <!-- All Jquery -->
    <!-- -------------------------------------------------------------- -->
    <script src="{{ asset('assets/libs/jquery/dist/jquery.min.js') }}"></script>
    <script src="{{ asset('assets/extra-libs/taskboard/js/jquery-ui.min.js') }}"></script>
    <!-- Bootstrap tether Core JavaScript -->
    <script src="{{ asset('assets/libs/popper.js/popper.min.js') }}"></script>
    <script src="{{ asset('assets/libs/bootstrap/dist/js/bootstrap.bundle.min.js') }}"></script>
    <!-- apps -->
    <script src="{{ asset('dist/js/app.min.js') }}"></script>
    <script src="{{ asset('dist/js/app.init.horizontal.js') }}"></script>
    <script src="{{ asset('dist/js/app-style-switcher.horizontal.js') }}"></script>
    <!-- slimscrollbar scrollbar JavaScript -->
    <script src="{{ asset('assets/libs/perfect-scrollbar/dist/perfect-scrollbar.jquery.min.js') }}"></script>
    <script src="{{ asset('assets/extra-libs/sparkline/sparkline.js') }}"></script>
    <!--Wave Effects -->
    <script src="{{ asset('dist/js/waves.js') }}"></script>
    <!--Menu sidebar -->
    <script src="{{ asset('dist/js/sidebarmenu.js') }}"></script>
    <!--Custom JavaScript -->
    <script src="{{ asset('dist/js/feather.min.js') }}"></script>

    <!-- This Page JS -->

    <script src="{{ asset('dist/js/custom.min.js') }}"></script>

    <!-- -----------------------------------------------------------------------
  Assuming you'll need toastr and/or sweatalert almost in all your pages
  we include them directly here !
 ------------------------------------------------------------------------ -->
    <!-- toastr -->
    <script src="{{ asset('assets/extra-libs/toastr/dist/build/toastr.min.js') }}"></script>

    <script src="{{ asset('assets/libs/block-ui/jquery.blockUI.js') }}"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11.4.29/dist/sweetalert2.all.min.js"></script>

    <!-- project's scripts -->
    <script src="{{ asset('project/js/helpers.js') }}"></script>

    <!-- page's scripts  -->
    @yield('script')

</body>

</html>
