import { TextField } from '@mui/material'

type InputMuiProps = {
  label: string
  variant: 'standard' | 'filled' | 'outlined'
  type: string
}

export function InputMui({ label, variant, type }: InputMuiProps) {
  return (
    <TextField
      label={label}
      variant={variant}
      type={type}
      sx={{
        '& .MuiOutlinedInput-root': {
          '& fieldset': {
            borderColor: 'white', // Inicialmente transparente
          },
          '&:hover fieldset': {
            borderColor: 'white', // Mantém transparente ao passar o mouse
          },
          '&.Mui-focused fieldset': {
            borderColor: 'white', // Mantém transparente ao focar
          },
        },
        '& label.Mui-focused': {
          color: '#B7B7B7',
        },
        '& label': {
          color: 'white',
        },
        '& input': {
          color: 'white',
        },
      }}
    />
  )
}
