import { StyleSheet } from 'react-native'

import { Theme } from '../../../../styles/native'

export const createStyles = (theme: Theme) =>
  StyleSheet.create({
    container: {
      alignItems: 'center',
      borderBottomColor: theme.colors.surface.border,
      borderBottomWidth: 1,
      flexDirection: 'row',
      height: 64,
      justifyContent: 'center',
      padding: 16,
    },
    title: {
      flex: 1,
      textAlign: 'center',
    },
    backButtonContainer: {
      alignItems: 'center',
      width: 24,
    },
    closeButtonContainer: {
      alignItems: 'center',
      minWidth: 24,
    },
    closeButtonContent: {
      flexDirection: 'row',
      alignItems: 'center',
    },
  })