fix: prevent checkout button from being hidden by viewport height issues (#1009)

Author: nitinog10

frontend/src/components/layouts/Checkout/Checkout.module.scss

@@ -5,7 +5,10 @@ $font-body:  'Outfit', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sa
 
 .container {
   display: flex;
+  // Use dvh (dynamic viewport height) with fallback for older browsers
+  // This fixes iOS Safari where 100vh includes the address bar height
   min-height: 100vh;
+  min-height: 100dvh;
   font-family: $font-body;
 
   // CSS variables are set by CheckoutThemeProvider via MantineProvider cssVariablesResolver

frontend/src/components/layouts/Checkout/CheckoutContent/CheckoutContent.module.scss

@@ -2,15 +2,22 @@
 
 .main {
   position: relative;
+  // Use dvh (dynamic viewport height) with fallback for older browsers
+  // This fixes iOS Safari where 100vh includes the address bar height,
+  // causing content (like the Complete Order button) to be cut off
   min-height: calc(100vh - 60px);
+  min-height: calc(100dvh - 60px);
   height: auto;
   overflow-y: auto;
   padding: 20px 60px 40px;
+  // Ensure content is visible above iOS safe area
+  padding-bottom: max(40px, env(safe-area-inset-bottom, 40px));
 
   @include mixins.scrollbar();
 
   @include mixins.respond-below(md) {
     padding: 20px 20px 40px;
+    padding-bottom: max(40px, env(safe-area-inset-bottom, 40px));
   }
 
   .innerContainer {