@extends('user.layouts.app-newui')

@section('content')
 
<div class="main-card text-center">
    <h1 class="text-center mb-5 page_title">Webinar Session</h1>
 
    <p class="text-muted mx-auto mb-5 col-10 col-md-10 col-lg-10">
        This page is your space to explore, register for, and join upcoming live webinars designed exclusively for J-1 Interns & Trainees.
Here, you will find a regularly updated list of interactive sessions covering key topics. Each webinar is designed to support your program journey, answer your questions, and help you make the most of your experience.
    </p>
 
    <p class="text-muted mx-auto mb-5 col-10 col-md-10 col-lg-10">
        We encourage you to check this page frequently and register early for sessions that interest you. Participation is highly recommended, as these webinars provide valuable insights and opportunities to engage directly with our experts and fellow participants. We look forward to seeing you in our upcoming sessions!
    </p>
    
    <div class="container my-4">
        <div class="row g-4">

            <!-- Card 1 -->
            <div class="col-12 col-md-6">
                <div class="card h-100 border-0 shadow content-card">
                    <div class="card-body d-flex flex-column">

                        <span class="badge bg-success mb-3 align-self-start">Live Session</span>

                        <h4 class="mb-3 page_sub_title">
                            J-1 Visa Program – Complete Overview
                        </h4>

                        <p class="text-muted">
                            Get a complete walkthrough of the J-1 program, requirements, and next steps.
                        </p>

                        <div class="mb-4">
                            <div class="text-muted"><strong>Date:</strong> Oct 10, 2026</div>
                            <div class="text-muted"><strong>Time:</strong> 10:00 AM (EST)</div>
                            <div class="text-muted"><strong>Duration:</strong> 60 minutes</div>
                        </div>

                        <a href="#" class="btn btn-info align-self-center align-self-start text-center">
                            Register on Zoom
                        </a>

                    </div>
                </div>
            </div>

            <!-- Card 2 -->
            <div class="col-12 col-md-6">
                <div class="card h-100 border-0 shadow content-card">
                    <div class="card-body d-flex flex-column">
                        
                        <span class="badge bg-primary mb-3 align-self-start">Upcoming</span>

                        <h4 class="mb-3">
                            Visa Interview Preparation
                        </h4>

                        <p class="text-muted">
                            Learn how to prepare for your visa interview with tips and common questions.
                        </p>

                        <div class="mb-4">
                            <div class="text-muted"><strong>Date:</strong> Oct 15, 2026</div>
                            <div class="text-muted"><strong>Time:</strong> 2:00 PM (EST)</div>
                            <div class="text-muted"><strong>Duration:</strong> 45 minutes</div>
                        </div>

                        <a href="#" class="btn btn-info align-self-center align-self-start text-center">
                            Register on Zoom
                        </a>

                    </div>
                </div>
            </div> 
        </div>
    </div>
    <div class="container my-4">
        <div class="row g-4">

            <!-- Card 1 -->
            <div class="col-12 col-md-6">
                <div class="card h-100 border-0 shadow content-card">
                    <div class="card-body d-flex flex-column">

                        <span class="badge bg-success mb-3 align-self-start">Live Session</span>

                        <h4 class="mb-3">
                            J-1 Visa Program – Complete Overview
                        </h4>

                        <p class="text-muted">
                            Get a complete walkthrough of the J-1 program, requirements, and next steps.
                        </p>

                        <div class="mb-4">
                            <div class="text-muted"><strong>Date:</strong> Oct 10, 2026</div>
                            <div class="text-muted"><strong>Time:</strong> 10:00 AM (EST)</div>
                            <div class="text-muted"><strong>Duration:</strong> 60 minutes</div>
                        </div>

                        <a href="#" class="btn btn-info align-self-center align-self-start text-center">
                            Register on Zoom
                        </a>

                    </div>
                </div>
            </div>

            <!-- Card 2 -->
            <div class="col-12 col-md-6">
                <div class="card h-100 border-0 shadow content-card">
                    <div class="card-body d-flex flex-column">
                        
                        <span class="badge bg-primary mb-3 align-self-start">Upcoming</span>

                        <h4 class="mb-3">
                            Visa Interview Preparation
                        </h4>

                        <p class="text-muted">
                            Learn how to prepare for your visa interview with tips and common questions.
                        </p>

                        <div class="mb-4">
                            <div class="text-muted"><strong>Date:</strong> Oct 15, 2026</div>
                            <div class="text-muted"><strong>Time:</strong> 2:00 PM (EST)</div>
                            <div class="text-muted"><strong>Duration:</strong> 45 minutes</div>
                        </div>

                        <a href="#" class="btn btn-info align-self-center align-self-start text-center">
                            Register on Zoom
                        </a>

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