import React from 'react';
import { StyleSheet, Text, View } from 'react-native';
import { colors, radius, spacing, typography } from '../../../theme';

type ProgrammeWeekCardProps = {
  week: number;
  zone?: string;
};

const ProgrammeWeekCard = ({ week, zone }: ProgrammeWeekCardProps) => {
  return (
    <View style={styles.card}>
      <Text style={styles.text}>Semaine {week}</Text>
      <Text style={styles.highlight}>{zone || 'Zone non définie'}</Text>
    </View>
  );
};

export default ProgrammeWeekCard;

const styles = StyleSheet.create({
  card: {
    backgroundColor: '#E6F0FF',
    padding: spacing.lg,
    borderRadius: radius.xl,
    marginBottom: spacing.lg,
  },
  text: {
    textAlign: 'center',
    fontWeight: typography.fontWeight.semibold,
    color: colors.textPrimary,
  },
  highlight: {
    textAlign: 'center',
    fontWeight: typography.fontWeight.bold,
    color: colors.primary,
    marginTop: spacing.xs,
    fontSize: typography.fontSize.md,
  },
});