From fe72c2b446c8009c91463c060949c0c82e88a78f Mon Sep 17 00:00:00 2001
From: MeysamMoghaddam <65253484+MeysamMoghaddam@users.noreply.github.com>
Date: Mon, 13 Oct 2025 13:38:09 +0330
Subject: [PATCH] Update Checkout.razor

---
 src/FrontOffice.Main/Pages/Checkout.razor | 22 +++++++++++++++++-----
 1 file changed, 17 insertions(+), 5 deletions(-)

diff --git a/src/FrontOffice.Main/Pages/Checkout.razor b/src/FrontOffice.Main/Pages/Checkout.razor
index b8f9aeb..3caf15e 100644
--- a/src/FrontOffice.Main/Pages/Checkout.razor
+++ b/src/FrontOffice.Main/Pages/Checkout.razor
@@ -30,12 +30,24 @@
                 {
                     <MudStack Spacing="4">
                         <MudCard>
-                            <MudCardMedia Image="@_selectedPackage.Image"
-                                          Title="@_selectedPackage.Title"
-                                          Height="200" />
                             <MudCardContent>
-                                <MudText Typo="Typo.h5" Class="mb-2">@_selectedPackage.Title</MudText>
-                                @((MarkupString)_selectedPackage.Body)
+                                <MudGrid Spacing="3" AlignItems="AlignItems.Start">                                    
+                                    <MudItem xs="12" md="4">
+                                        <MudPaper Class="pa-2 rounded-xl" Style="background: radial-gradient(600px 280px at 120% 0, #daccff 0, transparent 60%), radial-gradient(600px 280px at -10% 100%, #ffe2f2 0, transparent 60%), linear-gradient(180deg, #fff, #fbfaff);">
+                                            <MudImage Src="@_selectedPackage.Image"
+                                                      Alt="@_selectedPackage.Title"
+                                                      Height="150"
+                                                      ObjectFit="ObjectFit.Cover"
+                                                      ObjectPosition="ObjectPosition.Center"
+                                                      Style="width:100%"
+                                                      Class="rounded-xl" />
+                                        </MudPaper>                                        
+                                    </MudItem>
+                                    <MudItem xs="12" md="8">
+                                        <MudText Typo="Typo.h5" Class="mb-2">@_selectedPackage.Title</MudText>
+                                            @((MarkupString)_selectedPackage.Body)
+                                        </MudItem>
+                                </MudGrid>
                             </MudCardContent>
                         </MudCard>