fix relative heights for phones

Author: guilleasz-crossmint

components/common/Modal.tsx

@@ -37,7 +37,7 @@ export function Modal({
     <div className="fixed inset-0 z-0 flex items-center justify-center bg-black/30 py-2">
       <div
         className={cn(
-          "relative mx-4 flex h-fit w-full max-w-md flex-col items-center overflow-y-auto rounded-2xl bg-white p-6 shadow-xl md:h-fit md:max-h-[calc(100vh-32px)]",
+          "relative mx-4 flex h-fit w-full max-w-md flex-col items-center overflow-y-auto rounded-2xl bg-white p-6 shadow-xl md:h-fit md:max-h-[calc(100dvh-32px)]",
           className
         )}
       >

components/deposit/index.tsx

@@ -58,7 +58,7 @@ export function DepositModal({ open, onClose, walletAddress }: DepositModalProps
         showBackButton={step !== "processing"}
         onBack={step === "options" ? handleDone : restartFlow}
         className={cn(
-          "top-[70px] h-[calc(100vh-174px)] md:max-h-[calc(100vh-174px)] lg:top-0 lg:max-h-[calc(100vh-32px)]",
+          "top-[70px] h-[calc(100dvh-174px)] md:max-h-[calc(100dvh-174px)] lg:top-0 lg:max-h-[calc(100dvh-32px)]",
           amount && " lg:min-h-[718px]"
         )}
         title="Deposit"