import { StyleSheet } from 'react-native';
import { Colors } from 'src/theme';

export const styles = StyleSheet.create({
  modal: {
    justifyContent: 'flex-end',
    margin: 0
  },
  textSmall: {
    color: Colors.DARK_BLUE,
    fontWeight: '600',
    fontSize: 12
  },
  buttonContainer: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'center',
    marginBottom: 16
  },
  modalContent: {
    backgroundColor: 'white',
    borderRadius: 15,
    paddingHorizontal: 16,
    gap: 16,
    paddingVertical: 24
  },
  optionsContainer: {
    gap: 16,
    marginBottom: 8
  },
  closeBtn: { backgroundColor: Colors.WHITE, borderColor: '#B7C6CB' },
  rowWrapper: {
    width: '100%',
    display: 'flex',
    flexDirection: 'row',
    alignItems: 'center',
    justifyContent: 'space-between',
    gap: 16
  },
  dropdownWrapper: { gap: 4, flex: 1 },
  dropdown: {
    height: 36,
    backgroundColor: '#F4F4F4',
    borderRadius: 4,
    paddingHorizontal: 8
  },
  dropdownOption: { paddingVertical: 12, paddingHorizontal: 16 },
  placeholderStyle: {
    fontSize: 14,
    color: Colors.DARK_BLUE,
    fontWeight: '500'
  }
});
