@extends('layouts.app')

@section('content')
<div class="container mx-auto px-4 py-6">
    <h1 class="text-2xl font-bold mb-4">Service Details</h1>
    <div class="bg-white p-6 rounded-lg shadow">
        <p><strong>ID:</strong> {{ $service->id }}</p>
        <p><strong>Name:</strong> {{ $service->name }}</p>
        <p><strong>Description:</strong> {{ $service->description ?? 'N/A' }}</p>
        <p><strong>Cost Range:</strong> 
            {{ preg_replace('/\[(\d+\.?\d*),\s*(\d+\.?\d*)\]/', '$1 - $2', $service->cost) }}
        </p>
        <p><strong>Need Days:</strong> {{ $service->need_days }}</p>
        <p><strong>Created At:</strong> {{ $service->created_at }}</p>
        <p><strong>Updated At:</strong> {{ $service->updated_at ?? 'N/A' }}</p>
        <a href="{{ route('services.index') }}" class="text-blue-500 mt-4 inline-block">Back to List</a>
    </div>
</div>
@endsection