@extends('layouts.app')

@section('content')
<!-- Wrapper -->
<div class="flex flex-col justify-start items-center relative z-0 pt-12 space-y-8 overflow-hidden">

    <!-- Foreground Content (Message Container) -->
    <div class="w-full max-w-3xl px-4 relative z-0">
        <div class="bg-white dark:bg-gray-700 rounded-lg shadow-lg p-10 backdrop-blur-sm bg-opacity-90 dark:bg-opacity-90 text-center">
            <h1 class="text-4xl font-bold text-gray-800 dark:text-white mb-6">
                Welcome to Faisal Veterinary Store Admin Panel!
            </h1>
            <p class="text-lg text-gray-600 dark:text-gray-300">
                Manage your Veterinary Store POS system easily from this dashboard.<br>
                Select a section from the sidebar to get started.
            </p>
        </div>
    </div>

    <!-- Background Images Container -->
    <div class="w-full flex flex-col sm:flex-row relative z-0">
        <!-- Top or Left Background -->
        <div class="w-full sm:w-1/2 h-64 bg-cover bg-center" style="background-image: url('{{ asset('images/logo.png') }}'); height:21rem;"></div>

        <!-- Bottom or Right Background -->
        <div class="w-full sm:w-1/2 h-64 bg-cover bg-center" style="background-image: url('{{ asset('images/logo2.jpg') }}'); height:21rem;"></div>
    </div>

</div>
@endsection