import {StyleSheet} from 'react-native';
import {SPACING} from '@shared/theme';

const PADDING_VERTICAL = SPACING.x1;
export const CONTENT_HEIGHT = 40;
const HEADER_HEIGHT = CONTENT_HEIGHT + PADDING_VERTICAL * 2;
export const HEADER_HEIGHT_WITH_SAFE_AREA = CONTENT_HEIGHT + PADDING_VERTICAL;

export const styles = StyleSheet.create({
  container: {
    alignItems: 'center',
    borderBottomWidth: 1,
    flexDirection: 'row',
    height: HEADER_HEIGHT,
    justifyContent: 'space-between',
    paddingBottom: PADDING_VERTICAL,
    paddingHorizontal: SPACING.x2,
    paddingTop: PADDING_VERTICAL,
  },
  safeArea: {alignItems: 'flex-end'},
  borderless: {borderBottomWidth: 0},
});
