"use client"
import React from 'react'
import Hero from './Hero'
import { LoginLink } from '@kinde-oss/kinde-auth-nextjs'

const Header = () => {
  return (
    <div className='w-full h-screen bg-[#F3F3F3] px-5 py-5 sm:py-10 sm:px-10 md:px-20 lg:px-[150px] xl:px-[200px]'>
        <div className="flex justify-between items-center ">
            <div>
                <p className='text-xl uppercase font-semibold'>Schedule.Me</p>
            </div>
            <div>
                <LoginLink>
                  <button className='px-4 py-2 bg-[#101010] text-white rounded-full font-semibold hover:opacity-85 duration-300'>Login</button>
                </LoginLink>
            </div>
        </div>
        <Hero/>
    </div>
  )
}

export default Header