<div class="my-4"></div>
<div class="market-home">
    <div class="h2-title flex-s-c">
        <span>Market</span>
    </div>

    <div class="item-view flex-c-c market-list">
        <?php if ($market) : ?>
            <?php foreach ($market as $item) : ?>
                <div class="market-item <?= strtolower($item['tier']) ?>">
                    <p class="name"><?= $item['details']['name'] ?></p>
                    <div class="details preview">
                        <img src="<?= __resources("items/{$item['details']['image']}"); ?>" alt="<?= $item['details']['name'] ?>" class="image <?= strtolower($item['tier']) ?>">
                        <div class="informations">
                            <?= $item['details']['description'] ?>
                        </div>
                    </div>

                    <div class="flex-c-c">
                        <?php if ($item['price']) : ?>
                            <p class="price"><?= $item['price'] ?> HC</p>
                        <?php endif; ?>
                        <?php if ($item['zen']) : ?>
                            <p class="price"><?= $item['zen'] ?> Zen</p>
                        <?php endif; ?>
                        <?php if ($item['soul']) : ?>
                            <p class="price flex-c"><img src="<?= __files("images/jewels/soul.webp") ?>" alt=""><?= $item['soul'] ?> </p>
                        <?php endif; ?>
                        <?php if ($item['life']) : ?>
                            <p class="price flex-c"><img src="<?= __files("images/jewels/life.webp") ?>" alt=""><?= $item['life'] ?> </p>
                        <?php endif; ?>
                        <?php if ($item['chaos']) : ?>
                            <p class="price flex-c"><img src="<?= __files("images/jewels/chaos.webp") ?>" alt=""><?= $item['chaos'] ?> </p>
                        <?php endif; ?>
                        <?php if ($item['bless']) : ?>
                            <p class="price flex-c"><img src="<?= __files("images/jewels/bless.webp") ?>" alt=""><?= $item['bless'] ?> </p>
                        <?php endif; ?>
                        <?php if ($item['creation']) : ?>
                            <p class="price flex-c"><img src="<?= __files("images/jewels/creation.webp") ?>" alt=""><?= $item['creation'] ?> </p>
                        <?php endif; ?>
                        <?php if ($item['harmony']) : ?>
                            <p class="price flex-c"><img src="<?= __files("images/jewels/harmony.webp") ?>" alt=""><?= $item['harmony'] ?> </p>
                        <?php endif; ?>
                        <?php if ($item['guardian']) : ?>
                            <p class="price flex-c"><img src="<?= __files("images/jewels/guardian.webp") ?>" alt=""><?= $item['guardian'] ?> </p>
                        <?php endif; ?>
                    </div>

                    <?php if (__login()) : ?>
                        <div class="action">
                            <a class="button" href="javascript:void(0)" data-url="<?= __redirect('auth/market/buy/item/' . $item['id']) ?>" data-name="<?= $item['details']['name'] ?>">Buy</a>
                        </div>
                    <?php endif; ?>
                </div>
            <?php endforeach; ?>
        <?php else : ?>
            <div class="warning">There are no items on the market at the moment</div>
        <?php endif; ?>
    </div>

    <div>
        <a href="<?= __redirect("market/all/items") ?>" class="button"  style="margin: 1rem auto;display:block">View more</a>
    </div>

</div>