@extends('layouts.master')

@section('meta')
    <title>{{__('message.title')}}</title>
    <meta name="description" content="{{__('message.description')}}">
    <meta name="keywords" content="{{__('message.title')}}">
    <link rel="canonical" href="{{route('home')}}"/>
    <meta property="og:title" content="{{__('message.title')}}" />
    <meta property="og:description" content="{{__('message.description')}}" />
    <meta property="og:type" content="game" />
    <meta property="og:url" content="{{route('home')}}" />
    <meta property="og:image" content="{{asset('cover-web.png')}}" />
    <meta name="twitter:title" content="{{__('message.title')}}" />
    <meta name="twitter:description" content="{{__('message.description')}}" />
@endsection

@push('css')
    <link rel="stylesheet" href="{{asset('slide/style.css')}}">
@endpush

@section('slide')
    {{-- Slide --}}
    <div id="wowslider-container1">
        <div class="ws_images">
            <ul>
                @foreach($slides as $index =>$slide)
                <li>
                    <img src="{{asset($slide->feature_image)}}" alt="Slide" title="" id="wows1_{{$index}}" />
                </li>
                @endforeach
            </ul>
        </div>
    </div>
@endsection

@section('content')
    {{-- Agent and video youtube --}}
    <div class="video-youtube my-bg-black">
        <div class="row">
            <div class="col-md-6 align-self-center pe-md-0">
                <img src="{{asset('img/bg-head.png')}}" alt="Agent">
            </div>
            <div class="col-md-6 ps-md-0">
                <div class="ratio ratio-16x9">
                    <iframe width="560" height="315" src="https://www.youtube.com/embed/RhiFR4pzEn8" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture" allowfullscreen></iframe>    
                </div>
            </div>
        </div>
    </div>

    {{-- List games --}}
    <div class="games my-bg-black">
        <div class="row">
            <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 my-1">
                <div class="item-game">
                    <a href="{{ route('casino') }}" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/games/casino.jpg')}}" alt="Casino" width="100%">
                        </div>
                        <div class="title">
                            <h3>{{__('message.casino')}}</h3>
                        </div>
                    </a>
                </div>
            </div>
            <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 my-1">
                <div class="item-game">
                    <a href="{{ route('sport') }}" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/games/sport.jpg')}}" alt="Casino" width="100%">
                        </div>
                        <div class="title">
                            <h3>{{__('message.sport')}}</h3>
                        </div>
                    </a>
                </div>
            </div>
            <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 my-1">
                <div class="item-game">
                    <a href="https://www.joker123.net" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/games/slot.jpg')}}" alt="Casino" width="100%">
                        </div>
                        <div class="title">
                            <h3>{{__('message.slot')}}</h3>
                        </div>
                    </a>
                </div>
            </div>
            <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 my-1">
                <div class="item-game">
                    <a href="https://www.2d2u.com" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/games/lottery.jpg')}}" alt="Casino" width="100%">
                        </div>
                        <div class="title">
                            <h3>{{__('message.lottory')}}</h3>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
    
    {{-- Master288 description --}}
    <div class="s-desc">
        <h1 class="angry-animate">{{__('message.supermaster789 is the best online casino in cambodia')}}</h1>
        <p>
            {{__('message.p3')}}
        </p>
        <hr>
       {{--  <div class="ratio ratio-16x9">
            <iframe src="https://www.youtube.com/embed/JDMuZ9HoVgQ" title="welcome to supermaster789" allowfullscreen></iframe>
        </div> --}}
        <hr>
        <div class="row offset-md-2">
            <!-- <div class="col-6 col-sm-6 col-md-2 my-1 my-sm-1 my-md-0 px-1 px-md-1 text-center">
                    <img src="{{asset('bank/canadia1.png')}}" alt="ABA" width="100%">
            </div> -->
            <div class="col-6 col-sm-6 col-md-3 my-1 my-sm-1 my-md-0 px-1 px-md-1 text-center">
                    <img class="aba" src="{{asset('bank/aba1.png')}}" alt="ABA" width="100%">
            </div>
            <div class="col-6 col-sm-6 col-md-3 my-1 my-sm-1 my-md-0 px-1 px-md-1 text-center">
                    <img class="aceleda" src="{{asset('bank/aceleda1.png')}}" alt="aceleda" width="100%">
            </div>
            <div class="col-6 col-sm-6 col-md-3 my-1 my-sm-1 my-md-0 px-1 px-md-1 text-center offset-3 offset-md-0">
                    <img class="wing" src="{{asset('bank/wing1.png')}}" alt="WING" width="100%">
            </div>
            <!---<div class="col-6 col-sm-6 col-md-3 my-1 my-sm-1 my-md-0 px-1 px-md-1 text-center">
                <img class="truemoney" src="{{asset('bank/truemoney1.png')}}" alt="True Money" width="100%">
            </div> -->
        </div>

        {{-- Promotion --}}
        <div class="row mt-1">
            @forelse ($promotions as $promotion)
                <div class="col-md-4 px-md-1 my-1 my-md-0">
                    <a href="{{route('promotion-detail',$promotion->id)}}">
                        <img src="{{$promotion->feature_image}}" alt="promotion" class="w-100 img-thumbnail">
                    </a>
                </div>
            @empty
                
            @endforelse
        </div>
    </div>
    
    {{-- Casino Online --}}
    <div class="casino-game">
        <h1 class="mb-0"><i class="fas fa-crown"></i> {{__('message.casino')}}</h1>
        <div class="list-item">
            <div class="row">
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 px-md-1 my-1 my-lg-1">
                    <a href="https://www.ibet288.com/" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/casino-online/Ibet789.jpg')}}" alt="" width="100%">
                        </div>                            
                        <div class="game-name">
                            <h3>Ibet789</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 px-md-1 my-1 my-lg-1 game-item">
                    <a href="https://www.12vegas.com/en-US" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/casino-online/12vegas.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>12vigas</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 px-md-1 my-1 my-lg-1">
                    <a href="http://www.855win.com/855win/Index.aspx?lang=en" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/casino-online/855bet.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>855win</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 px-md-1 my-1 my-lg-1">
                    <a href="https://pussy888sg.com" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/casino-online/pussy.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>pussy88</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 px-md-1 my-1 my-lg-1">
                    <a href="https://www.joker123.net" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/casino-online/Joker.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>Joker</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 px-md-1 my-1 my-lg-1">
                    <a href="http://live22apk.com" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/casino-online/Live22.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>Live22</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 px-md-1 my-1 my-lg-1">
                    <a href="https://live789.com" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/casino-online/Live789.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>live789</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 px-md-1 my-1 my-lg-1">
                    <a href="https://www.2d2u.com" target="_blank" class="text-decoration-none img-hover-zoom--quick-zoom">
                        <div class="img-item">
                            <img src="{{asset('img/casino-online/2d2u.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>2d2u</h3>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>

    {{-- Sport Online --}}
    <div class="casino-game">
        <h1 class="mb-0"><i class="fas fa-futbol"></i> {{__('message.sport')}}</h1>
        <div class="list-item">
            <div class="row">
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 my-1">
                    <a href="https://live789.com" target="_blank" class="img-hover-zoom--quick-zoom text-decoration-none">
                        <div class="img-item">
                            <img src="{{asset('img/sport-online/Live789-ball.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>Live789</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 my-1">
                    <a href="https://www.ibet788.com" target="_blank" class="img-hover-zoom--quick-zoom text-decoration-none">
                        <div class="img-item">
                            <img src="{{asset('img/sport-online/Ibet789-ball.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>Ibet789</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 my-1">
                    <a href="http://www.855win.com/855win/Index.aspx?lang=en" target="_blank" class="img-hover-zoom--quick-zoom text-decoration-none">
                        <div class="img-item">
                            <img src="{{asset('img/sport-online/855bet-ball.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>855win</h3>
                        </div>
                    </a>
                </div>
                <div class="col-6 col-sm-6 col-md-4 col-lg-3 px-1 my-1">
                    <a href="http://live22apk.com" target="_blank" class="img-hover-zoom--quick-zoom text-decoration-none">
                        <div class="img-item">
                            <img src="{{asset('img/sport-online/Live22-ball.jpg')}}" alt="" width="100%">
                        </div>
                        <div class="game-name">
                            <h3>Live22</h3>
                        </div>
                    </a>
                </div>
            </div>
        </div>
    </div>
@endsection

@push('scripts')
    <script type="text/javascript" src="{{asset('slide/wowslider.js')}}"></script>
    <script type="text/javascript" src="{{asset('slide/script.js')}}"></script>
@endpush