@extends('admin.layouts.app')
@section('title', isset($landmark) ? 'Edit Landmark' : 'Add Landmark')
@section('breadcrumb')
    <a href="{{ route('admin.spatial.index') }}">Spatial Intelligence</a>
    <span class="separator">/</span>
    <a href="{{ route('admin.spatial.landmarks') }}">Landmarks</a>
    <span class="separator">/</span>
    <span class="current">{{ isset($landmark) ? 'Edit' : 'Add' }}</span>
@endsection

@section('content')
<div class="page-header">
    <h1 class="page-title">
        <span class="title-icon"><i data-lucide="map-pin" style="width:20px;height:20px;"></i></span>
        {{ isset($landmark) ? 'Edit Landmark' : 'Add Landmark' }}
    </h1>
    <p class="page-subtitle">Configure a proximity landmark with GPS coordinates</p>
</div>

<div style="max-width:720px;">
    <div class="glass-card" style="padding:24px;">
        @if($errors->any())
            <div class="alert alert-error">
                <i data-lucide="alert-circle" class="alert-icon" style="width:15px;height:15px;"></i>
                <div>@foreach($errors->all() as $err)<div>{{ $err }}</div>@endforeach</div>
            </div>
        @endif

        <form method="POST" action="{{ isset($landmark) ? route('admin.spatial.landmarks.update', $landmark) : route('admin.spatial.landmarks.store') }}">
            @csrf
            @if(isset($landmark)) @method('PUT') @endif

            <div style="display:grid;grid-template-columns:1fr 1fr;gap:16px;">
                <div class="form-group" style="grid-column:1/-1;">
                    <label class="form-label">Landmark Name</label>
                    <input type="text" name="name" value="{{ old('name', $landmark->name ?? '') }}"
                           class="form-control" placeholder="e.g., Andheri Metro Station" required>
                </div>

                <div class="form-group">
                    <label class="form-label">State</label>
                    <select name="state_id" class="form-control" required>
                        <option value="">Select State</option>
                        @foreach($states as $state)
                            <option value="{{ $state->id }}"
                                {{ old('state_id', $landmark->state_id ?? '') == $state->id ? 'selected' : '' }}>
                                {{ $state->name }}
                            </option>
                        @endforeach
                    </select>
                </div>

                <div class="form-group">
                    <label class="form-label">City (Optional)</label>
                    <select name="city_id" class="form-control">
                        <option value="">— No specific city —</option>
                        @foreach($cities as $city)
                            <option value="{{ $city->id }}"
                                {{ old('city_id', $landmark->city_id ?? '') == $city->id ? 'selected' : '' }}>
                                {{ $city->name }}
                            </option>
                        @endforeach
                    </select>
                </div>

                <div class="form-group">
                    <label class="form-label">Landmark Type</label>
                    <select name="landmark_type" class="form-control" required>
                        @foreach(['metro_station'=>'Metro Station','railway_station'=>'Railway Station','highway'=>'Highway','airport'=>'Airport','hospital'=>'Hospital','school'=>'School','shopping_center'=>'Shopping Center','business_district'=>'Business District','water_body'=>'Water Body','industrial_zone'=>'Industrial Zone'] as $val => $label)
                            <option value="{{ $val }}"
                                {{ old('landmark_type', $landmark->landmark_type ?? '') == $val ? 'selected' : '' }}>
                                {{ $label }}
                            </option>
                        @endforeach
                    </select>
                </div>

                <div class="form-group">
                    <label class="form-label">Data Source</label>
                    <input type="text" name="data_source" value="{{ old('data_source', $landmark->data_source ?? '') }}"
                           class="form-control" placeholder="e.g., Google Maps API">
                </div>

                <div class="form-group">
                    <label class="form-label">Latitude <span style="color:#ff6b6b;">*</span></label>
                    <input type="number" name="latitude" value="{{ old('latitude', '') }}"
                           class="form-control" placeholder="e.g., 19.1197" step="0.000001" min="-90" max="90" required>
                </div>

                <div class="form-group">
                    <label class="form-label">Longitude <span style="color:#ff6b6b;">*</span></label>
                    <input type="number" name="longitude" value="{{ old('longitude', '') }}"
                           class="form-control" placeholder="e.g., 72.8464" step="0.000001" min="-180" max="180" required>
                </div>

                <div class="form-group" style="grid-column:1/-1;">
                    <label class="form-label">Description</label>
                    <textarea name="description" rows="2" class="form-control"
                              placeholder="Additional information about this landmark...">{{ old('description', $landmark->description ?? '') }}</textarea>
                </div>

                <div class="form-group" style="grid-column:1/-1;">
                    <label style="display:flex;align-items:center;gap:8px;cursor:pointer;font-size:13px;color:var(--vsc-text-primary);">
                        <input type="checkbox" name="is_active" value="1"
                               {{ old('is_active', $landmark->is_active ?? 1) ? 'checked' : '' }}
                               style="accent-color:var(--vsc-blue);">
                        Landmark is Active
                    </label>
                </div>
            </div>

            <div class="divider"></div>
            <div style="display:flex;gap:10px;justify-content:flex-end;">
                <a href="{{ route('admin.spatial.landmarks') }}" class="btn btn-secondary">
                    <i data-lucide="x" style="width:13px;height:13px;"></i> Cancel
                </a>
                <button type="submit" class="btn btn-primary">
                    <i data-lucide="save" style="width:13px;height:13px;"></i>
                    {{ isset($landmark) ? 'Save Changes' : 'Add Landmark' }}
                </button>
            </div>
        </form>
    </div>
</div>
@endsection