@extends('layouts.app')

@section('title', 'Advanced Laboratories - ' . $siteContext->name)

@section('content')
    <!-- breadcrumb -->
    <div class="site-breadcrumb" style="background-image: url('{{ asset('assets/img/breadcrumb/breadcrumb.jpg') }}'); background-size: cover; background-position: center; padding: 80px 0;">
        <div class="container text-center text-white">
            <h2 class="breadcrumb-title text-white">Advanced Laboratories</h2>
            <ul class="breadcrumb-menu d-flex justify-content-center list-unstyled gap-2 mt-2">
                <li><a href="{{ route('home') }}" class="text-white">Home</a></li>
                <li class="text-white">/</li>
                <li><a href="{{ route('facilities.index') }}" class="text-white">Facilities</a></li>
                <li class="text-white">/</li>
                <li class="active text-white">Laboratories</li>
            </ul>
        </div>
    </div>
    <!-- breadcrumb end -->

    <!-- laboratories section -->
    <div class="facilities-detail py-120">
        <div class="container">
            <!-- Science Labs -->
            <div class="row align-items-center g-5 mb-5 pb-5 border-bottom">
                <div class="col-lg-6">
                    <div class="detail-content">
                        <span class="site-title-tagline"><i class="far fa-book-open-reader"></i> Experimental Science</span>
                        <h2 class="site-title mb-4">Science <span>Laboratories</span></h2>
                        <p class="text-justify mb-3">
                            Physics, Chemistry, and Biology are subjects best understood through experimental validation. We feature advanced and high-technology labs built specifically for practical evaluations.
                        </p>
                        <p class="text-justify mb-4">
                            Our laboratories are fully equipped with safety components, modern measurement apparatuses, compounds, microscopes, and skeletal models. Under the direct supervision of experienced laboratory instructors, students are guided to perform experiments, catalog findings, and integrate theoretical knowledge with real-world results.
                        </p>
                        
                        <div class="row g-3">
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Specialized Physics setups</span>
                            </div>
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Fully stocked Chemistry lab</span>
                            </div>
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Biological models & microscopes</span>
                            </div>
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Trained instructors & safety gear</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="image-box rounded shadow-lg overflow-hidden border">
                        <img src="{{ asset('wp-content/uploads/2021/06/Sciencelab9.jpg') }}" alt="Advanced Science Laboratory" class="img-fluid w-100">
                    </div>
                </div>
            </div>

            <!-- Computer Labs -->
            <div class="row align-items-center g-5 mb-5 pb-5 border-bottom">
                <div class="col-lg-6 order-lg-2">
                    <div class="detail-content">
                        <span class="site-title-tagline"><i class="far fa-book-open-reader"></i> Digital Competence</span>
                        <h2 class="site-title mb-4">Computer & <span>IT Labs</span></h2>
                        <p class="text-justify mb-3">
                            In this modern era of information technology, digital literacy is a core requirement. We maintain fully updated computer terminals linked to high-speed internet.
                        </p>
                        <p class="text-justify mb-4">
                            Students use the IT labs to complete web assignments, practice computer programming (Python, C, HTML/CSS), draft reports, and consult digital resources. All screens are connected through a localized server monitoring mechanism to ensure student productivity.
                        </p>
                        
                        <div class="row g-3">
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> High-speed broadband terminals</span>
                            </div>
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Core coding tools installed</span>
                            </div>
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Safe web firewall browsing</span>
                            </div>
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Individual computer allotments</span>
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="col-lg-6 order-lg-1">
                    <div class="image-box rounded shadow-lg overflow-hidden border">
                        <img src="{{ asset('wp-content/uploads/2021/06/ComLab.jpg') }}" alt="Hygienic Computer Lab" class="img-fluid w-100">
                    </div>
                </div>
            </div>

            <!-- Mathematics & Social Studies Labs -->
            <div class="row align-items-center g-5 pt-5">
                <div class="col-lg-6">
                    <div class="detail-content">
                        <span class="site-title-tagline"><i class="far fa-book-open-reader"></i> Creative Solutions</span>
                        <h2 class="site-title mb-4">Math & <span>Social Labs</span></h2>
                        <p class="text-justify mb-3">
                            To meet the demands of the modern curriculum, we have established a dedicated Mathematics and Social Studies Lab with plentiful resources.
                        </p>
                        <p class="text-justify mb-4">
                            In this department, math formulas, geometrical models, map indicators, and historical logs are explored visually. Students work together on projects that boost geographic skills, spatial mapping, and numeric reasoning, turning theoretical equations into relatable, real-life solutions.
                        </p>
                        
                        <div class="row g-3">
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Geometric & spatial models</span>
                            </div>
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Social project display areas</span>
                            </div>
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Maps, globes, & historical logs</span>
                            </div>
                            <div class="col-6">
                                <span class="d-flex align-items-center gap-2 small text-muted"><i class="far fa-circle-check text-primary"></i> Collaborative group layout</span>
                            </div>
                        </div>
                    </div>
                </div>
                <div class="col-lg-6">
                    <div class="image-box rounded shadow-lg overflow-hidden border">
                        <img src="{{ asset('wp-content/uploads/2021/06/MathLab.jpg') }}" alt="Mathematics & Social Lab" class="img-fluid w-100">
                    </div>
                </div>
            </div>

            <!-- CTA block -->
            <div class="row mt-5 pt-5">
                <div class="col-12">
                    <div class="card border-0 shadow-sm p-4 bg-light text-center border rounded">
                        <h4 class="fw-bold mb-2">Want to check our labs in person?</h4>
                        <p class="text-muted small mb-4">Schedule a campus tour or request admission information today.</p>
                        <div class="d-flex justify-content-center gap-3">
                            <a href="{{ route('contact') }}" class="theme-btn">Request Campus Visit <i class="fas fa-arrow-right-long"></i></a>
                            <a href="{{ route('facilities.index') }}" class="theme-btn theme-btn2">All Facilities <i class="fas fa-arrow-right-long"></i></a>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
@endsection