diff --git a/src/components/pages/production/uniformity/UniformityTable.tsx b/src/components/pages/production/uniformity/UniformityTable.tsx
index 018e2537..e9405dd6 100644
--- a/src/components/pages/production/uniformity/UniformityTable.tsx
+++ b/src/components/pages/production/uniformity/UniformityTable.tsx
@@ -1242,156 +1242,158 @@ const UniformityTable = () => {
         ref={filterModal.ref}
         className={{
           modal: 'p-0',
-          modalBox: 'p-0 rounded-2xl xl:max-w-4/12 max-w-sm',
+          modalBox: 'p-0 rounded-[0.875rem]',
         }}
       >
-        <div className='space-y-6'>
+        <div className='flex flex-col'>
           {/* Modal Header */}
-          <div className='flex items-center justify-between gap-2 py-3 border-b border-gray-300 px-4'>
+          <div className='flex items-center justify-between p-4 border-b border-base-content/10'>
             <div className='flex items-center gap-2 text-primary'>
               <Icon icon='heroicons:funnel' width={20} height={20} />
-              <h3 className='font-semibold'>Filter Data</h3>
+              <h3 className='font-medium text-sm'>Filter Data</h3>
             </div>
             <Button
               variant='link'
               onClick={filterModal.closeModal}
-              className='text-gray-500 hover:text-gray-700 transition-colors cursor-pointer'
+              className='text-gray-500 hover:text-gray-700'
             >
               <Icon icon='heroicons:x-mark' width={20} height={20} />
             </Button>
           </div>
 
-          <div className='space-y-1.5 px-4'>
-            <div className='grid grid-cols-1 sm:grid-cols-2 sm:gap-1.5'>
+          <form
+            className='flex flex-col'
+            onSubmit={handleFormSubmit}
+            onReset={handleResetFilters}
+          >
+            <div className='flex flex-col p-4 gap-1.5'>
+              {/* Rentang Waktu */}
               <div>
-                <DateInput
+                <label className='flex text-xs items-center gap-2 py-2 font-semibold'>
+                  Tanggal
+                </label>
+                <div className='flex items-center gap-2'>
+                  <DateInput
+                    name='start_date'
+                    placeholder='Tanggal Mulai'
+                    value={filterFormik.values.start_date}
+                    errorMessage={filterFormik.errors.start_date}
+                    onChange={handleFilterStartDateChange}
+                    isError={
+                      filterFormik.touched.start_date &&
+                      Boolean(filterFormik.errors.start_date)
+                    }
+                  />
+                  <hr className='w-full max-w-3 h-px border-base-content/10'></hr>
+                  <DateInput
+                    name='end_date'
+                    placeholder='Tanggal Akhir'
+                    value={filterFormik.values.end_date}
+                    errorMessage={filterFormik.errors.end_date}
+                    onChange={handleFilterEndDateChange}
+                    isError={
+                      filterFormik.touched.end_date &&
+                      Boolean(filterFormik.errors.end_date)
+                    }
+                  />
+                </div>
+              </div>
+
+              <div>
+                <SelectInput
                   required
-                  label='Tanggal mulai'
-                  name='start_date'
-                  value={filterFormik.values.start_date}
-                  onChange={handleFilterStartDateChange}
-                  onBlur={filterFormik.handleBlur}
+                  label='Lokasi'
+                  placeholder='Pilih Lokasi...'
+                  value={filterFormik.values.location}
+                  onChange={(value) => {
+                    handleFilterLocationChange(value);
+                  }}
+                  options={filterLocationOptions}
+                  onInputChange={setFilterLocationInputValue}
+                  isLoading={isLoadingFilterLocations}
+                  onMenuScrollToBottom={loadMoreFilterLocations}
                   isError={
-                    filterFormik.touched.start_date &&
-                    Boolean(filterFormik.errors.start_date)
+                    filterFormik.touched.location &&
+                    Boolean(filterFormik.errors.location)
                   }
-                  errorMessage={filterFormik.errors.start_date}
+                  errorMessage={filterFormik.errors.location}
+                  isClearable
                   className={{ wrapper: 'w-full' }}
                 />
               </div>
 
               <div>
-                <DateInput
+                <SelectInput
                   required
-                  label='Tanggal akhir'
-                  name='end_date'
-                  value={filterFormik.values.end_date}
-                  onChange={handleFilterEndDateChange}
-                  onBlur={filterFormik.handleBlur}
+                  label='Project Flock'
+                  placeholder='Pilih Project Flock...'
+                  value={filterFormik.values.project_flock}
+                  onChange={(value) => {
+                    handleFilterProjectFlockChange(value);
+                  }}
+                  options={filterProjectFlockOptions}
+                  onInputChange={setFilterProjectFlockSearchValue}
+                  isLoading={isLoadingFilterProjectFlocks}
+                  onMenuScrollToBottom={loadMoreFilterProjectFlocks}
+                  isDisabled={!filterFormik.values.location}
                   isError={
-                    filterFormik.touched.end_date &&
-                    Boolean(filterFormik.errors.end_date)
+                    filterFormik.touched.project_flock &&
+                    Boolean(filterFormik.errors.project_flock)
                   }
-                  errorMessage={filterFormik.errors.end_date}
+                  errorMessage={filterFormik.errors.project_flock}
+                  isClearable
                   className={{ wrapper: 'w-full' }}
                 />
               </div>
-            </div>
 
-            <div>
-              <SelectInput
-                required
-                label='Lokasi'
-                placeholder='Pilih Lokasi...'
-                value={filterFormik.values.location}
-                onChange={(value) => {
-                  handleFilterLocationChange(value);
-                }}
-                options={filterLocationOptions}
-                onInputChange={setFilterLocationInputValue}
-                isLoading={isLoadingFilterLocations}
-                onMenuScrollToBottom={loadMoreFilterLocations}
-                isError={
-                  filterFormik.touched.location &&
-                  Boolean(filterFormik.errors.location)
-                }
-                errorMessage={filterFormik.errors.location}
-                isClearable
-                className={{ wrapper: 'w-full' }}
-              />
-            </div>
-
-            <div>
-              <SelectInput
-                required
-                label='Project Flock'
-                placeholder='Pilih Project Flock...'
-                value={filterFormik.values.project_flock}
-                onChange={(value) => {
-                  handleFilterProjectFlockChange(value);
-                }}
-                options={filterProjectFlockOptions}
-                onInputChange={setFilterProjectFlockSearchValue}
-                isLoading={isLoadingFilterProjectFlocks}
-                onMenuScrollToBottom={loadMoreFilterProjectFlocks}
-                isDisabled={!filterFormik.values.location}
-                isError={
-                  filterFormik.touched.project_flock &&
-                  Boolean(filterFormik.errors.project_flock)
-                }
-                errorMessage={filterFormik.errors.project_flock}
-                isClearable
-                className={{ wrapper: 'w-full' }}
-              />
-            </div>
-
-            <div>
-              <SelectInput
-                required
-                label='Kandang'
-                placeholder='Pilih Kandang...'
-                value={filterFormik.values.kandang}
-                onChange={(value) => {
-                  handleFilterKandangChange(value);
-                }}
-                options={filterKandangOptions}
-                isDisabled={!filterFormik.values.project_flock}
-                isError={
-                  filterFormik.touched.kandang &&
-                  Boolean(filterFormik.errors.kandang)
-                }
-                errorMessage={filterFormik.errors.kandang}
-                isClearable
-                className={{ wrapper: 'w-full' }}
-              />
-            </div>
-          </div>
-
-          <div className='w-full'>
-            {/* Error List Alert */}
-            {formErrorList.length > 0 && (
-              <div className='w-full px-4'>
-                <AlertErrorList formErrorList={formErrorList} onClose={close} />
+              <div>
+                <SelectInput
+                  required
+                  label='Kandang'
+                  placeholder='Pilih Kandang...'
+                  value={filterFormik.values.kandang}
+                  onChange={(value) => {
+                    handleFilterKandangChange(value);
+                  }}
+                  options={filterKandangOptions}
+                  isDisabled={!filterFormik.values.project_flock}
+                  isError={
+                    filterFormik.touched.kandang &&
+                    Boolean(filterFormik.errors.kandang)
+                  }
+                  errorMessage={filterFormik.errors.kandang}
+                  isClearable
+                  className={{ wrapper: 'w-full' }}
+                />
               </div>
-            )}
-          </div>
 
-          {/* Action Buttons */}
-          <div className='flex justify-between gap-4 py-4 mt-8 border-t border-gray-300 bg-gray-100'>
-            <Button
-              variant='soft'
-              className='ms-4 min-w-36 rounded-lg'
-              onClick={handleResetFilters}
-            >
-              Reset Filter
-            </Button>
-            <Button
-              className='me-4 min-w-36 rounded-lg'
-              onClick={handleApplyFilters}
-            >
-              Apply Filter
-            </Button>
-          </div>
+              {formErrorList.length > 0 && (
+                <div className='w-full'>
+                  <AlertErrorList
+                    formErrorList={formErrorList}
+                    onClose={close}
+                  />
+                </div>
+              )}
+            </div>
+
+            {/* Action Buttons */}
+            <div className='flex justify-between gap-4 p-4 border-t border-base-content/10 bg-gray-100'>
+              <Button
+                type='reset'
+                variant='soft'
+                className='rounded-lg p-3 bg-gray-100 border-gray-100 text-base-content/65 hover:bg-base-content/10'
+              >
+                Reset Filter
+              </Button>
+              <Button
+                type='submit'
+                className='min-w-40 text-sm p-3 text-white rounded-lg'
+              >
+                Apply Filter
+              </Button>
+            </div>
+          </form>
         </div>
       </Modal>