export const CardCustom = ({ header, content, type = 'success' }) => {
	let backgroundColor
	switch (type) {
		case 'success':
			backgroundColor = 'bg-green-100'
			break

		case 'secondary':
			backgroundColor = 'bg-gray-100'
			break

		case 'biru':
			backgroundColor = 'bg-biru'
			break

		default:
			backgroundColor = 'bg-green-100'
			break
	}

	return (
		<div className='border text-center'>
			<p className={`font-semibold py-1 ${backgroundColor}`}>{header}</p>
			<p className='p-1'>{content}</p>
		</div>
	)
}

export const CardFilterLaporan = ({ header, children }) => {
	return (
		<div className='border rounded shadow mb-5'>
			<p className={`font-semibold p-1 bg-orange3 text-center text-xl`}>{header}</p>
			<div className='flex justify-center p-3'>{children}</div>
		</div>
	)
}