@extends('layouts.public') @section('content') <div class="grid lg:grid-cols-2 gap-8"> <div class="bg-white rounded-xl shadow p-4"> <div class="aspect-video rounded overflow-hidden bg-black"> @if($product->video_url) <iframe class="w-full h-full" src="{{ $product->video_url }}" frameborder="0" allowfullscreen></iframe> @else <div class="w-full h-full flex items-center justify-center text-white"> No video yet </div> @endif </div> </div> <div> <h1 class="text-3xl font-extrabold">{{ $product->name }}</h1> <p class="mt-3 text-gray-700">{{ $product->description }}</p> <div class="mt-6 text-2xl font-bold">{{ $product->price_formatted }}</div> @auth <form class="mt-6 flex gap-3 items-center" method="POST" action="{{ route('cart.add', $product) }}"> @csrf <input type="number" name="quantity" value="1" min="1" class="w-24 rounded border-gray-300" /> <button class="px-5 py-3 rounded bg-black text-white"> Add to Cart </button> </form> @else <div class="mt-6 p-4 rounded bg-yellow-50 border"> Please <a class="underline" href="{{ route('login') }}">login</a> to purchase. </div> @endauth </div> </div> @endsection