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

export const styles = StyleSheet.create({
  columnWrapper: {
    justifyContent: 'space-between'
  },
  image: {
    borderRadius: 8
  },
  selectionIndicator: {
    height: 24,
    width: 24,
    borderRadius: 12,
    position: 'absolute',
    right: 10,
    bottom: 10,
    borderColor: Colors.WHITE,
    borderWidth: 1,
    alignItems: 'center',
    justifyContent: 'center',
    alignContent: 'center'
  },
  wrapper: {
    backgroundColor: Colors.WHITE,
    paddingLeft: 15,
    paddingRight: 15,
    borderTopLeftRadius: 10,
    borderTopRightRadius: 10,
    height: 'auto'
  },
  modal: {
    justifyContent: 'flex-end',
    margin: 0
  },
  title: { color: '#808080', fontSize: 12, fontWeight: '500', paddingBottom: 16 },
  btnDots: {
    height: 36,
    width: 36,
    borderRadius: 18,
    backgroundColor: 'rgba(33, 37, 41, 0.6)',
    position: 'absolute',
    right: 5,
    top: 5,
    padding: 8
  },
  description: {
    color: Colors.DARK_BLUE,
    fontSize: 12,
    paddingTop: 2
  },
  btnContainer: {
    flexDirection: 'row',
    justifyContent: 'space-between',
    alignItems: 'center',
    gap: 15
  },
  btnModalEdit: {
    paddingHorizontal: 16,
    paddingVertical: 8,
    flexDirection: 'row',
    alignItems: 'center',
    gap: 12
  },
  btnModalEditText: { fontSize: 12, fontWeight: '600', color: Colors.DARK_BLUE },
});
