<?php
/**
 * Hyvä Themes - https://hyva.io
 * Copyright © Hyvä Themes 2020-present. All rights reserved.
 * This product is licensed per Magento install
 * See https://hyva.io/license
 */

declare(strict_types=1);

/** @var Details $block */

/** @var Escaper $escaper */

use Magento\Catalog\Block\Product\View\Details;
use Magento\Framework\Escaper;
use Magento\Framework\View\Element\Template;

$titleRenderer = $block->getChildBlock('product.section.title.renderer');
$defaultTitleTemplate = $titleRenderer->getTemplate();
?>

<div class="grid grid-cols-1 lg:grid-cols-3 gap-6 mb-12">
    <!-- Left Column: Sections -->
    <div class="lg:col-span-2 flex flex-col space-y-6">
        <?php
        $sections = $block->getGroupSortedChildNames('detailed_info', '');
        $first = true;

        foreach ($sections as $sectionName) {
            $sectionBlock = $block->getLayout()->getBlock($sectionName);
            $sectionHtml = (string)$sectionBlock->toHtml();
            $titleTemplate = $sectionBlock->getData('title_template') ?? $defaultTitleTemplate;

            if (empty(trim($sectionHtml))) {
                continue;
            }

            if ($first) {
                $first = false;
                ?>
                <section id="<?= $escaper->escapeHtmlAttr($sectionBlock->getNameInLayout()) ?>">
                    <?= $titleRenderer->setTemplate($titleTemplate)
                        ->assign('sectionBlock', $sectionBlock)
                        ->toHtml() ?>
                    <div class="p-0 card w-full">
                        <?= /** @noEscape */
                        $sectionHtml ?>
                    </div>
                </section>
                <?php
            } else {
                $sectionId = $escaper->escapeHtmlAttr($sectionBlock->getNameInLayout());
                ?>
                <section x-data="{ open: false }" class="border border-gray-300 rounded-md overflow-hidden">
                    <button @click="open = !open"
                            class="w-full text-left px-4 font-medium bg-gray-500  flex justify-between items-center">
                        <?= $titleRenderer->setTemplate($titleTemplate)
                            ->assign('sectionBlock', $sectionBlock)
                            ->toHtml() ?>
                        <svg x-show="!open" class="w-5 h-5 text-white" fill="none" stroke="currentColor"
                             viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M12 4v16m8-8H4"/>
                        </svg>
                        <svg x-show="open" x-cloak class="w-5 h-5 text-white" fill="none" stroke="currentColor"
                             viewBox="0 0 24 24">
                            <path stroke-linecap="round" stroke-linejoin="round" stroke-width="2" d="M20 12H4"/>
                        </svg>
                    </button>
                    <div x-show="open" x-collapse class="p-4 bg-white">
                        <?= /** @noEscape */
                        $sectionHtml ?>
                    </div>
                </section>
                <?php
            }
        }
        ?>
    </div>

    <!-- Right Column: Custom Content -->


    <div class=" hidden md:block p-4 rounded md:mt-12">

        <!--        <h2 class="flex px-6 pt-6 pb-3 mb-6 md:flex-row border-b-2 border-gray-300">Additional Info</h2>
        -->
        <!-- Example image -->
        <?php

        $customBlock = $block->getLayout()
            ->createBlock(Template::class)
            ->setTemplate('Magento_Catalog::product/smallproduct.phtml');
        echo $customBlock->toHtml();

        ?>
    </div>
</div>
