import React from "react";
import { Card, CardContent } from "@/components/ui/card";
import { Input } from "@/components/ui/input";
import { Button } from "@/components/ui/button";
import { Textarea } from "@/components/ui/textarea";
import { Label } from "@/components/ui/label";

const CadastroCliente = () => {
  return (
    <div className="p-6">
      <h1 className="text-3xl font-bold mb-6">Cadastrar Novo Cliente</h1>

      <Card className="max-w-3xl mx-auto">
        <CardContent className="space-y-6">
          <div>
            <Label htmlFor="nome">Nome Completo</Label>
            <Input id="nome" placeholder="Ex: João da Silva" />
          </div>

          <div>
            <Label htmlFor="documento">CPF/CNPJ</Label>
            <Input id="documento" placeholder="000.000.000-00 ou 00.000.000/0000-00" />
          </div>

          <div>
            <Label htmlFor="email">E-mail</Label>
            <Input id="email" type="email" placeholder="cliente@email.com" />
          </div>

          <div>
            <Label htmlFor="telefone">Telefone</Label>
            <Input id="telefone" placeholder="(11) 91234-5678" />
          </div>

          <div>
            <Label htmlFor="observacoes">Observações</Label>
            <Textarea id="observacoes" placeholder="Observações adicionais do cliente..." />
          </div>

          <div className="pt-4 flex justify-end">
            <Button className="bg-green-600 hover:bg-green-700 text-white px-6 py-2 rounded-full">
              Salvar Cliente
            </Button>
          </div>
        </CardContent>
      </Card>
    </div>
  );
};

export default CadastroCliente;
