<footer class="p-0 bg-very-light-gray position-relative">
    <div class="container position-relative">
        <div class="row justify-content-center pt-5 sm-pt-40px">
            <div
                class="col-12 col-xl-4 col-lg-4 col-sm-6 last-paragraph-no-margin text-xl-start text-lg-center lg-mb-50px sm-mb-30px">
                <a href="{{ url('/') }}" class="footer-logo mb-15px d-inline-block">
                    @if ($general->site_logo)
                        <img src="{{ asset('storage/' . $general->site_logo) }}"
                            data-at2x="{{ asset('storage/' . $general->site_logo) }}" alt="{{ $general->site_name }}">
                    @else
                        <img src="{{ asset('assets/img/logo/icon-with-text.png') }}"
                            data-at2x="{{ asset('assets/img/logo/icon-with-text.png') }}"
                            alt="{{ $general->site_name }}">
                    @endif
                </a>
                <div class="fw-700 text-dark-gray text-uppercase ls-minus-1px fs-18 lh-24">
                    Dinas Komunikasi dan Informatika<br>Kabupaten Purwakarta
                </div>
            </div>

            <!-- Kiri: Alamat dan Social Media -->
            <div class="col-6 col-xl-3 col-lg-4 col-sm-6 xs-mb-30px">
                <span class="fw-600 d-block text-dark-gray mb-10px">Kontak & Alamat</span>
                @if ($general->address)
                    <p class="lh-22 mb-15px">{{ $general->address }}</p>
                @endif
                <div class="lh-22 mb-15px">
                    @if ($general->site_email)
                        <a href="mailto:{{ $general->site_email }}" class="d-block"><i
                                class="bi bi-envelope me-10px"></i>{{ $general->site_email }}</a>
                    @endif
                    @if ($general->site_phone)
                        <a href="tel:{{ $general->site_phone }}" class="d-block"><i
                                class="bi bi-telephone me-10px"></i>{{ $general->site_phone }}</a>
                    @endif
                </div>
                <div class="elements-social social-icon-style-02">
                    <ul class="medium-icon dark">
                        @if ($social->facebook)
                            <li class="my-0">
                                <a class="facebook " href="{{ $social->facebook }}" target="_blank">
                                    <i class="fa-brands fa-facebook-f"></i>
                                </a>
                            </li>
                        @endif
                        @if ($social->twitter)
                            <li class="my-0">
                                <a class="twitter " href="{{ $social->twitter }}" target="_blank">
                                    <i class="fa-brands fa-twitter"></i>
                                </a>
                            </li>
                        @endif
                        @if ($social->instagram)
                            <li class="my-0">
                                <a class="instagram " href="{{ $social->instagram }}" target="_blank">
                                    <i class="fa-brands fa-instagram"></i>
                                </a>
                            </li>
                        @endif
                        @if ($social->youtube)
                            <li class="my-0">
                                <a class="youtube " href="{{ $social->youtube }}" target="_blank">
                                    <i class="fa-brands fa-youtube"></i>
                                </a>
                            </li>
                        @endif
                    </ul>
                </div>
            </div>

            <!-- Samping Kanan: Tautan -->
            <div class="col-6 col-xl-2 col-lg-2 col-sm-4 xs-mb-30px">
                <span class="fw-600 d-block text-dark-gray mb-10px">Tautan</span>
                <ul>
                    <li>
                        <a href="{{ route('home') }}">Beranda</a>
                    </li>
                    <li>
                        <a wire:navigate href="{{ route('news.index') }}">Berita</a>
                    </li>
                    <li>
                        <a href="#">Pengumuman</a>
                    </li>
                    <li>
                        <a wire:navigate href="{{ route('about-us') }}">Tentang Kami</a>
                    </li>
                    <li>
                        <a wire:navigate href="{{ route('contact-us') }}">Kontak</a>
                    </li>
                </ul>
            </div>

            <!-- Samping Kanan (Paling Kanan): Statistik Pengunjung -->
            <div class="col-6 col-xl-3 col-lg-2 col-sm-4 xs-mb-30px">
                <span class="fw-600 d-block text-dark-gray mb-10px">Statistik Visitor</span>
                <ul class="list-style-01">
                    <li class="border-color-extra-medium-gray pt-5px pb-5px">Hari ini: <span
                            class="fw-600 text-dark-gray float-end">{{ $visitorStats['today'] }}</span></li>
                    <li class="border-color-extra-medium-gray pt-5px pb-5px">Kemarin: <span
                            class="fw-600 text-dark-gray float-end">{{ $visitorStats['yesterday'] }}</span></li>
                    <li class="border-color-extra-medium-gray pt-5px pb-5px">Bulan ini: <span
                            class="fw-600 text-dark-gray float-end">{{ $visitorStats['thisMonth'] }}</span></li>
                    <li class="border-color-extra-medium-gray pt-5px pb-5px">Total: <span
                            class="fw-600 text-dark-gray float-end">{{ $visitorStats['total'] }}</span></li>
                </ul>
            </div>
        </div>

        <div class="row justify-content-center align-items-center pt-7">
            <!-- start divider -->
            <div class="col-12">
                <div class="divider-style-03 divider-style-03-01 border-color-extra-medium-gray"></div>
            </div>
            <!-- end divider -->
            <!-- start copyright -->
            <div
                class="col-lg-5 pt-20px pb-20px md-pt-0 order-2 order-lg-1 text-center text-lg-start last-paragraph-no-margin fs-14">
                <p>&copy; {{ date('Y') }} {{ $general->site_name }}. Seluruh Hak Cipta Dilindungi.
                </p>
            </div>
            <!-- end copyright -->
        </div>
    </div>
</footer>
