small style changes

Author: rezahedi

src/Components/Common/CitiesSection.tsx

@@ -31,7 +31,7 @@ const CitiesSection = ({ title }: { title: string }) => {
   if (error) return;
 
   return (
-    <div className="rounded-md bg-accent/10 px-5 py-6">
+    <div className="rounded-4xl bg-accent/10 px-5 py-6">
       <h5 className="mb-6 font-semibold text-2xl">{title}</h5>
       <div className="flex flex-wrap justify-between gap-4">
         <div className="w-full grid grid-cols-2 md:grid-cols-3 lg:grid-cols-6 gap-4">

src/Components/Common/search/SearchBar.tsx

@@ -38,7 +38,7 @@ const SearchBar = () => {
           placeholder="Search for a city, activity, or place"
           value={searchQuery || ""}
           onChange={(e) => setSearchQuery(e.target.value)}
-          className="w-full mx-auto rounded-4xl shadow-lg bg-input border border-ring px-14 py-4 text-lg md:text-lg"
+          className="w-full mx-auto rounded-4xl shadow-lg bg-background border border-ring px-14 py-4 text-lg md:text-lg"
         />
         <Button
           type="submit"

src/Components/Header/Banner.tsx

@@ -3,7 +3,7 @@ import SearchBar from "../Common/search/SearchBar";
 
 const Banner = () => (
   <>
-    <div className="bg-[url('/images/main-header.jpg')] bg-cover bg-center h-56 flex justify-center items-center rounded-lg overflow-hidden">
+    <div className="bg-[url('/images/main-header.jpg')] bg-cover bg-center h-56 flex justify-center items-center rounded-xl overflow-hidden">
       <h4 className="text-white text-center text-2xl sm:text-4xl w-full h-full flex items-center justify-center bg-foreground/20">
         Plan your perfect day with ease!
       </h4>