@extends('components.home')


@section('themeStylesheet')
    <style>
        {{ $themeStylesheet }}
    </style>
@endsection


@section('brandThemeOverrideSettings')
    <style>
        {{ $brandThemeOverrideSettings }}
    </style>
@endsection


@section('brandBackground')
    @if($brandBackground!=='' && !empty($brandBackground))
        style="background-image:url('{{ $brandBackground }}');"
    @endif
@endsection


@section('content')

    <!-- If we have a Pendng Order, let's give the user a way to see the order -->
    @if($hasPendingOrder)
        <div class="row mx-0 py-2 pending-order--wrapper text-center w-100"
             x-data
             x-on:click="pageLoader=true,window.location.href = '/pendingOrder@php
                    echo \App\Http\Controllers\Controller::urlParameters()
                 @endphp';">
            <div class="col-12">
                <i class="far fa-clock mr-2"></i>You have a pending appointment -
                <span style="text-decoration: underline;">View Appointment Details</span>
            </div>

            @if($hasCurbsideEnabled)
            <!-- If we have Curbside enabled, let's show a button -->
            <livewire:Button
                text="Curbside Pickup"
                class="curbside--button btn-primary w-auto px-5 py-2 mt-3"
                icon="<i class='fas fa-person-carry'></i>"
            />
            @endif
        </div>
    @endif



    <div>
        <div class="brand-log-wrapper w-100">
            <img class="brand-logo" src="{{ $brandLogo }}">
        </div>
    </div>





    <div class="footer-home">


        <!-- If we have a home-page message to display, let's show it here -->
        @if(!empty($locationHomePageMessages))
            <div class="home-info-wrapper row mx-0 px-1">

                <div class="home-info col-12 p-3">
                    @if(!$isLocationOpen)
                        Sorry, we are closed :(
                    @else
                        {{ $locationHomePageMessages }}
                    @endif
                </div>
                <!-- If location is closed, But Active, let's show a
                button so the customer can at least see the menu -->
                @if(!$isLocationOpen && $isLocationActive)
                    <div class="col-12 text-center py-2 px-1">
                        <livewire:Button
                            :text="$buttonText_viewMenu"
                            class="footer-home--button btn-primary"
                            :icon="$buttonIcon_viewMenu"
                            targetUrl="menu"
                        />
                    </div>
                @endif
            </div>
        @endif





        <!-- If location is Active && OPEN Let's show the 'Footer' -->
        @if($isLocationOpen && $isLocationActive)
            @php
                $colSpace = $displayLocationButton ? '6' : '12';
            @endphp
            <div class="row m-0 px-1 footer-home--button-wrapper">
                <div class="col-{{$colSpace}} text-center py-2 px-1">
                    <livewire:Button
                        :text="$buttonText_orderNow"
                        class="footer-home--button btn-primary"
                        :icon="$buttonIcon_orderNow"
                        targetUrl="orderType"
                    />
                </div>
                @if($displayLocationButton)
                    <div class="col-6 text-center py-2 px-1">
                        <livewire:Button
                            :text="$buttonText_ourLocation"
                            class="footer-home--button btn-secondary"
                            :icon="$buttonIcon_ourLocation"
                            xon="addressMap=!addressMap"
                        />
                    </div>
                @endif
            </div>
        @endif



        <!-- If this location has multiple Locations, we should show a button to change location -->
        @if($multipleLocations)
            <div class="row m-0 py-2 change-location-wrapper">
                <div class="col-6 text-left">
                    Orlando
                </div>
                <div class="col-6 text-right" style="text-align: right;">
                    <a href="#" wire:navigate>Change Location</a>
                </div>
            </div>
        @endif





        <!-- If this app is under some maintenance, let's let the customers know -->
        @if($underMaintenance)
            <div class="row m-0 py-2 under-maintenance-wrapper text-center">
                <div class="col-12">
                    <i class="far fa-construction"></i> Under Maintenance - Please do not order
                </div>
            </div>
        @endif

    </div>







@endsection