import { Box, Container, Flex } from '@pikku/mantine/core'
import LanguageSelector from './LanguageSelector'
import Logo from './Logo'

export default function TopBar() {
  return (
    <Box
      dir='ltr'
      bg="white"
      pos="sticky"
      top={0}
      style={{ zIndex: 50, boxShadow: 'var(--mantine-shadow-md)' }}
    >
      <Container size="xl" py="md">
        <Flex justify="space-between" align="center">
          <Logo />

          <Flex gap="sm" align="center">
            <LanguageSelector />
          </Flex>
        </Flex>
      </Container>
    </Box>
  )
}