@extends('layouts.main')
@section('title', 'Continue on mobile app')
@section('main')
<style>
    @media (max-width: 767px) {
        .image-section-container {
            display: none;
        }
    }
</style>

<section class="our-register">
    <div class="container">
        <div class="row wow fadeInRight" data-wow-delay="300ms">
            
            <!-- Left Image Section -->
            <div class="col-lg-6 image-section-container">
                <div class="image-section">
                    <img src="{{ asset('images/background/login.png') }}" 
                         alt="Welcome Image" 
                         loading="lazy" 
                         style="width: 100%; border-radius: 8px;">
                </div>
            </div>

            <!-- Right Livewire Component -->
            <div class="col-lg-6">
                @livewire('download-screen')
            </div>

        </div>
    </div>
</section>
@endsection