update design single food

src/app/[name]/(Main)/[id]/page.tsx

@@ -155,8 +155,8 @@ function FoodPage({}: Props) {
         </div>
       </div>
 
-      <div className="relative px-6 pt-6 pb-7.5 lg:flex lg:flex-col lg:justify-center lg:h-full lg:min-h-0 bg-container w-full rounded-3xl overflow-hidden not-lg:-translate-y-6 lg:rounded-l-none lg:overflow-y-auto">
+      <div className="relative px-6 pt-6 pb-7.5 lg:flex lg:flex-col lg:h-full lg:min-h-0 bg-container w-full rounded-3xl overflow-hidden not-lg:-translate-y-6 lg:rounded-l-none lg:overflow-y-auto">
-        <div className="w-full inline-flex justify-between items-center">
+        <div className="w-full inline-flex justify-between items-center shrink-0">
           <h5 className="text-base font-bold">{foodName}</h5>
           <button
             onClick={handleToggleFavorite}
@@ -171,7 +171,8 @@ function FoodPage({}: Props) {
           </button>
         </div>
 
-        <div className="mt-4 text-xs">
+        <div className="mt-4 lg:mt-0 lg:flex-1 lg:flex lg:flex-col lg:justify-center lg:min-h-0 lg:overflow-y-auto">
+          <div className="text-xs">
             <div className="flex items-center gap-1">
               <Clock size={14} className="stroke-disabled-text" />
               <span className="text-disabled-text">
@@ -218,8 +219,9 @@ function FoodPage({}: Props) {
             <p className="font-bold">محتویات:</p>
             <p className="mt-2 leading-6">{content || "-"}</p>
           </div>
+        </div>
 
-        <div className="mt-12 flex justify-between items-center">
+        <div className="mt-12 lg:mt-0 shrink-0 flex justify-between items-center">
           <span dir="ltr">{ef(price.toLocaleString("en-US"))} T</span>
           <motion.div
             whileTap={{ scale: 1.05 }}