@extends('layouts.app') @section('title',($product->seo_title?:$product->name)) @section('description',$product->seo_description?:$product->short_description) @section('content')<div class="mx-auto max-w-7xl px-4 py-10"><div class="grid gap-10 md:grid-cols-2"><div class="card flex aspect-video items-center justify-center text-8xl text-slate-200">◫</div><div><div class="mb-2 text-sm text-slate-500">SKU: {{ $product->sku }} · {{ $product->categories->pluck('name')->join(', ') }}</div><h1 class="text-4xl font-black">{{ $product->name }}</h1><p class="mt-4 text-slate-600">{{ $product->short_description }}</p><div class="my-6 text-3xl font-black">₹{{ number_format($product->price(),2) }}</div><form method="POST" action="{{ route('cart.add',$product) }}" class="space-y-4">@csrf@if($product->variations->count())<div><label class="mb-2 block font-bold">Choose version</label><select name="variation_id" class="input">@foreach($product->variations as $v)<option value="{{ $v->id }}">{{ $v->name }} — ₹{{ number_format($v->price(),2) }}</option>@endforeach</select></div>@endif@if($product->additionalServices->count())<div><label class="mb-2 block font-bold">Additional Services</label>@foreach($product->additionalServices as $s)<label class="mb-2 flex items-center gap-3 rounded-lg border p-3"><input type="checkbox" name="service_ids[]" value="{{ $s->id }}"> <span class="flex-1">{{ $s->name }}</span><b>+₹{{ number_format($s->currentPrice(),2) }}</b></label>@endforeach</div>@endif<button class="btn btn-primary w-full">Add to Cart</button></form><form method="POST" action="{{ route('wishlist.toggle',$product) }}" class="mt-3">@csrf<button class="btn btn-light w-full">♡ Add to Wishlist</button></form></div></div><div class="prose mt-12 max-w-none rounded-2xl bg-white p-8"><h2>Product Details</h2>{!! $product->description !!}</div>@if($related->count())<div class="mt-12"><h2 class="mb-5 text-2xl font-black">You May Also Like</h2><div class="grid grid-cols-2 gap-4 md:grid-cols-5">@foreach($related as $p)<x-product-card :product="$p"/>@endforeach</div></div>@endif</div>@endsection