responsive page doctor item & page booking

components/doctor/appointmentList/ItemAppointment.js

@@ -25,7 +25,7 @@ function ItemAppointment({ turn, doctor }) {
                     <p className="text-[#525252] text-[14px] font-medium">تخصص: {doctor.expertise}</p>
                 </div>
             </div>
-            <div className='flex mt-5 items-center justify-between'>
+            <div className='flex mt-5 gap-2 items-center justify-between'>
                 <div className='flex items-start justify-start gap-1'>
                     <GreenCalendarTurn />
                     <p className='text-[#05BA58] text-[12px] font-medium'>اولین نوبت آزاد: {turn.first_free_turn}</p>
@@ -33,7 +33,7 @@ function ItemAppointment({ turn, doctor }) {
                 <Link href={`/booking/${turn.id}`}>
                     <Button
                         variant='contained'
-                        className='!py-2 !px-6 gap-1'
+                        className='!py-2 !px-3 xl:!px-6 gap-1'
                     >
                         دریافت نوبت
                         <div className='w-[20px] h-[20px]'>