import Card from '@/components/ui/Card';

interface DropRulesExplanationProps {
  dropPolicyDescription: string;
}

export function DropRulesExplanation({ dropPolicyDescription }: DropRulesExplanationProps) {
  // Don't show if all results count
  const hasDropRules = !dropPolicyDescription.toLowerCase().includes('all results count');

  if (!hasDropRules) {
    return null;
  }

  return (
    <Card>
      <div className="mb-4">
        <h3 className="text-lg font-semibold text-white">Drop Score Rules</h3>
        <p className="text-sm text-gray-400 mt-1">How your worst results are handled</p>
      </div>
      
      <div className="p-4 bg-deep-graphite rounded-lg border border-charcoal-outline">
        <p className="text-sm text-gray-300">{dropPolicyDescription}</p>
      </div>
      
      <p className="mt-4 text-xs text-gray-500">
        Drop rules are applied automatically when calculating championship standings. Focus on racing — the system handles the rest.
      </p>
    </Card>
  );
}