import makeStyles from '@mui/styles/makeStyles';
import { pxToRem } from '../../theme/typography';

export const useStyles = makeStyles((theme) => ({
  tableMainDiv: {
    marginTop: theme.spacing(2.0),
  },
  form: {
    marginTop: theme.spacing(1.5),
    padding: `${theme.spacing(2.0)} ${theme.spacing(2.4)}`,
    maxWidth: '440px',
  },
  passwordCheckListTitle: {
    marginLeft: theme.spacing(0.5),
    color: 'grey',
    fontStyle: 'italic',
  },
  passwordCheckList: {
    marginLeft: theme.spacing(0.5),
    fontStyle: 'italic',
  },
  footerMainDiv: {
    marginTop: theme.spacing(0.6),
    padding: theme.spacing(1.8),
    backgroundColor: '#E9EAEB',
  },
  modalFooter: {
    display: 'flex',
    justifyContent: 'flex-end',
    paddingRight: theme.spacing(0.6),
    '& .MuiButton-root ': {
      display: 'flex',
      justifyContent: 'center',
    },
  },
  cancelButton: {
    marginRight: theme.spacing(0.5),
  },
  userAccessModalMainBodyDiv: {
    backgroundColor: theme.palette.grey[35],
    borderRadius: theme.spacing(0.8),
  },
  userAccessModalMainBodyOuterDiv: {
    padding: `${theme.spacing(2.4)} ${theme.spacing(2.8)}`,
  },
  userAccessModalHeaderDiv: {
    padding: `${theme.spacing(1.0)} ${theme.spacing(2.4)}`,
  },
  checkBoxLabel: {
    marginLeft: theme.spacing(1.0),
  },
  userAccessModalContainerDiv: {
    padding: `${theme.spacing(0.9)} ${theme.spacing(2.4)}`,
  },
  checkboxDiv: {
    paddingTop: theme.spacing(0.9),
    paddingBottom: theme.spacing(0.9),
  },
  tableActionIcons: {
    marginRight: theme.spacing(1.4),
  },
  tableActionIconTile: {
    paddingTop: theme.spacing(2.0),
  },
  dateStyle: {
    color: theme.palette.grey[10],
    backgroundColor: theme.palette.grey[11],
    borderRadius: theme.spacing(3),
    paddingLeft: theme.spacing(1),
    paddingRight: theme.spacing(1),
    fontSize: pxToRem(14),
    display: 'inline-block',
  },
  adminTransferRequestApproveImageDiv: {
    margin: theme.spacing(0.5),
    marginLeft: theme.spacing(2.0),
  },
  adminTransferRequestApproveBody: {
    margin: theme.spacing(2.0),
    height: '80vh',
    display: 'flex',
    flexDirection: 'column',
    justifyContent: 'center',
    alignItems: 'center',
  },
  adminTransferRequestApproveIconGroup: {
    display: 'flex',
    flexDirection: 'column',
    justifyContent: 'center',
    alignItems: 'center',
  },
  adminTransferRequestApproveIcon: {
    width: '119px',
    height: '119px',
  },
  adminTransferRequestApproveText: {
    fontSize: pxToRem(18),
  },
  adminTransferRequestApproveContent: {
    fontSize: pxToRem(14),
    width: '60%',
    marginTop: theme.spacing(2.0),
    textAlign: 'center',
  },
  adminTransferRequestApproveVerificationSuccessfulText: {
    marginTop: theme.spacing(1.0),
  },
  loginButton: {
    fontFamily: 'Inter-Thin',
    width: '200px',
    height: '42px',
    marginTop: theme.spacing(4.0),
  },
}));
