@extends('user_layout.app')

@section('content')
<div class="container py-5" style="margin-top: 42px;">

    <h2 class="mb-4 text-center">
        {{ $propertyType->name }} Properties
    </h2>

    @if($properties->count() == 0)
        <p class="text-center">No properties available.</p>
    @endif

    <div class="row">
        @foreach($properties as $property)
        <div class="col-md-4 mb-4">
            <div class="card h-100 shadow-sm">

                {{-- Property Image --}}
                @if($property->images && count($property->images) > 0)
                    <img src="{{ asset('uploads/properties/'.$property->images[0]) }}"
                         class="card-img-top"
                         style="height:220px; object-fit:cover; border-radius: 4px;">
                @else
                    <img src="{{ asset('images/no-image.png') }}"
                         class="card-img-top"
                         style="height:220px; object-fit:cover;">
                @endif

                <div class="card-body">
                    <h5 class="card-title">{{ $property->title }}</h5>
                    <p class="mb-1"><strong>₹ {{ number_format($property->price) }}</strong></p>
                    <p class="text-muted">{{ $property->location }}</p>

                    <a href="{{ url('/property/'.$property->slug) }}"
                       class="btn btn-gold btn-sm">
                        View Details
                    </a>
                </div>

            </div>
        </div>
        @endforeach
    </div>

</div>



@endsection