<?php
declare(strict_types=1);

/**
 * @var $block \Mirasvit\Brand\Block\BrandList
 */
?>
<?php
$collection = $block->getBrandsByLetters();
?>

<div class="2xl:container mx-auto px-3 3xl:max-w-screen-2xl">
    <div class="mst-brand__brand-list">
        <div class="text-xl lg:text-2xl font-bold text-primary-darker mb-4 font-inter border-b-2 py-3">
            All Brands
        </div>
        <div class="grid grid-cols-2 md:grid-cols-4 lg:grid-cols-5 gap-6">
            <?php foreach ($collection as $brands): ?>
                <?php foreach ($brands as $brand): ?>
                    <?php if ($block->canShowImage($brand)): ?>
                        <?php

                        $originalUrl = $brand->getUrl();
                        // Replace '/brand/' with '/brands/' and append '.html' if not already present
                        $customUrl = str_replace('/brand/', '/brands/', $originalUrl);
                        if (!preg_match('/\.html$/', $customUrl)) {
                            $customUrl .= '.html';
                        }
                        ?>
                        <a href="<?= $customUrl ?>" class="block text-center">



                            <div
                                class="flex items-center justify-center p-2">
                                <img
                                    class="object-contain rounded-2xl"
                                    src="<?= $brand->getImage() ?>"
                                    alt="<?= $block->escapeHtmlAttr(__('Logo of %1', $brand->getLabel())) ?>"
                                    <?php if ($block->getBrandLogoImageWidth()): ?>
                                        width="<?= $block->escapeHtmlAttr($block->getBrandLogoImageWidth()) ?>"
                                    <?php endif; ?>
                                    <?php if ($block->getBrandLogoImageHeight()): ?>
                                        height="<?= $block->escapeHtmlAttr($block->getBrandLogoImageHeight()) ?>"
                                    <?php endif; ?>
                                />
                            </div>
                        </a>
                    <?php endif; ?>
                <?php endforeach; ?>
            <?php endforeach; ?>
        </div>
    </div>
</div>
