@{
    Layout = "_GameLayout";
}

<div class="home">
    <div class="image-2-parent">
        <img class="image" src="~/img/image-2.png" />
        <img class="image-2-icon" alt="" src="~/img/image-2.png" style="display:none;">
        
        <img class="frame-child" src="~/img/image-1.png" alt="Logo">

        <partial name="_GameMenu" />

        <div class="frame-parent">
            <div class="medal-parent">
                <img class="hourglass-icon" src="~/img/021-medal-2.svg" alt="">
                <div class="ranking-coin">Ranking coin</div>
                <b class="view-ranking-coin">View ranking coin tablet 👉</b>
            </div>
            <div class="frame-group">
                <div class="frame-container">
                    <div class="my-play-parent">
                        <div class="my-play"> My play</div>
                        <div class="frame-item">
                        </div>
                    </div>
                    <div class="sword-parent">
                        <img class="sword-icon" src="~/img/003-sword.svg" alt="">
                        <div class="my-play">1.400</div>
                    </div>
                </div>
                <div class="frame-container">
                    <div class="my-coins-parent">
                        <div class="my-play">My coins</div>
                        <div class="frame-item">
                        </div>
                    </div>
                    <div class="sword-parent">
                        <img class="sword-icon" src="~/img/021-medal.svg" alt="">
                        <div class="my-play">140.000</div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <div class="frame-parent3">
        <div class="rectangle-parent" style="cursor: pointer;" onclick="handleRegister()">
            <div class="rectangle-div">
            </div>
            <!-- Register Button -->
            <div class="button-label">Register</div>
        </div>
        <div class="rectangle-parent" style="cursor: pointer;" onclick="handleBuyMore()">
            <div class="rectangle-div">
            </div>
            <!-- Buy more Button -->
            <div class="button-label2">Buy more</div>
        </div>

        <!-- PLAY BUTTON COMPLEX -->
        <div class="button-small" style="cursor: pointer;" onclick="handlePlay()">
            <div class="button-small-child"></div>
            <div class="button-small-item"></div>

            <img class="button-small-inner" src="~/img/rectangle-314.svg" alt="">
            <img class="rectangle-icon" src="~/img/rectangle-315.svg" alt="">
            <img class="button-small-child2" src="~/img/rectangle-316.svg" alt="">

            <img class="frame-icon" src="~/img/rectangle-318-3.svg" alt=""> <!-- subtract-2.svg inside? -->

            <img class="button-small-child3" src="~/img/rectangle-318-2.svg" alt="">
            <img class="button-small-child4" src="~/img/rectangle-317.svg" alt="">
            <img class="button-small-child5" src="~/img/image.svg" alt="">
            <img class="button-small-child6" src="~/img/rectangle-318.svg" alt="">

            <img class="vector-icon" src="~/img/vector-2.svg" alt="">
            <img class="vector-icon2" src="~/img/vector.svg" alt="">
            <img class="vector-icon3" src="~/img/vector-3.svg" alt="">
            <img class="vector-icon4" src="~/img/vector-4.svg" alt="">

            <div class="button-label3">Play</div>
        </div>
    </div>
    <!-- <img class="home-barpro-icon" alt=""> -->

</div>

<script>
    function handleRegister() {
        // TODO: Implement register logic
        alert('Register clicked!');
        // window.location.href = '/Home/Register';
    }

    function handleBuyMore() {
        // TODO: Implement buy more logic
        alert('Buy more clicked!');
        // window.location.href = '/Home/BuyMore';
    }

    function handlePlay() {
        // TODO: Implement play logic
        alert('Play clicked!');
        // window.location.href = '/Home/Play';
    }
</script>
