import { styled } from '@mui/material/styles'
import { Box, IBoxProps } from '@ntpkunity/controls'

export const ControlWrap = styled(
  Box,
  {}
)<Partial<IBoxProps>>(({ theme }) => ({
  '&.control-wrap': {
    display: 'flex',
    justifyContent: 'center',
    flexDirection: 'column',
    width: '100%',
    '.text-primary': {
      color: theme.palette.primary.main
    },
    '.text-muted': {
      color: theme.palette.grey[600]
    },
    '.decoration-none': {
      textDecoration: 'none'
    },
    '.fp-link': {
      a: {
        color: 'rgba(0,0,0,0.6)',
        paddingLeft: 15
      }
    },
    '.u-form-group': {
      '.u-form-control': {
        '&.MuiInputBase-adornedEnd': {
          svg: {
            path: {
              stroke: theme.palette.grey[300]
            }
          },
          cursor: 'pointer'
        }
      }
    }
  }
}))
