<div class="mb-2">
    <label class="form-control-label" for="item-level"><?= __('Level') ?></label>
    <div class="form-range-control">
        <input type="range"
               class="form-range"
               id="item-level"
               name="level"
               value="<?= $item->getLevel() ?>"
               min="0"
               step="1"
               data-default="<?= $item->getLevel() ?>"
               data-prices="<?= $prices['level'] ?>"
               max="<?= $rule['max_level'] ?>"
        />
        <div class="form-range-text" style="width:25px">
            <span class="form-range-text-prefix">+</span>
            <span class="form-range-text-content"><?= $item->getLevel() ?></span>
        </div>
    </div>
</div>

<?php if ($item->getOption()->exists()): ?>
    <div class="mb-2">
        <label class="form-control-label" for="item-option"><?= __('Option') ?></label>
        <div class="form-range-control">
            <input type="range"
                   class="form-range"
                   id="item-option"
                   name="option"
                   value="<?= $item->getOption()->get() ?>"
                   min="0"
                   step="4"
                   data-default="<?= $item->getOption()->get() ?>" data-prices="<?= $prices['option'] ?>"
                   max="<?= $rule['max_option'] ?>"
            />
            <div class="form-range-text" style="width:25px">
                <span class="form-range-text-prefix">+</span>
                <span class="form-range-text-content"><?= $item->getOption()->get() ?></span>
            </div>
        </div>
    </div>
<?php endif ?>

<div class="row">
    <?php if ($rule['allow_ancient'] && $item->getAncient()->exists()): ?>
        <div class="col-auto mb-2 w-25">
            <label class="form-control-label" for="item-ancient"><?= __('Ancient') ?></label>
            <select class="form-select"
                    data-default="<?= $item->getAncient()->get() ?>"
                    data-prices="<?= $prices['ancient'] ?>"
                    name="ancient"
                    id="item-ancient"
            >
                <option value="0"></option>
                <?php foreach ($item->getAncient()->available() as $ancient): ?>
                    <option value="<?= $ancient['type'] ?>"<?= $item->getAncient()->is($ancient['type']) ? ' selected' : '' ?>><?= $ancient['name'] ?></option>
                <?php endforeach ?>
            </select>
        </div>
    <?php endif ?>

    <?php if ($item->getSkill()->exists()): ?>
        <div class="col-auto mb-2 w-25">
            <label for="item-skill"><?= __('Skill') ?></label>
            <div class="form-check form-switch form-switch-block">
                <input class="form-check-input"
                       data-default="<?= $item->getSkill()->has() ? 1 : 0 ?>"
                       data-prices="<?= $prices['skill'] ?>"
                       type="checkbox"
                       id="item-skill"
                       value="1"
                       name="skill"
                        <?= $item->getSkill()->has() ? ' checked' : '' ?>
                />
            </div>
        </div>
    <?php endif ?>

    <?php if ($item->getLuck()->exists()): ?>
        <div class="col-auto mb-2 w-25">
            <label for="item-luck"><?= __('Luck') ?></label>
            <div class="form-check form-switch form-switch-block">
                <input class="form-check-input"
                       data-default="<?= $item->getLuck()->has() ? 1 : 0 ?>"
                       data-prices="<?= $prices['luck'] ?>"
                       type="checkbox"
                       id="item-luck"
                       value="1"
                       name="luck"
                        <?= $item->getLuck()->has() ? ' checked' : '' ?>
                />
            </div>
        </div>
    <?php endif ?>

    <?php if ($rule['allow_refine'] && $item->getRefine()->exists()): ?>
        <div class="col-auto mb-2 w-25">
            <label for="item-refine"><?= __('Level 380') ?></label>
            <div class="form-check form-switch form-switch-block">
                <input class="form-check-input"
                       data-default="<?= $item->getRefine()->has() ? 1 : 0 ?>"
                       data-prices="<?= $prices['refine'] ?>"
                       type="checkbox"
                       id="item-refine"
                       value="1"
                       name="refine"
                    <?= $item->getRefine()->has() ? ' checked' : '' ?>
                />
            </div>
        </div>
    <?php endif ?>
</div>

<?php if ($item->getExcellent()->exists()): ?>
    <div class="mb-3">
        <h3 class="mt-2"><?= __('Excellent') ?></h3>

        <?php foreach ($item->getExcellent()->available() as $excellent): ?>
            <div class="form-check form-switch mb-2">
                <input class="form-check-input"
                       data-default="<?= $item->getExcellentSlot($excellent['slot'])->has() ? 1 : 0 ?>"
                       data-prices="<?= $prices['excellent'] ?>"
                       type="checkbox"
                       id="excellent-<?= $excellent['slot'] ?>"
                       name="excellent[<?= $excellent['slot'] ?>]"
                       value="1"
                        <?= $item->getExcellentSlot($excellent['slot'])->has() ? ' checked' : '' ?>
                />
                <label class="form-check-label" for="excellent-<?= $excellent['slot'] ?>"><?= $excellent['name'] ?></label>
            </div>
        <?php endforeach ?>
    </div>
<?php endif ?>

<?php if ($rule['allow_harmony'] && $item->getHarmony()->exists()): ?>
    <h3 class="mt-2"><?= __('Harmony') ?></h3>
    <select class="form-select"
            data-default="<?= $item->getHarmony()->getType() > 0 ? ($item->getHarmony()->getType() . ',' . $item->getHarmony()->getLevel()) : '' ?>"
            data-prices="<?= $prices['harmony'] ?>"
            name="harmony"
            id="item-harmony"
    >
        <option value=""></option>
        <?php foreach ($item->getHarmony()->available() as $harmony):  ?>
            <optgroup label="<?= $harmony['name'] ?>">
                <?php foreach ($harmony['levels'] as $level): ?>
                    <option value="<?= $harmony['type'] ?>,<?= $level['level'] ?>"<?= $item->getHarmony()->is($harmony['type'], $level['level']) ? ' selected' : '' ?>>
                        Level: <?= $level['level'] ?> - Value: <?= $level['value'] ?>
                    </option>
                <?php endforeach ?>
            </optgroup>
        <?php endforeach ?>
    </select>
<?php endif ?>

<?php if ($rule['allow_socket'] && $item->getSocket()->exists()): ?>
    <div class="webshop-single-socket mb-3">
        <h3 class="mt-2"><?= __('Socket') ?></h3>

        <?php for ($i = 0; $i < $item->getSocket()->max(); $i++): ?>
            <?php $slot = $item->getSocketSlot($i) ?>
            <div class="mb-2">
                <label for="product-socket-<?= $i ?>"><?= __('Socket #%d', [$i+1]) ?></label>
                <select class="form-select"
                        data-default="<?= $slot->isNull() ? '-2' : ($slot->isEmpty() ? '-1' : $slot->get()) ?>"
                        data-prices="<?= $prices['socket'] ?>"
                        name="socket[<?= $i ?>]"
                        id="item-socket-<?= $i ?>"
                >
                    <option<?= $slot->isNull() ? ' selected' : '' ?>  value="-2"><?= __('No socket') ?></option>
                    <option<?= $slot->isEmpty() ? ' selected' : '' ?> value="-1"><?= __('Empty socket') ?></option>
                    <?php if ((int) $rule['allow_socket'] === 1): ?>
                        <?php foreach ($item->getSocket()->available() as $type => $socks):  ?>
                            <optgroup label="<?= __($type) ?>">
                                <?php foreach ($socks as $socket): ?>
                                    <option value="<?= $socket['value'] ?>"<?= $slot->get() === $socket['value'] ? ' selected' : '' ?>><?= $socket['name'] ?> +<?= $socket['value'] ?></option>
                                <?php endforeach ?>
                            </optgroup>
                        <?php endforeach ?>
                    <?php else: ?>
                        <?php if ($slot->has()): ?>
                            <option selected value="<?= $slot->get() ?>"><?= $slot->getName() ?></option>
                        <?php endif ?>
                    <?php endif ?>
                </select>
            </div>
        <?php endfor ?>
    </div>
<?php endif ?>

<?php if ($rule['allow_mastery'] && $item->getMastery()->exists()): ?>
    <div class="mb-3">
        <h3 class="mt-2"><?= __('Mastery') ?></h3>

        <?php foreach ($item->getMastery()->available() as $mastery): ?>
            <div class="form-check form-switch mb-2">
                <input class="form-check-input"
                       data-default="<?= $item->getMasterySlot($mastery['slot'])->has() ? 1 : 0 ?>"
                       data-prices="<?= $prices['excellent'] ?>"
                       type="checkbox"
                       id="mastery-<?= $mastery['slot'] ?>"
                       name="mastery[<?= $mastery['slot'] ?>]"
                       value="1"
                    <?= $item->getMasterySlot($mastery['slot'])->has() ? ' checked' : '' ?>
                />
                <label class="form-check-label" for="mastery-<?= $mastery['slot'] ?>"><?= $mastery['name'] ?></label>
            </div>
        <?php endforeach ?>

        <?php if ($rule['allow_mastery_bonus'] && $item->getMastery()->getBonus()->exists()): ?>
            <div class="mb-2">
                <label for="item-mastery-bonus"><?= __('Bonus') ?></label>
                <select class="form-select" data-default="<?= $item->getMastery()->getBonus()->get() ?>" data-prices="<?= $prices['mastery_bonus'] ?? 0 ?>" id="item-mastery-bonus" name="mastery_bonus">
                    <option value=""></option>
                    <?php foreach ($item->getMastery()->getBonus()->available() as $index => $name):  ?>
                        <option<?= $item->getMastery()->getBonus()->get() === $index ? ' selected' : '' ?> value="<?= $index ?>"><?= $name ?></option>
                    <?php endforeach ?>
                </select>
            </div>
        <?php endif ?>
    </div>
<?php endif ?>