<!DOCTYPE html>
<html lang="{{ str_replace('_', '-', app()->getLocale()) }}">
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width,initial-scale=1,user-scalable=0,minimal-ui">
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <meta name="author" content="{{ website_config('main')->meta_author }}" />
    <meta name="keywords" content="@yield('keywords', website_config('main')->meta_keywords)" />
    <meta name="description" content="@yield('description', website_config('main')->meta_description)" />
    <meta name="robots" content="@yield('robots', 'index,follow')" />
    <link rel="canonical" href="{{ url()->current() }}" />
    <title>
    @yield('title', website_config('main')->website_name)
    </title>
    <link rel="shortcut icon" href="{{ url('file/images/'.website_config('main')->website_favicon.'') }}">
    @include('assets.header-resources')
    <link href="{{ asset('assets/'.website_config('template')->number.'/css/bootstrap.min.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('assets/'.website_config('template')->number.'/css/icons.min.css') }}" rel="stylesheet" type="text/css" />
    <link href="{{ asset('assets/'.website_config('template')->number.'/css/app.min.css') }}" rel="stylesheet" type="text/css" />
    <script src="{{ asset('assets/'.website_config('template')->number.'/libs/jquery/jquery.min.js') }}"></script>
    <script src="{{ asset('assets/'.website_config('template')->number.'/libs/bootstrap/js/bootstrap.bundle.min.js') }}"></script>
    @yield('another-header-resources')
    <meta property="og:type" content="website" />
    <meta property="og:site_name" content="{{ website_config('main')->website_name }}" />
    <meta property="og:title" content="@yield('title', website_config('main')->website_name)" />
    <meta property="og:description" content="@yield('meta_description', website_config('main')->meta_description)" />
    <meta property="og:url" content="{{ url()->current() }}" />
    <meta property="og:image" content="@yield('og_image', asset('file/images/buzzerinaja.jpg'))" />
    <meta name="twitter:card" content="summary_large_image" />
    <meta name="twitter:title" content="@yield('title', website_config('main')->website_name)" />
    <meta name="twitter:description" content="@yield('meta_description', website_config('main')->meta_description)" />
    <meta name="twitter:image" content="@yield('og_image', asset('file/images/buzzerinaja.jpg'))" />
</head>
<body data-topbar="dark" data-layout="horizontal">
    <div id="layout-wrapper">
        <header id="page-topbar">
            <div class="navbar-header">
                <div class="d-flex">
                    <div class="navbar-brand-box">
                        <a href="{{ url('/') }}" class="logo logo-dark">
                            <span class="logo-sm text-uppercase text-white" style="font-size: 22px; font-weight: Bold;">
                                <i class="fa fa-globe text-white"></i>
                            </span>
                            <span class="logo-lg text-uppercase text-white" style="font-size: 20px; font-weight: Bold;">
                                {{ website_config('main')->website_name }}
                            </span>
                        </a>
                        <a href="{{ url('/') }}" class="logo logo-light">
                            @if (website_config('main')->website_logo_light <> null)
                            <span class="logo-lg">
                                <img src="{{ url('file/images/'.website_config('main')->website_logo_light.'') }}" alt="Logo {{ website_config('main')->website_name }}" style="height: 50px;">
                            </span>
                            @else
                            <span class="logo-lg text-uppercase text-white" style="font-size: 20px; font-weight: Bold;">
                                {{ website_config('main')->website_name }}
                            </span>
                            @endif
                            @if (website_config('main')->website_logo_small_light <> null)
                            <span class="logo-sm">
                                <img src="{{ url('file/images/'.website_config('main')->website_logo_small_light.'') }}" alt="Logo {{ website_config('main')->website_name }}" height="40">
                            </span>
                            @else
                            <span class="logo-sm text-uppercase text-white" style="font-size: 20px; font-weight: Bold;">
                                <i class="fa fa-globe"></i>
                            </span>
                            @endif
                        </a>
                    </div>
                    <button type="button" class="btn btn-sm mr-2 font-size-16 d-lg-none header-item waves-effect waves-light" data-toggle="collapse" data-target="#topnav-menu-content">
                        <i class="fa fa-fw fa-bars"></i>
                    </button>
                </div>
                <div class="d-flex">
                    @if (Auth::check() == true)
                    <div class="dropdown d-inline-block">
                        <button type="button" class="btn header-item noti-icon waves-effect">
                            Saldo: Rp {{ number_format(Auth::user()->balance,0,',','.') }}
                        </button>
                    </div>
                    <div class="dropdown d-inline-block">
                        <button type="button" class="btn header-item waves-effect" id="page-header-user-dropdown" data-toggle="dropdown" aria-haspopup="true" aria-expanded="false">
                            <i class="fa fa-user"></i>
                            <span class="d-none d-sm-inline-block ml-1">
                                {{ Auth::user()->full_name }}
                            </span>
                            <i class="mdi mdi-chevron-down d-none d-sm-inline-block"></i>
                        </button>
                        <div class="dropdown-menu dropdown-menu-right">
                            <a class="dropdown-item" href="{{ url('account/profile') }}">
                                <i class="mdi mdi-account font-size-16 align-middle mr-1"></i> 
                                Profil
                            </a>
                            <a class="dropdown-item" href="{{ url('account/log/login') }}">
                                <i class="mdi mdi-history font-size-16 align-middle mr-1"></i> 
                                Log Masuk
                            </a>
                            <a class="dropdown-item" href="{{ url('account/log/balance') }}">
                                <i class="mdi mdi-wallet align-middle mr-1"></i> 
                                Log Saldo
                            </a>
                            <a class="dropdown-item" href="{{ url('account/settings') }}">
                                <i class="mdi mdi-account-settings font-size-6 align-middle mr-1"></i> 
                                Pengaturan Akun
                            </a>
                            <a class="dropdown-item" href="{{ url('auth/logout') }}">
                                <i class="mdi mdi-logout font-size-16 align-middle mr-1"></i> 
                                Keluar
                            </a>
                        </div>
                    </div>
                    @endif
                </div>
            </div>
        </header>
        <div class="topnav">
            <div class="container-fluid">
                <nav class="navbar navbar-light navbar-expand-lg topnav-menu">
                    <div class="collapse navbar-collapse" id="topnav-menu-content">
                        <ul class="navbar-nav">
                             @include('user.layouts.navigation')
                        </ul>
                    </div>
                </nav>
            </div>
        </div>
        <div class="main-content">
            <div class="page-content">
                <div class="container-fluid">
                    <div class="modal fade" id="modal" id="modal-detail" tabindex="-1" role="dialog" aria-labelledby="mySmallModalLabel" aria-hidden="true" style="display: none;">
                        <div class="modal-dialog modal-dialog-centered modal-lg">
                            <div class="modal-content">
                                <div class="modal-header">
                                    <h5 class="modal-title mt-0" id="modal-title"></h5>
                                    <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
                                </div>
                                <div class="modal-body" id="modal-detail-body">
                                </div>
                                <div class="modal-footer hidden" id="modal-footer">
                                    <button type="button" class="btn btn-light" data-dismiss="modal">Tutup</button>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="row">
                        <div class="col-lg-12">
                            <div class="page-title-box d-flex align-items-center justify-content-between">
                                <h1 class="mb-0 font-size-18">
                                    @yield('page-title')
                                </h1>
                                <div class="page-title-right">
                                    <ol class="breadcrumb m-0" aria-label="breadcrumb">
                                        <li class="breadcrumb-item">
                                            <a href="{{ url('/') }}">Home</a>
                                        </li>
                                        <li class="breadcrumb-item">
                                            <a href="@yield('breadcrumb-second-url', '#')">
                                                @yield('breadcrumb-second')
                                            </a>
                                        </li>
                                        <li class="breadcrumb-item active">
                                            @yield('breadcrumb-first')
                                        </li>
                                    </ol>
                                </div>
                            </div>
                        </div>
                        @hasSection('button')
                        <div class="col-lg-12" style="margin-bottom: 20px; margin-top: -10px;">
                            @yield('button')
                        </div>
                        @endif
                    </div>  
                    @include('user.layouts.alert')
                    @yield('content') 
                </div>
            </div>
            <footer class="footer">
                <div class="container-fluid">
                    <div class="row">
                        <div class="col-lg-12 text-center">
                            © {{ date('Y') }} {{ website_config('main')->website_name }}. All Rights Reserved.
                        </div>
                    </div>
                </div>
            </footer>
        </div>
    </div>
    <script src="{{ asset('assets/'.website_config('template')->number.'/libs/metismenu/metisMenu.min.js') }}"></script>
    <script src="{{ asset('assets/'.website_config('template')->number.'/libs/simplebar/simplebar.min.js') }}"></script>
    <script src="{{ asset('assets/'.website_config('template')->number.'/libs/node-waves/waves.min.js') }}"></script>
    @include('assets.footer-resources')
    <script src="{{ asset('assets/'.website_config('template')->number.'/js/app.js') }}"></script>
</body>
</html>