From 9a0df75bb4a941cda4b9c2efd1d922072c31184b Mon Sep 17 00:00:00 2001
From: hamid zarghami <hamid.zarghami1@gmail.com>
Date: Sun, 28 Dec 2025 14:40:02 +0330
Subject: [PATCH] fix radio group in mobile

---
 src/components/RadioGroup.tsx                  | 4 ++--
 src/pages/service/components/ServiceHeader.tsx | 2 +-
 2 files changed, 3 insertions(+), 3 deletions(-)

diff --git a/src/components/RadioGroup.tsx b/src/components/RadioGroup.tsx
index 0421109..efe91c0 100644
--- a/src/components/RadioGroup.tsx
+++ b/src/components/RadioGroup.tsx
@@ -13,12 +13,12 @@ type Props = {
 
 const RadioGroup: FC<Props> = (props: Props) => {
     return (
-        <div className='flex gap-5 items-center text-xs'>
+        <div className='flex xl:flex-nowrap flex-wrap gap-3 xl:gap-5 items-center text-xs'>
             {
                 props.items.map((item, index) => (
                     <div key={index} className='flex gap-2 items-center'>
                         <Radio value={item.value} onChange={props.onChange} isActive={item.value === props.selected} />
-                        <div className='mt-0.5'>
+                        <div className='mt-0.5 whitespace-nowrap'>
                             {item.label}
                         </div>
                     </div>
diff --git a/src/pages/service/components/ServiceHeader.tsx b/src/pages/service/components/ServiceHeader.tsx
index 03003cd..d284556 100644
--- a/src/pages/service/components/ServiceHeader.tsx
+++ b/src/pages/service/components/ServiceHeader.tsx
@@ -82,7 +82,7 @@ const ServiceHeader: FC<Props> = ({ data }) => {
             </div>
 
             <div className='flex w-full flex-col justify-between xl:items-end'>
-                <div className='flex xl:!hidden gap-5 mt-5'>
+                <div className='flex xl:!hidden mt-5 w-full'>
                     <RadioGroup
                         items={planItems}
                         onChange={setPlanSelected}