@extends('app')
@section('content')
	<!-- Start block -->
	<section class="bg-white dark:bg-gray-900">
		<div class="grid max-w-screen-xl px-4 pt-20 pb-8 mx-auto lg:gap-8 xl:gap-0 lg:py-16 lg:grid-cols-12 lg:pt-28">
			<div class="mr-auto place-self-center lg:col-span-7">
				<h1 class="max-w-2xl mb-4 text-4xl font-extrabold leading-none tracking-tight md:text-5xl xl:text-6xl dark:text-white">
					{{ $product_title }}
				</h1>
				<p class="max-w-2xl mb-6 font-light text-gray-500 lg:mb-8 md:text-lg lg:text-xl dark:text-gray-400">
					{{ $product_subtitle }}
				</p>
				<div class="space-y-4 sm:flex sm:space-y-0 sm:space-x-4">
					<div id="product_text">
						{!! $product_text !!}
					</div>
				</div>
			</div>
			<div class="hidden lg:mt-0 lg:col-span-5 lg:flex">
				<div class="flex flex-col justify-between">
					<img class="object-contain" src="{{ $product_image }}" alt="product image">
					<div class="self-end max-w-2xl dark:text-white">
						<span class="text-4xl font-extrabold leading-none tracking-tight md:text-5xl xl:text-6xl ">
							{{ $product_price }}
							<span class="text-3xl font-extrabold leading-none tracking-tight"> / {{ $product_price_unit }}</span>
						</span>
					</div>
				</div>
			</div>
		</div>
	</section>
	<!-- End block -->
	<!-- Include order form on that page -->
	@include('formorder')
@endsection