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

export const styles = StyleSheet.create({
  menuContainer: {
    gap: SPACING.x1,
  },
  menu: {
    position: 'absolute',
    borderRadius: BORDER_RADIUS.l,
    marginRight: SPACING['x2.5'],
    minWidth: 240,
    paddingVertical: SPACING.x2,
  },
  menuBorder: {
    borderWidth: 1,
  },
  menuItem: {
    alignItems: 'center',
    flexDirection: 'row',
    justifyContent: 'space-between',
    paddingVertical: SPACING.x1,
    paddingHorizontal: SPACING.x2,
    zIndex: 2,
  },
  itemSeparator: {
    borderBottomWidth: 1,
    position: 'absolute',
    left: SPACING.x2,
    bottom: -0.5,
    alignSelf: 'center',
    zIndex: 0,
    right: SPACING.x2,
  },
});
