import { Button } from "@/components/ui/button";

interface Props {
  open: boolean;
  zoneLabel: string;
  onConfirm: () => void;
  onCancel: () => void;
}

export function ZoneConfirmDialog({ open, zoneLabel, onConfirm, onCancel }: Props) {
  if (!open) return null;
  return (
    <div
      className="fixed inset-0 z-50 bg-black/40 flex items-end sm:items-center justify-center p-0 sm:p-4"
      onClick={onCancel}
    >
      <div
        className="w-full max-w-sm bg-card rounded-t-2xl sm:rounded-2xl shadow-xl p-6 space-y-5"
        onClick={(e) => e.stopPropagation()}
      >
        <div>
          <h2 className="text-lg font-semibold">Добавить повреждение</h2>
          <p className="text-sm text-muted-foreground mt-1 capitalize">
            {zoneLabel}?
          </p>
        </div>
        <div className="flex gap-2">
          <Button variant="outline" onClick={onCancel} className="flex-1">
            Нет
          </Button>
          <Button onClick={onConfirm} className="flex-1">
            Да
          </Button>
        </div>
      </div>
    </div>
  );
}
