import { styled } from "@mui/material"
import { SectionCard } from "../SectionCard/SectionCard"

const AccountIQIcon = styled('div')(({ theme }) => ({
  fontWeight: 'bold',
  color: '#4ecdc4',
  fontSize: '1rem',
  marginRight: theme.spacing(1),
}));

export const AccountIQ = () => {

  return (
    <SectionCard
      title="AccountIQ"
      icon={<AccountIQIcon>AIQ</AccountIQIcon>
      }
      items={[
        { title: 'Automatically reconcile your transactions' },
        { title: 'Live wallet balances from providers' },
        { title: 'Gaming provider financial overviews' },
        { title: 'Learn more' },
      ]}
    />
  )
}