@section('title', 'Good Health 3| GIU')
@extends('front.new.layouts.app')
<style>
    .main-title {
        text-align: center;
        font-weight: 700;
        color: #009933;
        margin-bottom: 40px;
    }


    .box {
        max-width: 700px;
        margin: 0 auto 30px auto;
        padding: 25px 30px;
        border: 1px solid #e6e6e6;
        border-radius: 12px;
        background: #fff;
        text-align: center;
        transition: 0.25s;
    }

    .box:hover {
        box-shadow: 0 8px 24px rgba(0,153,51,0.12);
        transform: translateY(-3px);
    }

    .section-title {
        font-size: 22px;
        font-weight: 600;
        color: #009933;
        margin-bottom: 20px;
    }

    .link-item {
        display: block;
        padding: 10px;
        color: #000;
        font-weight: 500;
        text-decoration: none;
        border-bottom: 1px solid #f4f4f4;
        transition: 0.2s;
    }

    .link-item:last-child {
        border-bottom: none;
    }

    .link-item:hover {
        color: #009933;
        padding-left: 5px;
    }
</style>
@section('content')
    {{-- Bnanner--}}
    <div id="carouselExampleIndicators" class="carousel slide banner-margin-top" data-bs-ride="carousel" data-bs-interval="3000">
        <div class="carousel-inner">
            <div class="carousel-item active">
                <img src="{{ asset('front/new/img/sdgs/banners/good-health.png') }}" class="d-block w-100" alt="First slide">
            </div>
        </div>

    </div>
    <div class="container py-5">

        <!-- MAIN TITLE -->
        <h2 class="main-title">
            Collaborations and Health Services
        </h2>

        <!-- SINGLE BOX -->
        <div class="box">
            <div class="section-title">Health Services and Collaborations</div>

            <a href="{{ route('health.current_collaborations') }}" class="link-item">
                Current collaborations with health institutions
            </a>
            <a href="{{ route('health.outreach_programmes') }}" class="link-item">
                Health outreach programmes
            </a>
            <a href="{{ route('health.shared_sports') }}" class="link-item">
                Shared sports facilities
            </a>
            <a href="{{ route('health.sexual_reproductive') }}" class="link-item">
                Sexual and reproductive health care services for students
            </a>
            <a href="{{ route('health.mental_students') }}" class="link-item">
                Mental health support for students
            </a>
            <a href="{{ route('health.smoke_free') }}" class="link-item">
                Smoke-free policy
            </a>
            <a href="{{ route('health.mental_staff') }}" class="link-item">
                Mental health support for staff
            </a>
        </div>
        <!-- BOX 4 -->
        <div class="box">
            <div class="section-title">External SDG-AUDIT Report 2024</div>

            <a href="{{ route('external-sdg-audit-report-2024-3') }}" class="link-item">
                External SDG Audit Report
            </a>
        </div>


    </div>
@endsection
@push('js')
@endpush