Excessive space between Organization dropdown and Search bar in Attendance menu.

src/pages/Activities/AttendancePage.jsx

@@ -179,44 +179,40 @@ const AttendancePage = () => {
               </div>
 
               {/* Search + Organization filter */}
-              <div className="col-12 col-md-auto mt-2 mt-md-0 ms-md-auto d-flex gap-2 align-items-center">
-                {/* Organization Dropdown */}
-                <div className="row">
-                  <div className="col-12 col-sm-6 mb-2 mb-sm-0">
-                     <select
-                  className="form-select form-select-sm"
-                  value={appliedFilters.selectedOrganization}
-                  onChange={(e) =>
-                    setAppliedFilters((prev) => ({
-                      ...prev,
-                      selectedOrganization: e.target.value,
-                    }))
-                  }
-                  disabled={orgLoading}
-                >
-                  <option value="">All Organizations</option>
-                  {organizations?.map((org, ind) => (
-                    <option key={`${org.id}-${ind}`} value={org.id}>
-                      {org.name}
-                    </option>
-                  ))}
-                </select>
+              <div className="col-12 col-md-auto mt-2 mt-md-0 ms-md-auto">
+                <div className="row g-2">
+                  <div className="col-12 col-sm-6">
+                    <select
+                      className="form-select form-select-sm"
+                      value={appliedFilters.selectedOrganization}
+                      onChange={(e) =>
+                        setAppliedFilters((prev) => ({
+                          ...prev,
+                          selectedOrganization: e.target.value,
+                        }))
+                      }
+                      disabled={orgLoading}
+                    >
+                      <option value="">All Organizations</option>
+                      {organizations?.map((org, ind) => (
+                        <option key={`${org.id}-${ind}`} value={org.id}>
+                          {org.name}
+                        </option>
+                      ))}
+                    </select>
                   </div>
                   <div className="col-12 col-sm-6">
-                    {/* Search Input */}
-                <input
-                  type="text"
-                  className="form-control form-control-sm"
-                  placeholder="Search Employee..."
-                  value={searchTerm}
-                  onChange={(e) => setSearchTerm(e.target.value)}
-                />
+                    <input
+                      type="text"
+                      className="form-control form-control-sm"
+                      placeholder="Search Employee..."
+                      value={searchTerm}
+                      onChange={(e) => setSearchTerm(e.target.value)}
+                    />
                   </div>
                 </div>
-               
-
-                
               </div>
+
             </div>
           </div>