@extends('layouts.app')

@section('content')

    <div class="container-fluid page-headline"></div>
    @if(isset($featured_company->id))
        <div class="container casino-more-details mb-0">
            <div class="row casino-info shadow-sm p-md-0">
                <div class="col-12 col-md-5 pr-md-0">
                    <div class="casino-image float-left"
                         style="background-image:url('/uploads/companies/{{$featured_company->image}}')"></div>
                    <div class="float-left">
                        <div class="casino-title">{{$featured_company->title}}</div>
                        @if(isset($featured_company->offers[0]))
                            <div class="casino-bonus">{{$featured_company->offers[0]->categories[0]->title}}</div>
                            <div class="casino-bonus-descr">
                                {{$featured_company->offers[0]->short_content}}
                            </div>
                        @endif
                        @if(isset($featured_company->offers[1]))
                            <div class="d-block d-md-none">
                                <div class="casino-bonus">{{$featured_company->offers[1]->categories[0]->title}}</div>
                                <div class="casino-bonus-descr">
                                    {{$featured_company->offers[1]->short_content}}
                                </div>
                            </div>
                        @endif
                    </div>

                </div>

                <div class="col-6 col-md-3 p-md-0 d-none d-md-block">
                    @if(isset($featured_company->offers[1]))
                        <div class="casino-title">&nbsp;</div>
                        <div class="casino-bonus">{{$featured_company->offers[1]->categories[0]->title}}</div>
                        <div class="casino-bonus-descr">
                            {{$featured_company->offers[1]->short_content}}
                        </div>
                    @endif
                </div>

                <div class="col-12 col-md-4 pl-md-0">
                    <div class="float-left mt-65">
                        @for($i=0; $i<5; $i++)
                            @if($i>=$featured_company->score)
                                <i class="fa fa-star star-o-color" aria-hidden="true"></i>
                            @else
                                <i class="fa fa-star star-color" aria-hidden="true"></i>
                            @endif
                        @endfor
                        <span class="rate align-middle text-white">&nbsp;{{$featured_company->score}}/5</span>
                    </div>
                    <div class="float-left ">
                        <button class="btn btn-primary align-bottom roboto-bold view-all"
                                onclick="window.open('{{$featured_company->play_now_link}}')">
                            PLAY NOW
                        </button>
                    </div>

                </div>
            </div>
        </div>
    @endif
    <div class="container mb-0">
        <div class="row pb-3 pt-5">
            <div class="col main-deposit-bonuses pl-lg-0">
                <h2 class="roboto-regular">{{$category->title}}</h2>
            </div>
        </div>
    </div>
    <div class="container casinos-list">
        <hr>
        <div class="row">
            @foreach($companies as $company)
                @include('partials.company',['width'=>4,'company'=>$company])
            @endforeach
        </div>
    </div>

    <div class="container">
        @include('partials.paginator',['slug'=>$category->slug, 'paginator'=>$paginator])
    </div>
@endsection