coloca um padding na seleção de tipo de cadastro e coloca funcionando, não meche no Clientes.tsx:
clientes.tsx:
 function Cadastrar(){   

    const [tipo_cadastro, setTipo_cadastro] = useState(0);
    function Tipocadastro(){
        if (tipo_cadastro === 0){
            return(<ClientesFisica />)
        } else if (tipo_cadastro === 1){
            return(<ClientesJuridica />)
        } else {
            return("foi")
        }
        return("vaisefoder")
    }

        return(
            <div>
                <div className="Voltar">
                    <Link to="../Cadastrar">Voltar</Link>
                </div>
                <label>
                Tipo de Cadastro:
                <select
    name="tipodecadastro"
    onChange={(event) => {
        if (event.target.value === "fisica"){
        setTipo_cadastro(0);
        }else{
        setTipo_cadastro(1  );
        }
    }}
    >
                        <option value="fisica">Pessoa Fisica</option>
                        <option value="juridica">Pessoa Juridica</option>
                    </select>   



Clientes-Fisica.tsx:
import React, { useState } from "react";
import "./Clientes.css";
import {
  TextField,
  Select,
  MenuItem,
  InputLabel,
  FormControl,
  Button,
  RadioGroup,
  FormControlLabel,
  Radio,
} from "@mui/material";

function ClientesFisica() {
  const [nome, setNome] = useState("");
  const [numero, setNumero] = useState("");
  const [categoria, setCategoria] = useState("");
  const [birthDate, setBirthDate] = useState("");
  const [gender, setGender] = useState("");
  const [cpf, setCpf] = useState("");
  const [cellphone, setCellphone] = useState("");
  const [email, setEmail] = useState("");
  const [website, setWebsite] = useState("");
  const [observations, setObservations] = useState("");
  const [photoPreview, setPhotoPreview] = useState<string | undefined>(undefined);
  const [tipoCadastro, setTipoCadastro] = useState("fisica");

  const handlePhotoChange = (event: React.ChangeEvent<HTMLInputElement>) => {
    const file = event.target.files?.[0];
    if (file) {
      const reader = new FileReader();
      reader.onloadend = () => {
        setPhotoPreview(reader.result as string);
      };
      reader.readAsDataURL(file);
    }
  };

  const handleSubmit = (event: React.FormEvent) => {
    event.preventDefault();
    // Lógica para enviar os dados do formulário
  };

  return (
    <div>
      <FormControl component="fieldset" style={{ marginBottom: '20px' }}>
        <RadioGroup
          row
          aria-label="tipoCadastro"
          name="tipoCadastro"
          value={tipoCadastro}
          onChange={(e) => setTipoCadastro(e.target.value)}
        >
          <FormControlLabel
            value="fisica"
            control={<Radio color="primary" />}
            label="Pessoa Física"
          />
          <FormControlLabel
            value="juridica"
            control={<Radio color="primary" />}
            label="Pessoa Jurídica"
          />
        </RadioGroup>
      </FormControl>

      <form className="formulario" onSubmit={handleSubmit}>
        <div className="formulario-inputs">
          <div className="formulario-inputs-row">
            <TextField
              label="Nome"
              value={nome}
              onChange={(e) => setNome(e.target.value)}
              fullWidth
              variant="outlined"
            />
            <TextField
              label="Número"
              value={numero}
              onChange={(e) => setNumero(e.target.value)}
              fullWidth
              variant="outlined"
            />
          </div>

          <div className="formulario-inputs-row">
            <FormControl fullWidth variant="outlined">
              <InputLabel id="categoria-label">Categoria</InputLabel>
              <Select
                labelId="categoria-label"
                value={categoria}
                label="Categoria"
                onChange={(e) => setCategoria(e.target.value as string)}
              >
                <MenuItem value="">
                  <em>Selecione</em>
                </MenuItem>
                <MenuItem value="categoria1">Categoria 1</MenuItem>
                <MenuItem value="categoria2">Categoria 2</MenuItem>
                <MenuItem value="categoria3">Categoria 3</MenuItem>
              </Select>
            </FormControl>

            <TextField
              label="Data de Nascimento"
              type="date"
              value={birthDate}
              onChange={(e) => setBirthDate(e.target.value)}
              InputLabelProps={{
                shrink: true,
              }}
              fullWidth
              variant="outlined"
            />

            <FormControl fullWidth variant="outlined">
              <InputLabel id="gender-label">Gênero</InputLabel>
              <Select
                labelId="gender-label"
                value={gender}
                label="Gênero"
                onChange={(e) => setGender(e.target.value as string)}
              >
                <MenuItem value="">
                  <em>Selecione</em>
                </MenuItem>
                <MenuItem value="masculino">Masculino</MenuItem>
                <MenuItem value="feminino">Feminino</MenuItem>
                <MenuItem value="outro">Outro</MenuItem>
              </Select>
            </FormControl>
          </div>

          <div className="formulario-inputs-row">
            <TextField
              label="CPF"
              value={cpf}
              onChange={(e) => setCpf(e.target.value)}
              fullWidth
              variant="outlined"
            />
            <TextField
              label="Celular"
              value={cellphone}
              onChange={(e) => setCellphone(e.target.value)}
              fullWidth
              variant="outlined"
            />
          </div>

          <div className="formulario-inputs-row">
            <TextField
              label="Email"
              type="email"
              value={email}
              onChange={(e) => setEmail(e.target.value)}
              fullWidth
              variant="outlined"
            />
            <TextField
              label="Site"
              type="url"
              value={website}
              onChange={(e) => setWebsite(e.target.value)}
              fullWidth
              variant="outlined"
            />
          </div>

          <div
            className="formulario-inputs-row"
            style={{ flexDirection: "column" }}
          >
            <TextField
              label="Observações"
              value={observations}
              onChange={(e) => setObservations(e.target.value)}
              fullWidth
              multiline
              rows={4}
              variant="outlined"
            />
          </div>
        </div>

        <div className="formulario-img">
          <div
            className="photo-section"
            onClick={() => document.getElementById("photo-input")?.click()}
          >
            <input
              type="file"
              id="photo-input"
              style={{ display: "none" }}
              accept="image/*"
              onChange={handlePhotoChange}
            />
            <div className="photo-preview">
              {photoPreview ? (
                <img src={photoPreview} alt="Pré-visualização da foto" />
              ) : (
                <span style={{ color: '#fff' }}>Clique para adicionar uma foto</span>
              )}
            </div>
          </div>
          <Button variant="contained" type="submit">
            Enviar
          </Button>
        </div>
      </form>
    </div>
  );
}

export default ClientesFisica;

Clientes.css:

.formulario {
  display: flex;
  padding: 20px;
  border-radius: 8px;
}

.formulario-inputs {
  flex: 2;
  display: flex;
  flex-direction: column;
  padding-right: 20px;
}

.formulario-inputs-row {
  display: flex;
  gap: 16px;
  margin-bottom: 16px;
}

.formulario-inputs-row > .MuiFormControl-root,
.formulario-inputs-row > .MuiTextField-root {
  flex: 1;
}

.formulario-img {
  flex: 1;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.photo-section {
  border: 2px dashed #666;
  padding: 1rem;
  border-radius: 8px;
  cursor: pointer;
  width: 200px;
  height: 260px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background-color: #222;
}

.photo-preview {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.photo-preview img {
  max-width: 100%;
  max-height: 100%;
  object-fit: cover;
}

button,
.MuiButton-root {
  padding: 0.75rem 1.5rem;
  background-color: #007bff !important;
  color: white !important;
  border: none;
  border-radius: 4px;
  cursor: pointer;
  margin-top: 16px;
  text-transform: none;
}

button:hover,
.MuiButton-root:hover {
  background-color: #0056b3 !important;
}

.MuiInputBase-input,
.MuiInputLabel-root,
.MuiSelect-icon {
  color: #fff !important;
}

.MuiOutlinedInput-root {
  background-color: #333 !important;
}

.MuiInputBase-root::after,
.MuiInputBase-root::before {
  border-bottom: 1px solid #fff !important;
}

.MuiFormLabel-root.Mui-focused {
  color: #007bff !important;
}

.MuiOutlinedInput-notchedOutline {
  border-color: #fff !important;
}

.MuiInputBase-root:hover .MuiOutlinedInput-notchedOutline {
  border-color: #007bff !important;
}

.MuiRadio-root .MuiSvgIcon-root {
  fill: #fff;
}

.MuiFormControlLabel-label {
  color: #fff;
}