@props(['product' => new \App\Models\Product()])

<div class="card">
    <div class="card-header collapsible cursor-pointer rotate" data-bs-toggle="collapse" data-bs-target="#information">
        <div class="card-title">
            <h3>Review Product</h3>
        </div>
        <div class="card-toolbar rotate-180">
            <i class="ki-duotone ki-down fs-1"></i>
        </div>
    </div>
    <div id="information" class="collapse show">
        <div class="card-body">
            <!-- Nav tabs -->
            <ul class="nav nav-pills review-tabs" id="infoTabs" role="tablist">
                @if ($application->product_group->is_ggp)
                    <li class="nav-item" role="presentation">
                        <button class="nav-link active" id="general-tab" data-bs-toggle="tab" data-bs-target="#general" type="button" role="tab">
                            General Information
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="environment-tab" data-bs-toggle="tab" data-bs-target="#environment" type="button" role="tab">
                            Environmental Specification
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="product-tab" data-bs-toggle="tab" data-bs-target="#product" type="button" role="tab">
                            Product Certifications & Standards
                        </button>
                    </li>
                    <li class="nav-item" role="presentation">
                        <button class="nav-link" id="manufacturer-tab" data-bs-toggle="tab" data-bs-target="#manufacturer" type="button" role="tab">
                            Manufacturer Environmental Management
                        </button>
                    </li>
                @else
                    <li class="nav-item" role="presentation">
                        <button class="nav-link active" id="general-tab" data-bs-toggle="tab" data-bs-target="#general" type="button" role="tab">
                            General Information
                        </button>
                    </li>
                @endif

                <li class="nav-item" role="presentation">
                    <button class="nav-link" id="contact-tab" data-bs-toggle="tab" data-bs-target="#contact" type="button" role="tab">
                        Contact Person
                    </button>
                </li>
            </ul>

            <!-- Tab content -->
            <div class="tab-content mt-3">
                @if ($application->product_group->is_ggp)
                    <div class="tab-pane fade show active" id="general" role="tabpanel">
                        @include('pages.company.products.partials.review.a-general')
                    </div>
                    <div class="tab-pane fade" id="environment" role="tabpanel">
                        @include('pages.company.products.partials.review.b-environment')
                    </div>
                    <div class="tab-pane fade" id="product" role="tabpanel">
                        @include('pages.company.products.partials.review.c-product-cert')
                    </div>
                    <div class="tab-pane fade" id="manufacturer" role="tabpanel">
                        @include('pages.company.products.partials.review.d-manufacturer')
                    </div>
                @else
                    <div class="tab-pane fade show active" id="general" role="tabpanel">
                        @include('pages.company.products.partials.review.general')
                    </div>
                @endif

                <div class="tab-pane fade" id="contact" role="tabpanel">
                    @include('pages.company.products.partials.review.contact-person')
                </div>
            </div>
        </div>
    </div>
</div>