import { Palette } from '../index'

export type VerticalCardType = {
  verticalCard: {
    display: string
    flexDirection: string
    alignItems: string
    height: string
    maxHeight: string
    minHeight: string
    padding: string
    marginBottom: string
    cursor: string
    border: string
    borderRadius: string
    background: Palette | string
    color: Palette | string
  }
  verticalCardSelected: {
    background: Palette | string
    color: Palette | string
  }
}

export const VerticalCardStyles: VerticalCardType = {
  verticalCard: {
    display: 'flex',
    flexDirection: 'column',
    alignItems: 'center',
    height: 'auto',
    maxHeight: '280px',
    minHeight: '236px',
    padding: '20px',
    marginBottom: '24px',
    cursor: 'pointer',
    border: 'none',
    borderRadius: '8px',
    background: '#F6F6F6',
    color: '#202B47',
  },
  verticalCardSelected: {
    background: '#4B46EC',
    color: '#F6F6F6',
  },
}
