{{-- <div class="bg-[conic-gradient(at_bottom_left,_var(--tw-gradient-stops))] from-slate-300 via-fuchsia-400 to-slate-700"> --}}
<div class="bg-gradient-to-b from-sky-50 to-sky-200  dark:from-slate-400 dark:to-slate-800 dark:bg-opacity-10">
{{-- <div class="bg-gradient-to-tr from-violet-500 to-orange-300"> --}}
{{-- <div class="bg-gradient-to-r from-sky-400 via-sky-300 to-sky-400"> --}}
    <div class="grid grid-col-1 md:grid-cols-2 p-10 items-center container mx-auto">
        <div class="text-center mb-10 md:mb-0">
            <h2 class="text-4xl text-white">Now Job in Your Fingertips</h2>
            <h4 class="py-10 text-xl text-color2-400">The Job Shubharambh (OPC) Private Limited Job Portal Mobile
                Application</h4>
                {{-- https://play.google.com/store/apps/details?id=com.in.shubharambha --}}
            <a href="https://jobshubharambh.com/jobshubharambh.apk"
                class="bg-slate-200 shadow-md rounded p-3 text-white text-xl opacity-50 hover:opacity-75 transition-all duration-500"
                target="_blank">
                <span class="text-color2-800 uppercase text-sm font-medium">
                    <i class="fa fa-download"></i>
                    Instant Download
                </span>
            </a>
            {{-- <div class="my-1 text-color2-400 flex justify-center">
            or scan</div>
            <div class="mb-5 flex justify-center">
                <br />
                <img src="{{ URL::asset('images/mobile-app-qr-code.png') }}" alt="Jobshubharambh.com App QR Code" width="150" height="150">
            </div>
            <form action="" method="get" target="_blank" id="frmMobile" class="hidden md:block">

                <x-label class="text-xl text-white">Get Link On Whatsapp</x-label>
                <label class="text-color2-400">Enter your moblie number</label>
                <div class="relative w-full md:w-1/2 lg:w-1/3 mx-auto mt-2">
                    <x-input class="bg-opacity-50 text-color2-800 placeholder:text-white" placeholder="8797579987" name="mobile" id="mobile" required></x-input>
                        <button type="submit" id="btnMobile"
                        class="absolute bottom-0 right-0 p-2 text-sm font-medium text-color2-800 bg-blue-100 rounded-r-lg border border-blue-100 ">
                        Send
                    </button>
                </div>
            </form> --}}
        </div>
        <div class="flex gap-5 mx-auto items-center">
            <div class="">
                <img src="{{ URL::asset('images/mobile.png') }}" alt="" width="250" loading="lazy">
            </div>
            @if (isset($banner300x600))
            <div class="flex justify-center pt-5">
                <a href="{{ $banner300x600->url }}" target="_blank" rel="noopener noreferrer">
                    <img src="{{ Storage::url($banner300x600->image) }}" alt="">
                </a>
            </div>
        @endif

        </div>
    </div>
</div>
{{-- </div> --}}
@push('custom-scripts')
    <script type="module">
        $(document).ready(function() {
            $('#btnMobile').click(function(){
                event.preventDefault()
                // alert("hi");
    var mobile ="91"+$('#mobile').val();
    if(mobile.length<11){
        alert('Please enter correct mobile number of 10 digits only.');
        return;
    }
    // var mobile ="919810012395";
    // var text ="Namaste";
    var text ="Namaste%20Please%20click%20the%20link%20to%20download%20the%20jobshubharambh%20app%20https%3A%2F%2Fplay.google.com%2Fstore%2Fapps%2Fdetails%3Fid%3Dcom.in.shubharambha";
    window.open('https://wa.me/'+mobile+'?text='+text, '_blank');
//    $('#frmMobile').attr('action', 'https://wa.me/'+mobile+'?text='+text);
//    $('#frmMobile').submit();
});
// function submitForm(){
// }
        });
    </script>
@endpush