@extends('seller.layout.master')
@section('content')
    <style>
        .card .card-header {
            width: 100%;
            padding: 11px 0px !important;

        }

        .card .card-header,
        .card .card-body,
        .card .card-footer {
            background-color: transparent;
            padding: 14px 0px !important;
        }

        strong {
            color: #000 !important;
            font-weight: bolder;
        }

        .card-text {
            font-size: .9375rem;
            margin-left: 5px;
        }

        .carousel-cell {
            color: #141414;
            background: #58aef0;
        }

        .carousel-cell .card-text:first-of-type {
            margin-top: 5px;
        }

        .carousel-cell .card-text {
            font-size: 1.2rem !important;
            margin-bottom: 0;
        }
        .card{
            box-shadow: rgba(22, 113, 184, 0.25) 0px 13px 27px -5px, rgba(0, 0, 0, 0.3) 0px 8px 16px -8px !important;
        }
    </style>
    <section class="section">
        <form class="row">
            <div class="form-group col-md-8">
                <input class="form-control" type="search" />
            </div>
            <div class="col-md-4">
                <button class="btn btn-primary w-75">Search</button>
            </div>
        </form>
    </section>
    {{-- @dd($storages) --}}
    <div class="row">
        @forelse($storages as $storage)

        <div class="card col-md-5 mx-4">
            <div class="card-header">
                <div class="row">
                    @if($storage->storeImage)
                        @if($storage->storeImage->image1)
                            <div class="col-md-12 d-flex justify-content-center">
                                <img src="{{ asset('/storage/' . $storage->storeImage->image1) }}" style="width:40%;" />
                            </div>
                        @elseif($storage->storeImage->image2)
                        <div class="col-md-12 d-flex justify-content-center">
                            <img src="{{ asset('/storage/' . $storage->storeImage->image2) }}" style="width:40%;" />
                        </div>
                        @elseif($storage->storeImage->image3)
                        <div class="col-md-12 d-flex justify-content-center">
                            <img src="{{ asset('/storage/' . $storage->storeImage->image3) }}" style="width:40%;" />
                        </div>
                        @elseif($storage->storeImage->image4)
                        <div class="col-md-12 d-flex justify-content-center">
                            <img src="{{ asset('/storage/' . $storage->storeImage->image4) }}" style="width:40%;" />
                        </div>
                        @elseif($storage->storeImage->image5)
                        <div class="col-md-12 d-flex justify-content-center">
                            <img src="{{ asset('/storage/' . $storage->storeImage->image5) }}" style="width:40%;" />
                        </div>
                        @else
                            <div class="col-md-12 d-flex justify-content-center">
                                <img src="{{ asset('./assets/img/banner/1.png') }}" style="width:40%;" />
                            </div>
                        @endif
                    @else
                    <div class="col-md-12 d-flex justify-content-center">
                        <img src="{{ asset('./assets/img/banner/1.png') }}" style="width:40%;" />
                    </div>
                    @endif
                </div>
            </div>
            <div class="card-body">
                <div class="col-md-12">
                    <strong>{{$storage->name}}</strong>
                    <a href="#">
                        <p> <i class=" fas fa-phone"></i> View Number</p>
                    </a>
                    <p>1.14 Miles Away</p>
                    <p class="card-text mt-3 mb-2"><strong>Prices per week (inc VAT).</strong></p>
                    <div class="row d-flex justify-content-center">
                        <div class="col-md-3 mr-2 carousel-cell mt-2 text-center">
                            Box £@if($storage->pcm){{$storage->pcm->box}} @endif
                        </div>
                        <div class="col-md-3 mr-2 carousel-cell mt-2 text-center">
                            25 ft² £@if($storage->pcm){{$storage->pcm->pcm_25_ft2}} @endif
                        </div>
                        <div class="col-md-3 mr-1 carousel-cell mt-2 text-center">
                            35 ft² £@if($storage->pcm){{$storage->pcm->pcm_35_ft2}} @endif
                        </div>
                    </div>
                </div>
                <div class="card-footer px-3">
                    <p class="mb-3 features-sm">
                        @if($storage->feature)
                                    @if($storage->feature->hour)
                                        <img src="{{ asset('./webassets/imgs/Features/24-hour.png') }}" alt="24 24 Hour" title="24 24 Hour">                     @endif
                                    @if($storage->feature->hire)
                                        <img src="{{ asset('./webassets/imgs/Features/Van-Hire.jpg') }}" alt="Van Hire" title="Van Hire">                   @endif
                                    @if($storage->feature->cctv)
                                        <img src="{{ asset('./webassets/imgs/Features/cctv.png') }}" alt="CCTV" title="CCTV">               @endif
                                    @if($storage->feature->forklift)
                                        <img src="{{ asset('./webassets/imgs/Features/Forklift.png') }}" alt="Forklift" title="Forklift">                   @endif
                                    @if($storage->feature->climate_control)
                                        <img src="{{ asset('./webassets/imgs/Features/Climate-Control.jpg') }}" alt="Climate Control" title="Climate Control">                          @endif
                                    @if($storage->feature->container)
                                        <img src="{{ asset('./webassets/imgs/Features/Container.png') }}" alt="Containers" title="Containers">                     @endif
                                    @if($storage->feature->assistance_at_store)
                                        <img src="{{ asset('./webassets/imgs/Features/Assistance.png') }}" alt="Assistance at store" title="Assistance at store">                              @endif
                                    @if($storage->feature->free_pick_up)
                                        <img src="{{ asset('./webassets/imgs/Features/pick-up.png') }}" alt="Free pick-up" title="Free pick-up">                       @endif
                                    @if($storage->feature->packaging)    
                                        <img src="{{ asset('./webassets/imgs/Features/packaging.png') }}" alt="Packaging Available" title="Packaging Available">                                  @endif
                                        @if($storage->feature->insurance)
                                        <img src="{{ asset('./webassets/imgs/Features/insurance.png') }}" alt="Insurance Available" title="Insurance Available">                                  @endif
                                        @if($storage->feature->truck)
                                        <img src="{{ asset('./webassets/imgs/Features/Pallet-Trucks.png') }}" alt="Pallet Trucks" title="Pallet Trucks">                            @endif
                                        @if($storage->feature->box)
                                        <img src="{{ asset('./webassets/imgs/Features/box.png') }}" alt="Box Storage" title="Box Storage">                          @endif
                                        @if($storage->feature->electricity)
                                        <img src="{{ asset('./webassets/imgs/Features/Electricity.png') }}" alt="Electricity" title="Electricity">                          @endif
                                        @if($storage->feature->lockable)
                                        <img src="{{ asset('./webassets/imgs/Features/Lockable-Door.png') }}" alt="Lockable Door" title="Lockable Door">                            @endif
                                        @if($storage->feature->drive_up_access)
                                        <img src="{{ asset('./webassets/imgs/Features/Drive.png') }}" alt="Drive Up Access" title="Drive Up Access">                              @endif
                                        @if($storage->feature->drive_in_loading_unloading)
                                        <img src="{{ asset('./webassets/imgs/Features/Drive-in-Loading-Unloading.jpg') }}" alt="Drive-in Loading/Unloading" title="Drive-in Loading/Unloading">
                                        @endif
                                        @if($storage->feature->valet)
                                        <img src="{{ asset('./webassets/imgs/Features/Service-Valet.png') }}" alt="Service/Valet" title="Service/Valet">                            @endif
                                        @if($storage->feature->lightning)
                                        <img src="{{ asset('./webassets/imgs/Features/security-lighting.png') }}" alt="Security Lightning" title="Security Lightning">                                 @endif
                                        @if($storage->feature->pin_access)
                                        <img src="{{ asset('./webassets/imgs/Features/Pin-Access.jpg') }}" alt="Pin Access" title="Pin Access">                         @endif
                                        @if($storage->feature->fencing)
                                        <img src="{{ asset('./webassets/imgs/Features/security-fencing.png') }}" alt="Security Fencing" title="Security Fencing">                               @endif
                                        @if($storage->feature->anpr)
                                        <img src="{{ asset('./webassets/imgs/Features/ANPR.png') }}" alt="ANPR" title="ANPR">                   @endif
                                        @if($storage->feature->vermin)
                                        <img src="{{ asset('./webassets/imgs/Features/Vermin-Control.png') }}" alt="Vermin Control" title="Vermin Control">                             @endif
                                        @if($storage->feature->padlock)
                                        <img src="{{ asset('./webassets/imgs/Features/Padlock.png') }}" alt="Padlock" title="Padlock">                      @endif
                                        @if($storage->feature->alarm)
                                        <img src="{{ asset('./webassets/imgs/Features/security-alarm.png') }}" alt="Security Alarm" title="Security Alarm">                             @endif
                                        @if($storage->feature->cover)
                                        <img src="{{ asset('./webassets/imgs/Features/Under-Cover.png') }}" alt="Under Cover" title="Under Cover">                          @endif
                                        @if($storage->feature->lift)
                                        <img src="{{ asset('./webassets/imgs/Features/Lift.png') }}" alt="Lift" title="Lift">                   @endif
                                        @if($storage->feature->standing)
                                        <img src="{{ asset('./webassets/imgs/Features/Hard-Standing.jpg') }}" alt="Hard Standing" title="Hard Standing">                            @endif
                                        @if($storage->feature->cassoa)
                                        <img src="{{ asset('./webassets/imgs/Features/CaSSOA.png') }}" alt="CaSSOA" title="CaSSOA">                     @endif
                                        @if($storage->feature->shelving)
                                        <img src="{{ asset('./webassets/imgs/Features/Shelving.jpg') }}" alt="Shelving" title="Shelving">                       @endif
                                        @if($storage->feature->gates)
                                        <img src="{{ asset('./webassets/imgs/Features/security-gates.png') }}" alt="Security Gates" title="Security Gates">                             @endif
                                        @if($storage->feature->patrol)
                                        
                                        <img src="{{ asset('./webassets/imgs/Features/Security-guard.png') }}" alt="Security Guard/Patrol" title="Security Guard/Patrol">
                                        @endif
                                        
                                @endif
                       
                    </p><a href="{{route('seller.storage.view',['id'=>$storage->id])}}" class="btn btn-primary rounded btn-block mb-1">View store</a>
                </div>
            </div>
        </div>
        @empty

        @endforelse
    
    </div>
    @endsection