@extends('frontend::layouts.master')
@section('title')

@section('style')

@endsection

@section('content')

    <main>
        <div class="container sm:pt-5 lg:pb-5">
            <livewire:frontend::breadcrumbs.breadcrumbs name="product" active="3" :breadcrumbData="$breadcrumb" />
            <div class="flex -mx-4 flex-wrap pt-2 sm:pt-5 items-start relative">
                <div class="w-full lg:w-6/12 px-3 lg:sticky lg:top-away-header">
                    <livewire:frontend::carousel.splide-thumbnail slideName="splide-thumbnail" :slideData="$detail['gallery'] ?? []" />
                </div>
                <div class="w-full lg:w-6/12 px-3">
                    <div class="mt-8 lg:mt-0 mb-2">
                        <p class="fs-28 leading-8 th-6">{!! $detail['name'] ?? '' !!}</p>
                    </div>
                    <div class="mt-lg-3"></div>
                    <div class="the-">
                        <div class="the-c-detail text-editor">
                            {!! $detail['detail'] ?? '' !!}
                        </div>
                    </div>
                    {{-- <hr class="bg-grey my-2 my-lg-3 opacity-100">
                    <div class="py-3"></div>
                    <hr class="bg-grey my-2 my-lg-3 opacity-100">
                    <div class="flex flex-col justify-center items-center mt-4">
                        <p class="fs-20 th-6">Contact Us</p>
                        <div class="flex flex-wrap justify-center items-center -mx-4">
                            <div class="flex items-center space-x-2 p-3 full-url">
                                <img src="//tmp1.theme.nd.co.th/modules/frontend/img/icon/tel.svg">
                                <p class="fs-18">02-409-5299</p>
                                <a href="tel:+024095299"></a>
                            </div>
                            <div class="flex items-center space-x-2 p-3">
                                <img src="//tmp1.theme.nd.co.th/modules/frontend/img/icon/line.svg">
                                <p class="fs-18">Line</p>
                                <a href="https://line.me/th/" target="_blank"></a>
                            </div>
                        </div>
                    </div> --}}
                </div>
            </div>
        </div>
    </main>
@endsection

@section('script')


@endsection