Flatlist Style.css

const styles = StyleSheet.create({
  container: {
    flex: 1,
    backgroundColor: '#F5F5F5',
  },
  listContent: {
    padding: 16,
  },
  card: {
    backgroundColor: '#fff',
    borderRadius: 12,
    marginBottom: 16,
    overflow: 'hidden',
    shadowColor: '#000',
    shadowOpacity: 0.1,
    shadowRadius: 6,
    shadowOffset: { width: 0, height: 2 },
    elevation: 3,
  },
  image: {
    width: '100%',
    height: 200,
  },
  textContainer: {
    padding: 12,
  },
  name: {
    fontSize: 18,
    fontWeight: '600',
    color: '#222',
    marginBottom: 4,
  },
  description: {
    fontSize: 14,
    color: '#555',
    lineHeight: 20,
  },
  header: {
    paddingVertical: 20,
    alignItems: 'center',
    backgroundColor: '#FFC107',
    borderRadius: 12,
    marginBottom: 10,
  },
  headerText: {
    fontSize: 22,
    fontWeight: '700',
    color: '#fff',
  },
  footer: {
    paddingVertical: 20,
    alignItems: 'center',
    backgroundColor: '#C2185B',
    borderRadius: 12,
    marginTop: 10,
  },
  footerText: {
    fontSize: 18,
    fontWeight: '600',
    color: '#fff',
  },
  separator: {
    height: 16,
  },
});