import AText from "../icons/AText";
import BText from "../icons/BText";

// Components
import SearchBar from "./search";
import FrequentSearches from "./FrequentSearches";

function HomePage() {
    return (
        <div className="bg-banner-home !bg-bottom !bg-no-repeat !bg-cover">
            <div className="padding-responsive min-h-screen pt-[120px] flex items-center justify-center flex-col gap-[64px]">
                <div>
                    <p
                        className="text-[#F17732] text-center font-kalame text-[20px] sm:text-[24px] md:text-[28px] lg:text-[32px] font-bold"
                    >نوبت ۷۲۴</p>
                    <p
                        className="text-[#525252] text-center mt-2.5 font-kalame text-[20px] sm:text-[25px] md:text-[31px] lg:text-[36px] 
                        font-bold flex items-center gap-3"
                    >
                        <BText />
                        میتونی آنلاین نوبت بگیری!
                        <AText />
                    </p>
                </div>
                <SearchBar />
                <FrequentSearches />
            </div>
        </div>
    )
}

export default HomePage