@*
    For more information on enabling MVC for empty projects, visit http://go.microsoft.com/fwlink/?LinkID=397860
*@

@using LotteryWebApp.Common
@using LotteryWebApp.Languages;
@using LotteryWebApp.Components;
@using LotteryWebApp.Extensions;

@model HeaderHomeModel

@*<style>
    h1, h2, h3, h4, h5, h6 {
    color: white;
    }
    </style>*@

@*back ground*@

<style>
    .scroll-left {
        height: 30px;
        overflow: hidden;
        position: relative;
        background: #F6C600;
        color: #030303;
        border: 1px solid #F6C600;
        border-radius: 20px;
        margin-top: 5px;
    }
</style>

@{
    String topWinner = Context.Session.GetComplexData<String>("topWinner");
}

<div style="position:relative;">
    <img class="header-img-main-retangle-above" src="~/img/Home_Layout1.2.png" />

    <div class="header-img-ellipse-1">
        <img src="~/img/header_above/Ellipse31.png" />
    </div>

    <div class="header-img-ellipse-2">
        <img src="~/img/header_above/Ellipse36.png" />
    </div>

    <div class="header-img-ellipse-3">
        <img src="~/img/header_above/Ellipse37.png" />
    </div>

    <div class="header-img-ellipse-4">
        <img src="~/img/header_above/Ellipse38.png" />
    </div>

    <div class="account-header-container">
        <div class="account-header-box" onclick="actionButton_Click('/Profile')">
            <div class="account-header-image">
                <img src="@(Model.profile.realPicture != null && Model.profile.realPicture != "" ? Model.profile.picture : "/img/8b6f5f94a53dbc3c8240347693830120.jpg")" />
            </div>

            <div class="account-header-info">
                <div>
                    <h3 style="color: white;">@Model.profile.fullName</h3>
                </div>
                <div>
                    <h4 style="margin:0px;color: white;">@Model.profile.users.Substring(3)</h4>
                </div>
            </div>

        </div>

        <div class="row" style="margin-top:10px;">
            <div class="col-6">
                <div class="text-center text-color-white">
                    <div class="open-or-close-eye" style="text-align:start;">
                        <a class="open-eye hide">
                            <i class="fa fa-solid fa-eye"></i>
                            @Functions.FormatNumber(Model.userStatus.bet_coin) @Lang.curency
                        </a>
                        <a class="close-eye">
                            <i class="fa fa-solid fa-eye-slash"></i>
                            <i style="font-size: 20px; vertical-align: middle;">******</i> @Lang.curency
                        </a>
                    </div>
                </div>
            </div>
            <div class="col-6">
                <div class="text-center text-color-white button-box-animation">
                    @*<a href="@ViewBag.MyConfig.MyValue/Home/Transfer">*@
                    <a onclick="navigatorClick('Home/Transfer')">
                        <img src="~/img/transfer.png" style="vertical-align: text-top" /> @Lang.tranfer_win_money
                    </a>
                </div>
            </div>
        </div>

    </div>

</div>


<div>
    @{
        if (topWinner != null && topWinner.Length > 0)
        {
            <div class="scroll-left">
                <marquee width="100%" style="line-height: 25px;">
                    @topWinner
                </marquee>
            </div>
        }
        else
        {
            <div class="scroll-left">
                <marquee width="100%" style="line-height: 25px;">
                    @Lang.top_winner
                </marquee>
            </div>
        }
    }
</div>



<div style="margin-top: 5px; position:relative;">
    <img class="header-img-main-retangle" src="~/img/Home_Layout1.2.1.png" />

    <div class="home-category-container">
        <div class="row">
            <div class="col-4 home-category-box category-noti-container button-box-animation" onclick="actionButton_Click('/BuyTicket')">
                <img style="max-width:50px;" src="~/img/menu/ticket.svg" />
                <div style="margin-top:5px;">@Lang.play</div>
                @* <div class="category-noti">
                    <img style=" max-width: 22px; height: 22px;" src="~/img/Trust shield_Icon.png" />
                </div> *@
            </div>

            <div class="col-4 home-category-box button-box-animation" onclick="actionButton_Click('/Home/Rules')">
                <img style="max-width:50px;" src="~/img/menu/rule.svg" />
                @* <i class="fa fa-2x fa-solid fa-book" style="color:white;height: 35px;"></i> *@
                <div style="margin-top:5px;">@Lang.rules</div>
            </div>

            @* <div class="col-3 home-category-box button-box-animation" onclick="actionButton_Click('/Home/Results')">
                <img style="max-width:50px;" src="~/img/Result.png" />
                <div style="margin-top:5px;">@Lang.results</div>
            </div> *@

            <div class="col-4 home-category-box button-box-animation" onclick="actionButton_Click('/Home/FAQ')">
                <img style="max-width:50px;" src="~/img/menu/faq.svg" />
                <div style="margin-top:5px;">@Lang.faq</div>
            </div>
        </div>
    </div>
</div>

<form id="action-redirect" action="" method="post">
    @Html.AntiForgeryToken()
</form>