@extends('dashboard.layouts.app')

@section('title', 'Dashboard')

@section('content')
<div class="row">
    <div class="col-12">
        <div class="card">
            <div class="card-header">
                <h5 class="mb-0">Dashboard</h5>
            </div>
            <div class="card-body">
                <div class="row">
                    <div class="col-md-3 mb-4">
                        <div class="card bg-primary text-white">
                            <div class="card-body">
                                <div class="d-flex justify-content-between">
                                    <div>
                                        <h4 class="card-title">Data Jalan</h4>
                                        <p class="card-text">Kelola data jalan</p>
                                    </div>
                                    <div class="align-self-center">
                                        <i class="bi bi-signpost fs-1"></i>
                                    </div>
                                </div>
                                <a href="{{ route('jalan.index') }}" class="btn btn-light">Lihat Data</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 mb-4">
                        <div class="card bg-success text-white">
                            <div class="card-body">
                                <div class="d-flex justify-content-between">
                                    <div>
                                        <h4 class="card-title">Data Drainase</h4>
                                        <p class="card-text">Kelola data drainase</p>
                                    </div>
                                    <div class="align-self-center">
                                        <i class="bi bi-water fs-1"></i>
                                    </div>
                                </div>
                                <a href="#" class="btn btn-light">Lihat Data</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 mb-4">
                        <div class="card bg-info text-white">
                            <div class="card-body">
                                <div class="d-flex justify-content-between">
                                    <div>
                                        <h4 class="card-title">Data Sekolah</h4>
                                        <p class="card-text">Kelola data sekolah</p>
                                    </div>
                                    <div class="align-self-center">
                                        <i class="bi bi-building fs-1"></i>
                                    </div>
                                </div>
                                <a href="#" class="btn btn-light">Lihat Data</a>
                            </div>
                        </div>
                    </div>
                    <div class="col-md-3 mb-4">
                        <div class="card bg-warning text-white">
                            <div class="card-body">
                                <div class="d-flex justify-content-between">
                                    <div>
                                        <h4 class="card-title">Peta</h4>
                                        <p class="card-text">Lihat peta interaktif</p>
                                    </div>
                                    <div class="align-self-center">
                                        <i class="bi bi-map fs-1"></i>
                                    </div>
                                </div>
                                <a href="#" class="btn btn-light">Lihat Peta</a>
                            </div>
                        </div>
                    </div>
                </div>

                <div class="row mt-4">
                    <div class="col-12">
                        <div class="card">
                            <div class="card-header">
                                <h5 class="mb-0">Selamat Datang</h5>
                            </div>
                            <div class="card-body">
                                <p class="lead">Selamat datang di Dashboard Bupati Sidoarjo!</p>
                                <p>Anda dapat mengelola berbagai data infrastruktur melalui menu di sidebar.</p>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
@endsection