diff --git a/src/components/pages/report/logistic-stock/tab/PurchasesPerSupplierTab.tsx b/src/components/pages/report/logistic-stock/tab/PurchasesPerSupplierTab.tsx
index 4144ae94..c8a57fd7 100644
--- a/src/components/pages/report/logistic-stock/tab/PurchasesPerSupplierTab.tsx
+++ b/src/components/pages/report/logistic-stock/tab/PurchasesPerSupplierTab.tsx
@@ -492,7 +492,7 @@ const PurchasesPerSupplierTab = () => {
             </Menu>
           </Dropdown>
         </div>
-        <div className='grid grid-cols-3 gap-4'>
+        <div className='grid md:grid-cols-3 grid-cols-1 gap-4'>
           <SelectInput
             label='Area'
             placeholder='Pilih Area'
@@ -542,7 +542,7 @@ const PurchasesPerSupplierTab = () => {
             isClearable
           />
         </div>
-        <div className='grid grid-cols-3 gap-4'>
+        <div className='grid md:grid-cols-3 grid-cols-1 gap-4'>
           <SelectInput
             label='Kategori Produk'
             placeholder='Pilih Kategori Produk'
@@ -573,7 +573,7 @@ const PurchasesPerSupplierTab = () => {
             isLoading={false}
             isClearable={false}
           />
-          <div className='flex flex-row gap-4'>
+          <div className='md:flex md:flex-row grid grid-cols-1 gap-4'>
             <DateInput
               label='Tanggal Awal'
               name='start_date'