<!doctype html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="description" content="National Gender Based Violence Database">
    <meta name="keywords" content="National Gender Based Violence Database">
    <meta name="author" content="Ministry of Gender Labour and Social Development">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <title>@yield('title', config('app.name', 'National Gender Based Violence Database'))</title>
    <link rel="icon" href="{{ asset('/assets/img/Coat_of_arms_of_Uganda.png') }}" type="image/x-icon">

    <link rel="stylesheet" href="{{ asset('/assets/css/bootstrap/css/bootstrap.min.css') }}">
    <link rel="stylesheet" href="{{ asset('/assets/icon/themify-icons/themify-icons.css') }}">
    <link rel="stylesheet" href="{{ asset('/assets/icon/icofont/css/icofont.css') }}">
    <link rel="stylesheet" href="{{ asset('/assets/css/style.css') }}">
    <link rel="stylesheet" href="{{ asset('/assets/css/jquery.mCustomScrollbar.css') }}">
    <link rel="stylesheet" href="{{ asset('/DataTables/datatables.min.css') }}">
    <link rel="stylesheet" href="https://cdn.datatables.net/buttons/2.4.1/css/buttons.dataTables.min.css">
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.6/css/selectize.bootstrap3.min.css" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/flatpickr/dist/flatpickr.min.css">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/sweetalert2@11/dist/sweetalert2.min.css">
    <link rel="stylesheet" href="{{ asset('/assets/css/ngbvd-ui.css') }}">
    @auth
        @php
            $ngbvdTheme = [];
            try {
                $allThemesPath = storage_path('app/ngbvd_user_themes.json');
                if (file_exists($allThemesPath)) {
                    $allThemes = json_decode(file_get_contents($allThemesPath), true) ?: [];
                    $ngbvdTheme = $allThemes[Auth::id()] ?? [];
                }
            } catch (\Throwable $e) { $ngbvdTheme = []; }
        @endphp
        <style id="ngbvd-user-theme">
            :root {
                --ngbvd-yellow: {{ $ngbvdTheme['primary'] ?? '#FDB209' }};
                --ngbvd-sidebar: {{ $ngbvdTheme['sidebar'] ?? '#101827' }};
                --ngbvd-bg: {{ $ngbvdTheme['background'] ?? '#f4f6fb' }};
                --ngbvd-surface: {{ $ngbvdTheme['surface'] ?? '#ffffff' }};
                --ngbvd-topbar: {{ $ngbvdTheme['topbar'] ?? '#ffffff' }};
            }
        </style>
    @endauth
    @stack('styles')
    @if(env('NGBVD_HIDE_DEBUGBAR', false))
        <style>body { } #phpdebugbar, .phpdebugbar { display:none !important; }</style>
    @endif
</head>
<body class="ngbvd-body {{ env('NGBVD_HIDE_DEBUGBAR', false) ? 'ngbvd-hide-debugbar' : '' }}" data-ngbvd-user-id="{{ auth()->id() ?? 'guest' }}">
    <div class="theme-loader" aria-hidden="true"></div>

    @guest
        <main class="ngbvd-auth-shell">
            <div class="ngbvd-auth-card">
                <section class="ngbvd-auth-brand">
                    <img src="{{ asset('/assets/images/mglsd.png') }}" alt="Ministry logo">
                    <h1>National Gender Based Violence Database</h1>
                    <p>Government-owned platform for GBV incident reporting, survivor support tracking, referrals and national decision support.</p>
                    <p><strong>Authorized access only.</strong></p>
                </section>
                <section class="ngbvd-auth-form">
                    @include('components.alerts')
                    @yield('content')
                </section>
            </div>
        </main>
    @else
        <div class="ngbvd-app-shell">
            <div class="ngbvd-sidebar-backdrop" data-ngbvd-sidebar-backdrop></div>
            @include('layouts.navigation')
            <div class="ngbvd-main">
                <header class="ngbvd-topbar">
                    <div class="ngbvd-topbar-left">
                        <button class="ngbvd-mobile-toggle" type="button" data-ngbvd-mobile-toggle aria-label="Open menu"><i class="ti-menu"></i></button>
                        <button class="ngbvd-sidebar-toggle" type="button" data-ngbvd-sidebar-toggle aria-label="Toggle sidebar"><i class="ti-menu"></i></button>
                        <div>
                            <h1 class="ngbvd-topbar-title">National Gender Based Violence Database</h1>
                            <div class="ngbvd-topbar-subtitle">Secure case data, referrals, reporting and decision support</div>
                        </div>
                    </div>
                    <div class="ngbvd-user-menu">
                        <a class="btn btn-sm btn-outline-secondary d-none d-md-inline-flex" href="{{ url('/') }}" target="_blank">Public Portal</a>
                        <div class="ngbvd-user-pill">
                            <span class="ngbvd-avatar">{{ strtoupper(substr(Auth::user()->name ?? 'U', 0, 1)) }}</span>
                            <div class="d-none d-sm-block">
                                <strong>{{ Auth::user()->name }}</strong><br>
                                <small class="text-muted">Signed in</small>
                            </div>
                        </div>
                        <form method="POST" action="{{ route('logout') }}" style="display:inline;">
                            @csrf
                            <button type="submit" class="ngbvd-logout" style="border:0;cursor:pointer;">Logout</button>
                        </form>
                        <form method="POST" action="{{ route('logout.everywhere') }}" style="display:inline;">
                            @csrf
                            <button type="submit" class="ngbvd-logout" style="border:0;cursor:pointer;background:#991b1b;" title="End all active sessions">Logout Everywhere</button>
                        </form>
                    </div>
                </header>
                <div class="ngbvd-flag-strip"><span></span><span></span><span></span></div>
                <main class="ngbvd-content" id="ngbvd-page-content">
                    <div class="ngbvd-page-container">
                        @include('components.alerts')
                        @yield('content')
                    </div>
                </main>
            </div>
        </div>
    @endguest

    <script src="{{ asset('/assets/js/jquery/jquery.min.js') }}"></script>
    <script src="{{ asset('/assets/js/popper.js/popper.min.js') }}"></script>
    <script src="{{ asset('/assets/js/bootstrap/js/bootstrap.min.js') }}"></script>
    <script src="{{ asset('/DataTables/datatables.min.js') }}"></script>
    <script src="https://cdn.datatables.net/buttons/2.4.1/js/dataTables.buttons.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.10.1/jszip.min.js"></script>
    <script src="https://cdn.datatables.net/buttons/2.4.1/js/buttons.html5.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/selectize.js/0.12.6/js/standalone/selectize.min.js" crossorigin="anonymous"></script>
    <script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
    <script src="https://cdn.jsdelivr.net/npm/cleave.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/sweetalert2@11"></script>
    @auth
        <script src="{{ asset('/assets/pages/widget/amchart/amcharts.min.js') }}"></script>
        <script src="{{ asset('/assets/pages/widget/amchart/serial.min.js') }}"></script>
        <script src="{{ asset('/assets/js/raphael/raphael.min.js') }}"></script>
        <script src="{{ asset('/assets/js/morris.js/morris.js') }}"></script>
        <script src="{{ asset('/assets/pivotjs/pivot.js') }}"></script>
        <script src="{{ asset('/assets/pivotjs/c3_renderers.js') }}"></script>
        <script src="{{ asset('/assets/pivotjs/export_renderers.js') }}"></script>
    @endauth
    @auth
        <script src="https://code.highcharts.com/highcharts.js"></script>
        <script src="https://code.highcharts.com/modules/data.js"></script>
        <script src="https://code.highcharts.com/modules/drilldown.js"></script>
        <script src="https://code.highcharts.com/modules/series-label.js"></script>
        <script src="https://code.highcharts.com/modules/exporting.js"></script>
        <script src="https://code.highcharts.com/modules/export-data.js"></script>
        <script src="https://code.highcharts.com/modules/accessibility.js"></script>
    @endauth
    <script src="{{ asset('/assets/js/ngbvd-ui.js') }}"></script>
    <script>
        if (window.Cleave && document.getElementById('crb_number')) {
            new Cleave('#crb_number', {
                blocks: [3, 2, 2, 3], uppercase: true, numericOnly: true,
                prefix: 'GBV', delimiter: '/', delimiterLazyShow: true
            });
        }
    </script>
    <script id="ngbvd-client-error-handler">
        (function(){
            function csrf(){ var tag=document.querySelector('meta[name="csrf-token"]'); return tag ? tag.getAttribute('content') : ''; }
            function friendlyError(){
                if(document.getElementById('ngbvd-js-error-banner')) return;
                var div=document.createElement('div');
                div.id='ngbvd-js-error-banner';
                div.style.cssText='position:fixed;right:18px;bottom:18px;z-index:300000;background:#111827;color:#fff;border-radius:14px;padding:12px 16px;box-shadow:0 14px 40px rgba(0,0,0,.25);max-width:360px;font-size:13px;';
                div.innerHTML='The page encountered a display issue. Please refresh or contact support if it continues.';
                document.body.appendChild(div);
            }
            function sendError(payload){
                try{
                    payload.path=window.location.pathname;
                    fetch('{{ url('/security/client-error') }}',{method:'POST',headers:{'Content-Type':'application/json','X-CSRF-TOKEN':csrf(),'Accept':'application/json'},body:JSON.stringify(payload),credentials:'same-origin'});
                }catch(e){}
            }
            window.addEventListener('error',function(e){ friendlyError(); sendError({message:String(e.message||'frontend error').slice(0,1000),source:String(e.filename||'').slice(0,1000),line:e.lineno||0,column:e.colno||0}); });
            window.addEventListener('unhandledrejection',function(e){ friendlyError(); sendError({message:String((e.reason&&e.reason.message)||e.reason||'unhandled rejection').slice(0,1000),source:'promise',line:0,column:0}); });
            document.addEventListener('DOMContentLoaded',function(){
                document.querySelectorAll('form').forEach(function(form){
                    if(!form.querySelector('input[name="_hp"]')){
                        var hp=document.createElement('input'); hp.type='text'; hp.name='_hp'; hp.value=''; hp.autocomplete='off'; hp.tabIndex=-1; hp.setAttribute('aria-hidden','true'); hp.style.cssText='position:absolute;left:-9999px;opacity:0;height:0;width:0;';
                        form.appendChild(hp);
                    }
                });
            });
        })();
    </script>
    @stack('scripts')
    @include('components.form-state')
</body>
</html>
