import { styled } from "@mui/material/styles";
import { IconButton, TextField } from "@mui/material";
export const CustomIconButton = styled(IconButton)({
	backgroundColor: "transparent",
	"&:hover": {
		backgroundColor: "#272727",
	},
	"*:where([data-mui-color-scheme='dark']) &": {
		backgroundColor: "transparent",
		border: "none",
	},
});

// Custom TextField with different placeholder color
export const CustomTextField = styled(TextField)({
	"& .MuiInputBase-input::placeholder": {
		color: "#D9D8D8",
		opacity: 1,
	},
	"& .MuiInputBase-root.Mui-focused .MuiInputBase-input::placeholder": {
		color: "darkgray",
	},

});
    

