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

export const styles = StyleSheet.create({
  container: {
    padding: 24,
  },
  imageContainer: {
    position: 'relative',
    marginBottom: 8,
    width: '100%',
    height: 327,
    borderRadius: 8,
    backgroundColor: '#FAFAFA'
  },
  deleteButton: {
    position: 'absolute',
    top: 16,
    right: 16,
    zIndex: 1,
  },
  image: {
    width: '100%',
    height: '100%',
    resizeMode: 'cover',
    borderRadius: 8,
  },
  description: {
    width: '100%',
    marginTop: 8,
  },
  centerPosition: {
    justifyContent: 'center',
    alignItems: 'center',
  },
  addButtonText: {
    fontSize: 16,
    marginTop: 10,
    fontWeight: '700',
    color: Colors.DARK_BLUE,
    lineHeight: 24,
  },
  deleteBtn: {
    width: 40,
    height: 40,
    backgroundColor: Colors.RED,
    borderRadius: 20
  },
  addBtn: {
    width: 48,
    height: 48,
    backgroundColor: Colors.DARK_BLUE,
    borderRadius: 24
  }
});
