@extends('layouts.main')
@section('main-container')

<div class="container-xl">

    {{-- HEADER --}}
    <div class="page-header d-print-none mb-3">
        <div class="row align-items-center">
            <div class="col">
                <h2 class="page-title">Watershed Details</h2>
            </div>
            <div class="col-auto">
                <a href="{{ route('watershed.general-information.index') }}" class="btn btn-secondary btn-sm">← Back</a>
                <a href="{{ route('watershed.general-information.edit', $watershed->id) }}" class="btn btn-warning btn-sm">✎ Edit</a>
                <a href="{{ route('watershed.download.pdf',$watershed->id) }}" class="btn btn-danger btn-sm">Download PDF</a>
            </div>
        </div>
    </div>

    {{-- MAIN CARD --}}
    <div class="card shadow-sm">

        <div class="card-header bg-success-lt">
            <h5 class="card-title">Watershed Overview</h5>
        </div>

        <div class="card-body p-3">

            {{-- BASIC INFO --}}
            <div class="card mb-3 bg-primary-lt">
                <div class="card-body p-3">
                    <h4 class="mb-2">Basic Info</h4>

                    <div class="row">
                        <div class="col-md-3">
                            <small class="text-muted">Name</small>
                            <div class="fs-5 fw-bold">{{ $watershed->watershed_name }}</div>
                        </div>

                        <div class="col-md-3">
                            <small class="text-muted">Code</small>
                            <div class="fs-5 fw-bold text-primary">{{ $watershed->watershed_code }}</div>
                        </div>

                        <div class="col-md-3">
                            <small class="text-muted">River Basin</small>
                            <div class="fw-bold">{{ $watershed->river_basin_system }}</div>
                        </div>

                        <div class="col-md-3">
                            <small class="text-muted">Status</small>
                            <div class="badge bg-success-lt text-success">
                                {{ $watershed->status ?? 'Active' }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            {{-- LOCATION --}}
            <div class="card mb-3 bg-light">
                <div class="card-body p-3">
                    <h4 class="mb-2">Location</h4>

                    <div class="row">
                        <div class="col-md-3">
                            <small>State</small>
                            <div class="fw-bold">{{ $watershed->state->name ?? '-' }}</div>
                        </div>

                        <div class="col-md-3">
                            <small>District</small>
                            <div class="fw-bold">{{ $watershed->district->name ?? '-' }}</div>
                        </div>

                        <div class="col-md-3">
                            <small>Block</small>
                            <div class="fw-bold">{{ $watershed->block->name ?? '-' }}</div>
                        </div>

                        <div class="col-md-3">
                            <small>Agro Zone</small>
                            <div class="fw-bold">{{ $watershed->agro_climatic_zone ?? '-' }}</div>
                        </div>
                    </div>
                </div>
            </div>

            {{-- COORDINATES --}}
            <div class="card mb-3 bg-info-lt">
                <div class="card-body p-3">
                    <h4 class="mb-2">Coordinates</h4>

                    <div class="row">
                        <div class="col-md-6">
                            <small>Latitude</small>
                            <div class="fw-bold">{{ $watershed->latitude ?? '-' }}</div>
                        </div>

                        <div class="col-md-6">
                            <small>Longitude</small>
                            <div class="fw-bold">{{ $watershed->longitude ?? '-' }}</div>
                        </div>
                    </div>
                </div>
            </div>

            {{-- ELEVATION --}}
            <div class="card mb-3 bg-light">
                <div class="card-body p-3">
                    <h4 class="mb-2">Elevation</h4>

                    <div class="row">
                        <div class="col-md-4">
                            <small>Highest</small>
                            <div class="fw-bold">{{ $watershed->highest_elevation_m }}</div>
                        </div>

                        <div class="col-md-4">
                            <small>Lowest</small>
                            <div class="fw-bold">{{ $watershed->lowest_elevation_m }}</div>
                        </div>

                        <div class="col-md-4">
                            <small>Difference</small>
                            <div class="fw-bold text-success">
                                {{ $watershed->height_difference_m }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>

            {{-- AREA --}}
            <div class="card bg-info-lt">
                <div class="card-body p-3">
                    <h4 class="mb-2">Area Details</h4>

                    <div class="row">
                        <div class="col-md-4">
                            <small>Total Area</small>
                            <div class="fw-bold text-primary">
                                {{ number_format($watershed->total_watershed_area_ha,2) }}
                            </div>
                        </div>

                        <div class="col-md-4">
                            <small>Treatable</small>
                            <div class="fw-bold text-success">
                                {{ number_format($watershed->total_treatable_area_ha,2) }}
                            </div>
                        </div>

                        <div class="col-md-4">
                            <small>Non-Treatable</small>
                            <div class="fw-bold text-danger">
                                {{ number_format($watershed->forest_uncultivable_area_ha,2) }}
                            </div>
                        </div>
                    </div>
                </div>
            </div>

        </div>
    </div>



<div class="card mt-3">
    <div class="card-header bg-green-lt">
        <h3 class="card-title">Watershed Maps</h3>
    </div>

    <div class="card-body p-2">

        @if($watershed->maps->isEmpty())
            <div class="alert alert-warning text-center mb-0">
                No maps uploaded
            </div>
        @else

        <div class="table-responsive">
            <table class="table table-hover table-striped table-bordered table-sm text-center align-middle">

                <thead class="table-light">
                    <tr>
                        <th>#</th>
                        <th>Map Type</th>
                        <th>Preview</th>
                        <th>Action</th>
                    </tr>
                </thead>

                <tbody>
                    @foreach($watershed->maps as $index => $map)

                 @php
                        $filePath = $map->map_uploaded ?? '';

                        // Proper URL (works with storage:link)
                        $fileUrl = $filePath ? asset('storage/' . ltrim($filePath, '/')) : '';

                        // Safe extension detection
                        $ext = $filePath ? strtolower(pathinfo($filePath, PATHINFO_EXTENSION)) : '';
                @endphp

                    <tr>

                        <td class="fw-bold">{{ $index + 1 }}</td>

                        {{-- MAP TYPE --}}
                        <td>
                            <span class="badge bg-blue-lt text-blue">
                                {{ ucfirst($map->map_type) }}
                            </span>
                        </td>

                        {{-- PREVIEW --}}
                        <td>
                            @if(in_array($ext, ['jpg','jpeg','png']))
                                <img src="{{ $fileUrl }}"
                                     class="img-thumbnail"
                                     style="height:60px;">
                            @elseif($ext === 'pdf')
                                <span class="badge bg-red-lt text-red">
                                    📄 PDF
                                </span>
                            @else
                                <span class="badge bg-secondary-lt">
                                    File
                                </span>
                            @endif
                        </td>

                        {{-- ACTION --}}
                        <td>
                            <a href="{{ $fileUrl }}"
                               target="_blank"
                               class="btn btn-sm btn-outline-primary">

                                👁 View
                            </a>

                            <a href="{{ $fileUrl }}"
                               download
                               class="btn btn-sm btn-outline-success ms-1">

                                ⬇ Download
                            </a>
                        </td>

                    </tr>
                    @endforeach
                </tbody>

            </table>
        </div>

        @endif

    </div>

</div>


<div class="card mt-3">
    <div class="card-header bg-primary-lt">
        <h5 class="card-title mb-0">1.3 Micro Watersheds</h5>
    </div>

    <div class="card-body p-2">

        @forelse($watershed->microWatersheds as $micro)

        <div class="card mb-3 shadow-sm">

            {{-- HEADER --}}
            <div class="card-header bg-azure-lt py-2">
                <div class="d-flex justify-content-between align-items-center">
                    <span class="fw-bold text-azure">
                        Micro Code: {{ $micro->micro_watershed_code }}
                    </span>
                </div>
            </div>

            <div class="card-body p-2">

                {{-- ================= LOCATIONS ================= --}}
                <div class="mb-3">
                    <h6 class="text-muted mb-2">Locations</h6>

                    <div class="table-responsive">
                        <table class="table table-sm table-bordered table-striped text-center">

                            <thead class="table-light">
                                <tr>
                                    <th>#</th>
                                    <th>Panchayat</th>
                                    <th>Village</th>
                                </tr>
                            </thead>

                            <tbody>
                                @forelse($micro->locations as $index => $loc)
                                <tr>
                                    <td class="fw-bold">{{ $index + 1 }}</td>
                                    <td>{{ $loc->panchayat->name ?? '-' }}</td>
                                    <td>{{ $loc->village->name ?? '-' }}</td>
                                </tr>
                                @empty
                                <tr>
                                    <td colspan="3" class="text-muted">No locations found</td>
                                </tr>
                                @endforelse
                            </tbody>

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

                {{-- ================= LULC ================= --}}
                <div>
                    <h6 class="text-muted mb-2">Land Use (LULC)</h6>

                    <div class="table-responsive">
                        <table class="table table-sm table-hover table-striped table-bordered text-center">

                            <thead class="table-light">
                                <tr>
                                    <th>Category</th>
                                    <th width="150">Area</th>
                                    <th width="120">%</th>
                                </tr>
                            </thead>

                            <tbody>
                                @forelse($micro->microWatershedLulcs as $lulc)
                                <tr>
                                    <td class="fw-bold">
                                        {{ $lulc->lulcCategory->category_name ?? '-' }}
                                    </td>

                                    <td class="text-primary fw-bold">
                                        {{ number_format($lulc->area, 2) }}
                                    </td>

                                    <td>
                                        {{ number_format($lulc->area_percentage, 2) }} %
                                    </td>
                                </tr>
                                @empty
                                <tr>
                                    <td colspan="3" class="text-muted">
                                        No LULC data available
                                    </td>
                                </tr>
                                @endforelse
                            </tbody>

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

            </div>
        </div>

        @empty
            <div class="alert alert-warning text-center mb-0">
                No Micro Watershed data available
            </div>
        @endforelse

    </div>
</div>

    {{-- RAINFALL --}}
    <div class="card mt-3">
        <div class="card-header bg-blue-lt">
            <h3 class="card-title">Rainfall Data</h3>
        </div>

        <div class="card-body p-2">

            @if($rainfall->isEmpty())
                <div class="alert alert-warning text-center mb-0">
                    No rainfall data available
                </div>
            @else

            <div class="table-responsive">
                <table class="table table-hover table-striped table-bordered table-sm text-center">

                    <thead class="bg-light">
                        <tr>
                            <th>Year</th>
                            <th>Rainfall (mm)</th>
                            <th>Source</th>
                        </tr>
                    </thead>

                    <tbody>
                        @foreach($rainfall as $row)
                        <tr>
                            <td class="fw-bold">{{ $row->year->name ?? '-' }}</td>
                            <td class="text-primary fw-bold">{{ $row->rainfall_mm }}</td>
                            <td>{{ $row->data_source }}</td>
                        </tr>
                        @endforeach
                    </tbody>

                </table>
            </div>




            {{-- CLIMATIC DATA --}}
<div class="card mt-3">
    <div class="card-header bg-indigo-lt">
        <h3 class="card-title">Climatic Data</h3>
    </div>

    <div class="card-body p-3">

        @if(!$climaticData)
            <div class="alert alert-warning text-center mb-0">
                No climatic data available
            </div>
        @else

        {{-- BASIC INFO --}}
        <div class="row mb-3">
            <div class="col-md-4">
                <small>Nearest Station</small>
                <div class="fw-bold">
                    {{ $climaticData->nearest_meteorological_station }}
                </div>
            </div>

            <div class="col-md-4">
                <small>Distance (km)</small>
                <div class="fw-bold">
                    {{ $climaticData->distance_from_project_site_km }}
                </div>
            </div>

            <div class="col-md-4">
                <small>Annual Rainfall</small>
                <div class="fw-bold text-primary">
                    {{ $climaticData->normal_annual_rainfall_mm }} mm
                </div>
            </div>









<div class="col-md-4">
    <small>Highest Rainfall Intensity (mm/hr, 10-year)</small>
    <div class="fw-bold text-primary">
        {{ $climaticData->highest_rainfall_intensity_per_hr_10yr_mm }} mm
    </div>
</div>

<div class="col-md-4">
    <small>Highest Rainfall in 24 Hours (mm, 10-year)</small>
    <div class="fw-bold text-primary">
        {{ $climaticData->highest_rainfall_24hr_10yr_mm }} mm
    </div>
</div>

<div class="col-md-4">
    <small>Maximum Humidity (%)</small>
    <div class="fw-bold text-primary">
        {{ $climaticData->max_humidity_percent }} %
    </div>
</div>

<div class="col-md-4">
    <small>Minimum Humidity (%)</small>
    <div class="fw-bold text-primary">
        {{ $climaticData->min_humidity_percent }} %
    </div>
</div>

<div class="col-md-4">
    <small>Average Humidity (%)</small>
    <div class="fw-bold text-primary">
        {{ $climaticData->avg_humidity_percent }} %
    </div>
</div>

<div class="col-md-4">
    <small>Data Source</small>
    <div class="fw-bold text-primary">
        {{ $climaticData->data_source }}
    </div>
</div>
      
      


            
        </div>

        {{-- YEAR TEMP --}}
        <h5 class="mt-3">Year-wise Temperature</h5>

        <table class="table table-bordered text-center">
            <thead>
                <tr>
                    <th>Year</th>
                    <th>Max Temp</th>
                    <th>Min Temp</th>
                </tr>
            </thead>
            <tbody>
                @foreach($climaticData->yearWiseTemperatures as $yt)
                <tr>
                    <td>{{ $yt->year->name ?? '-' }}</td>
                    <td>{{ $yt->max_temperature }}</td>
                    <td>{{ $yt->min_temperature }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>

        {{-- HUMIDITY --}}
        <h5 class="mt-3">Monthly Humidity</h5>

        <table class="table table-bordered text-center">
            <thead>
                <tr>
                    <th>Month</th>
                    <th>Humidity (%)</th>
                </tr>
            </thead>
            <tbody>
                @foreach($climaticData->monthlyHumidities as $h)
                <tr>
                    <td>{{ $h->month }}</td>
                    <td>{{ $h->humidity }}</td>
                </tr>
                @endforeach
            </tbody>
        </table>

        {{-- AVG HUMIDITY --}}
        <div class="row mt-3">
            <div class="col-md-4">
                <small>Max Humidity</small>
                <div class="fw-bold text-danger">
                    {{ $climaticData->max_humidity_percent }}
                </div>
            </div>

            <div class="col-md-4">
                <small>Min Humidity</small>
                <div class="fw-bold text-primary">
                    {{ $climaticData->min_humidity_percent }}
                </div>
            </div>

            <div class="col-md-4">
                <small>Average</small>
                <div class="fw-bold text-success">
                    {{ $climaticData->avg_humidity_percent }}
                </div>
            </div>
        </div>

        @endif

    </div>
</div>
            @endif

        </div>
    </div>

</div>

@endsection