@extends('layouts.app')

@section('content')
<style>
    .container {
        max-width: 1775px;
    }
</style>
<div class="">
    <div class="row justify-content-center">
        <div class="col" id="cashier">
            <div class="head-cashier">
                <div class="clock1">
                    <div>
                        <livewire:clock />
                    </div>
                    @php
                            $words = explode(' ', $setting->wh_name);
                            $firstTwoWords = implode(' ', array_slice($words, 0, 1));
                            $remainingWords = implode(' ', array_slice($words, 1));
                        @endphp
                        <div style="display: flex; flex-direction: column;">
                            <h5 class="mb-0 mt-1 head-cashier1" style="font-weight: 300">{{ $firstTwoWords }}</h5>
                            <h2 class="" id="realTimeClock" style="margin-top: 9px; font-weight: 600">{{ $remainingWords }}</h2>
                        </div>
                </div>

                <div class="logo" style="margin-right: -13.5px">
                    <img src="{{asset('assets/SoftComp - Logo-01.png')}}" alt="Deskripsi Gambar">
                </div>
            </div>

            <div class="card-body">

                <livewire:cashier.display />
            </div>
        </div>
    </div>
</div>
@endsection