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

<head>
    <!-- Configuración de la página -->
    <meta http-equiv=”Content-Type” content=”text/html; charset=UTF-8″ />
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <meta name="csrf-token" content="{{ csrf_token() }}"> <!-- Token CSRF para seguridad -->
    <title>Harsi Hoteleria | @yield('title')</title>
    <link rel="icon" href="{{ asset('favicon.ico') }}"> <!-- Favicon -->

    <!-- ===========================
        ESTILOS CSS
    ============================ -->

        <!-- Bootstrap 4 -->
        <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/css/bootstrap.min.css"
            integrity="sha384-xOolHFLEh07PJGoPkLv1IbcEPTNtaed2xpHsD9ESMhqIYd0nLMwNLD69Npy4HI+N" crossorigin="anonymous">

        <!-- FontAwesome para iconos -->
        <link rel="stylesheet" href="{{ asset('fontawesome/css/all.css') }}">
        <link href="{{ asset('fontawesome/css/fontawesome.css') }}" rel="stylesheet">
        <link href="{{ asset('fontawesome/css/brands.css') }}" rel="stylesheet">
        <link href="{{ asset('fontawesome/css/solid.css') }}" rel="stylesheet">

        <!-- DataTables -->
        <link rel="stylesheet" type="text/css" href="https://cdn.datatables.net/1.10.18/css/dataTables.bootstrap4.min.css">

        <!-- Toastify -->
        <link rel="stylesheet" type="text/css" href="https://cdn.jsdelivr.net/npm/toastify-js/src/toastify.min.css">

        <!-- Estilos personalizados -->
        <link href="{{ asset('css/pages/shared/master.css') }}" rel="stylesheet">
        <link href="{{ asset('css/components/custom/toastify.css') }}" rel="stylesheet">

        <!-- Barlow Google Fonts -->
        <link rel="preconnect" href="https://fonts.googleapis.com">
        <link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
        <link
            href="https://fonts.googleapis.com/css2?family=Barlow:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap"
            rel="stylesheet">

    <!-- ===========================
        SCRIPTS JAVASCRIPT
    ============================ -->

        <!-- jQuery -->
        <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>

        <!-- Popper -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"
        integrity="sha384-UO2eT0CpHqdSJQ6hJty5KVphtPhzWj9WO1clHTMGa3JDZwrnQq4sF86dIHNDz0W1"
        crossorigin="anonymous"></script>

        <!-- Bootstrap JS -->
        <script src="https://cdn.jsdelivr.net/npm/bootstrap@4.6.2/dist/js/bootstrap.bundle.min.js"
            integrity="sha384-Fy6S3B9q64WdZWQUiU+q4/2Lc9npb8tCaSX9FK7E8HnRr0Jz8D6OP9dO5Vg3Q9ct" crossorigin="anonymous"></script>

        <!-- Moment JS -->
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.30.1/moment.min.js"></script>
        <script src="https://cdnjs.cloudflare.com/ajax/libs/moment-timezone/0.5.45/moment-timezone-with-data.min.js"></script>

        <!-- DataTables JS -->
        <script type="text/javascript" charset="utf8" src="https://cdn.datatables.net/1.10.18/js/jquery.dataTables.min.js"></script>
        <script src="https://cdn.datatables.net/1.10.18/js/dataTables.bootstrap4.min.js"></script>

        <!-- Sweet Alert -->
        <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>

        <!-- Toastify -->
        <script type="text/javascript" src="https://cdn.jsdelivr.net/npm/toastify-js"></script>

        {{-- CryptoJS --}}
        <script src="https://cdn.jsdelivr.net/npm/crypto-js@4.2.0/crypto-js.min.js"></script>

        {{-- Import Hotel Settings Control --}}
        <script type="text/javascript" src="{{ asset('js/environment/hotelSettings.js') }}"></script>

        {{-- Tokens Configurations --}}
        <script src="{{ asset('js/environment/tokensManagement.js') }}"></script>
</head>

<body>

    {{--* Content *--}}
    <main class="container-fluid">
        <div class="row">
            {{-- Sidebar --}}
            @include('shared.components.sidebar.home-sidebar')

            {{-- Content --}}
            <div class="pl-1 pr-0 col-lg-10 col-md-9 col-sm-12 col-xs-12">

                {{-- Navbar --}}
                @include('shared.components.navbar.default-navbar', ['is_dashboard' => true, 'expand_indicators' => true])

                {{-- Content --}}
                <div>
                    @yield('content')
                </div>

            </div>
        </div>
    </main>

    {{--* Footer *--}}
    @yield('footer')

  {{--* Scripts *--}}
    {{-- Inactivity Control --}}
    <script src="{{ asset('js/support/inactivityControl.js') }}"></script>

    {{-- Audits and Shift Control --}}
    @if (\App\Helpers\Environment\SystemModulesHelper::getModuleStatus('audits') && Auth::user()->role === "recepcionista")
        <script src="{{ asset('js/modules/receptionistAuditControl.js') }}"></script>
    @endif

    {{-- Certificate Validity --}}
    @if (App\Helpers\Environment\SystemEnvHelper::isCurrentCountry('MEX') && Auth::user()->role === "administrador")
        <script src="{{ asset('js/modules/certificateValidityControl.js') }}"></script>
    @endif

    {{-- Initialize Poppers --}}
    <script>
        $(function () {
            $('[data-toggle="popover"]').popover({
            container: 'body' // evita que se “corte” por overflow
            });
        });

        $(document).on("click", ".popover", function (e) {
            $('[data-toggle="popover"]').popover('hide');
        });
    </script>

    {{-- Initialize Moment --}}
    <script>
        const LOCALE = "{{ config('app.locale') }}" || 'es';
        const TZ = "{{ config('app.timezone') }}";
        moment.locale(LOCALE);
        moment.tz.setDefault(TZ);
    </script>


    @yield('scripts')
</body>

</html>
