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

<head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no" />
    <meta name="csrf-token" content="{{ csrf_token() }}">
    <meta name="description" content="" />
    <meta name="keywords" content="" />
    <meta name="author" content="Hossam Mohamed" />
    <link rel="shortcut icon" href="{{ settings('website_favicon') ? getFileUrl(settings('website_favicon')) : asset('assets/web/images/logo_icon.png') }}" title="Favicon" sizes="16x16" />

    <!--With LTR -->

    <!--  -->
 @if(getCurrentLocale() == 'ar')
    <!--With RTL -->
    <link rel="stylesheet" href="{{ asset('assets/web/css/lib/bootstrap.rtl.min.css') }}" />
    <!--  -->
    @else
       <link rel="stylesheet" href="{{ asset('assets/web/css/lib/bootstrap.min.css') }}">
    @endif

    <!-- google roboto font -->
    <link
        href="https://fonts.googleapis.com/css2?family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap"
        rel="stylesheet">
    <!--  -->

    <link rel="stylesheet" href="{{ asset('assets/web/css/lib/animate.css') }}" />
    <link rel="stylesheet" href="{{ asset('assets/web/css/lib/jquery.fancybox.css') }}" />
    <link rel="stylesheet" href="{{ asset('assets/web/css/lib/swiper.min.css') }}" />
    <link rel="stylesheet" href="{{ asset('assets/web/css/lib/all.min.css') }}" />
    <link rel="stylesheet" href="{{ asset('assets/web/css/style.css') }}" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.css" />
     @if(getCurrentLocale() == 'en')
    <link rel="stylesheet" href="{{ asset('assets/web/css/style_en.css') }}">
    @endif
    <title> {{ settings('website_name') . ' | ' . ($title ?? '') }} </title>

</head>

<body class="">

@include('web.layouts.loader')

@include('web.layouts.menu')

@yield('content')

@include('web.layouts.footer')

<!-- ====== start to top button ====== -->
<div class="progress-wrap">
    <svg class="progress-circle svg-content" width="100%" height="100%" viewBox="-1 -1 102 102">
        <path d="M50,1 a49,49 0 0,1 0,98 a49,49 0 0,1 0,-98"
            style="transition: stroke-dashoffset 10ms linear 0s; stroke-dasharray: 307.919, 307.919; stroke-dashoffset: 220.587;">
        </path>
    </svg>
</div>
<!-- ====== end to top button ====== -->
<!-- -------------- request ----------------- -->
<script src="{{ asset('assets/web/js/lib/jquery-3.0.0.min.js') }}"></script>
<script src="{{ asset('assets/web/js/lib/jquery-migrate-3.0.0.min.js') }}"></script>
<script src="{{ asset('assets/web/js/lib/bootstrap.bundle.min.js') }}"></script>
<script src="{{ asset('assets/web/js/lib/wow.min.js') }}"></script>
<script src="{{ asset('assets/web/js/lib/jquery.fancybox.js') }}"></script>
<script src="{{ asset('assets/web/js/lib/swiper.min.js') }}"></script>
<script src="{{ asset('assets/web/js/lib/jquery.waypoints.min.js') }}"></script>
<script src="{{ asset('assets/web/js/lib/jquery.counterup.js') }}"></script>
<script src="{{ asset('assets/web/js/lib/back-to-top.js') }}"></script>
<script src="{{ asset('assets/web/js/main.js') }}"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/toastr.js/latest/toastr.min.js"></script>
<script src="{{ asset('assets/web/js/custom/formAction.js') }}"></script>
<script src="{{ asset('assets/web/js/custom/response.js') }}"></script>

<script>
    $('.counter').countUp({
        delay: 10,
        time: 2000
    });
</script>

</body>

</html>
