@attribute [Route(RouteConstants.Profile.ChargeDiscountWallet)]
@attribute [Authorize]

<PageTitle>شارژ کیف‌پول اعتباری</PageTitle>

<MudContainer MaxWidth="MaxWidth.Medium" Class="py-6">
    <MudStack Spacing="3">
        <PageHeader Title="💳 شارژ کیف‌پول اعتباری" BackHref="@RouteConstants.Profile.Wallet" />

        @* ─── نتیجه پرداخت (اگه از callback برگشته) ─── *@
        @if (_paymentResult != null)
        {
            <MudAlert Severity="@(_paymentResult == "success" ? MudBlazor.Severity.Success : MudBlazor.Severity.Error)"
                      Class="rounded-lg" Variant="Variant.Filled">
                @if (_paymentResult == "success")
                {
                    <span>شارژ اعتباری با موفقیت انجام شد! ✅</span>
                }
                else if (_paymentResult == "cancelled")
                {
                    <span>پرداخت توسط شما لغو شد.</span>
                }
                else
                {
                    <span>پرداخت ناموفق بود. لطفاً دوباره تلاش کنید.</span>
                }
            </MudAlert>
        }

        @* ─── فرم شارژ ─── *@
        <MudPaper Elevation="2" Class="pa-5 rounded-lg">
            <MudText Typo="Typo.h6" Class="mb-3">
                <MudIcon Icon="@Icons.Material.Filled.CreditCard" Class="ml-1" />
                شارژ موجودی اعتباری
            </MudText>

            <MudAlert Severity="MudBlazor.Severity.Info" Dense="true" Class="mb-3" Icon="@Icons.Material.Filled.Info">
                مبلغ وارد شده (به تومان) از طریق درگاه پرداخت به موجودی اعتباری شما اضافه می‌شود.
                از موجودی اعتباری فقط برای خرید از فروشگاه اعتباری می‌توانید استفاده کنید.
            </MudAlert>

            <MudStack Spacing="2">
                <MudNumericField @bind-Value="_chargeAmount"
                                 Label="مبلغ (تومان)"
                                 Variant="Variant.Outlined"
                                 Min="10_000"
                                 Max="100_000_000"
                                 Format="N0"
                                 Adornment="Adornment.Start"
                                 AdornmentIcon="@Icons.Material.Filled.Payments"
                                 HelperText="حداقل ۱۰,۰۰۰ و حداکثر ۱۰۰,۰۰۰,۰۰۰ تومان" />

                @* دکمه‌های مبلغ سریع *@
                <MudStack Row="true" Spacing="1" Class="flex-wrap">
                    @foreach (var preset in _presetAmounts)
                    {
                        <MudButton Variant="Variant.Outlined" Size="Size.Small"
                                   Color="@(_chargeAmount == preset ? Color.Primary : Color.Default)"
                                   OnClick="() => _chargeAmount = preset"
                                   Class="rounded-pill">
                            @FormatToman(preset)
                        </MudButton>
                    }
                </MudStack>

                @if (_chargeAmount > 0)
                {
                    <MudPaper Outlined="true" Class="pa-3 rounded-lg" Style="background: #f0fdf4;">
                        <MudStack Row="true" Justify="Justify.SpaceBetween">
                            <MudText Typo="Typo.body2">مبلغ پرداخت:</MudText>
                            <MudText Typo="Typo.body2"><strong>@FormatToman(_chargeAmount)</strong></MudText>
                        </MudStack>
                        <MudStack Row="true" Justify="Justify.SpaceBetween">
                            <MudText Typo="Typo.body2">اعتبار دریافتی:</MudText>
                            <MudText Typo="Typo.body2" Color="Color.Success"><strong>@FormatToman(_chargeAmount)</strong></MudText>
                        </MudStack>
                    </MudPaper>
                }

                <MudButton Variant="Variant.Filled"
                           Color="Color.Default"
                           Size="Size.Large"
                           FullWidth="true"
                           Disabled="true"
                           StartIcon="@Icons.Material.Filled.AccessTime"
                           Class="rounded-lg mt-2">
                    <span>بزودی</span>
                </MudButton>
            </MudStack>
        </MudPaper>

        @* ─── قوانین ─── *@
        <MudExpansionPanels Elevation="1" Class="rounded-lg">
            <MudExpansionPanel Text="قوانین شارژ اعتباری" MaxHeight="500" IsInitiallyExpanded="false">
                <MudList T="string" Dense="true">
                    <MudListItem T="string" Icon="@Icons.Material.Filled.CheckCircle" IconColor="Color.Success">
                        موجودی اعتباری فقط قابل استفاده در فروشگاه اعتباری است
                    </MudListItem>
                    <MudListItem T="string" Icon="@Icons.Material.Filled.CheckCircle" IconColor="Color.Success">
                        حداقل مبلغ شارژ: ۱۰,۰۰۰ تومان
                    </MudListItem>
                    <MudListItem T="string" Icon="@Icons.Material.Filled.CheckCircle" IconColor="Color.Success">
                        مبلغ واریزی بدون ضریب به موجودی اضافه می‌شود (۱:۱)
                    </MudListItem>
                    <MudListItem T="string" Icon="@Icons.Material.Filled.Info" IconColor="Color.Info">
                        پرداخت از طریق درگاه بانکی انجام می‌شود
                    </MudListItem>
                </MudList>
            </MudExpansionPanel>
        </MudExpansionPanels>
    </MudStack>
</MudContainer>
