Modified Filter component styles and visibility handling

Author: ladunjexa

components/shared/Filters.tsx

@@ -47,17 +47,20 @@ const Filters = ({
   };
 
   return (
-    <div className="mt-10 flex flex-wrap-reverse gap-3 md:flex-wrap">
+    <div
+      className={`mt-10 flex flex-wrap-reverse gap-3 md:flex-wrap ${
+        !jobFilter && "hidden"
+      }`}
+    >
       {filters.map((filter, index) => (
         <Button
           key={filter.value}
           onClick={() => handleTypeClick(filter.value)}
-          className={`body-medium rounded-lg px-6 py-3 capitalize shadow-none ${
+          className={`body-medium mb-0.5 mr-0.5 rounded-lg px-6 py-3 capitalize shadow-none md:mb-0 md:mr-0 ${
             active === filter.value
               ? "bg-primary-100 text-primary-500 dark:bg-dark-400 dark:hover:bg-dark-400"
               : "bg-light-800 text-light-500 hover:bg-light-800 dark:bg-dark-300 dark:text-light-500 dark:hover:bg-dark-300"
           }
-          ${index !== filters.length - 1 && "mb-1 mr-1 md:mb-0 md:mr-0"}
           `}
         >
           {filter.name}