@model AsadiTools.Pages.Admin.Products.ProductInput
@using AsadiTools.Services

@{
    var inputCls = "w-full border border-gray-200 rounded-xl px-4 py-2.5 text-sm focus:outline-none focus:ring-2 focus:ring-blue-500";
}

<div class="grid grid-cols-2 gap-4">
    <div class="col-span-2">
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">نام فارسی <span class="text-red-500">*</span></label>
        <input asp-for="NameFa" class="@inputCls" placeholder="مثال: کاربن دیوالت DCD776" />
        <span asp-validation-for="NameFa" class="text-red-500 text-xs"></span>
    </div>
    <div class="col-span-2">
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">نام انگلیسی</label>
        <input asp-for="NameEn" class="@inputCls" dir="ltr" placeholder="e.g. DeWalt DCD776 Carbon Brush" />
    </div>
    <div>
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">کد محصول (SKU)</label>
        <input asp-for="Sku" class="@inputCls" dir="ltr" placeholder="DW-CBR-776" />
    </div>
    <div>
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">دسته‌بندی <span class="text-red-500">*</span></label>
        <select asp-for="Category" class="@inputCls">
            @foreach (var c in SiteData.Categories)
            {
                <option value="@c.Id">@c.Icon @c.NameFa</option>
            }
        </select>
    </div>
    <div>
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">برند</label>
        <select asp-for="Brand" class="@inputCls">
            <option value="">بدون برند</option>
            @foreach (var b in SiteData.Brands)
            {
                <option value="@b.Id">@b.NameFa</option>
            }
        </select>
    </div>
    <div>
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">موجودی</label>
        <input asp-for="Stock" type="number" min="0" class="@inputCls" dir="ltr" />
    </div>
    <div>
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">قیمت (تومان) <span class="text-red-500">*</span></label>
        <input asp-for="Price" type="number" min="0" class="@inputCls" dir="ltr" />
        <span asp-validation-for="Price" class="text-red-500 text-xs"></span>
    </div>
    <div>
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">قیمت با تخفیف</label>
        <input asp-for="DiscountPrice" type="number" min="0" class="@inputCls" dir="ltr" />
    </div>
    <div>
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">وضعیت</label>
        <select asp-for="IsActive" class="@inputCls">
            <option value="true">فعال</option>
            <option value="false">غیرفعال</option>
        </select>
    </div>
    <div class="col-span-2">
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">توضیحات</label>
        <textarea asp-for="Description" rows="3" class="@inputCls resize-none"></textarea>
    </div>
    <div class="col-span-2">
        <label class="text-sm font-medium text-gray-700 mb-1.5 block">آدرس تصویر (URL)</label>
        <input asp-for="ImageUrl" class="@inputCls" dir="ltr" placeholder="https://..." />
        <p class="text-xs text-gray-400 mt-1">لینک مستقیم به تصویر محصول. در صورت خالی ماندن آیکون دسته‌بندی نمایش داده می‌شود.</p>
        @if (!string.IsNullOrEmpty(Model?.ImageUrl))
        {
            <img src="@Model.ImageUrl" alt="پیش‌نمایش" class="mt-2 h-24 w-24 object-cover rounded-xl border border-gray-200" onerror="this.style.display='none'" />
        }
    </div>
</div>
