import styled from 'styled-components/macro'

import { customScrollbar, customStylesMixin } from 'features/Common'
import { T9n } from 'features/T9n'

import { OutlinedButton } from '../../styled'

export const AddSubscriptionModal = styled.div`
 width: 538px;
 height: 452px;
 display: flex;
 flex-direction: column;
 align-items: center;
`

export const ModalTitle = styled(T9n)`
  display: block;
  font-size: 24px;
  font-weight: normal;
`

export const Line = styled.hr`
  position:absolute;
  width: 100%;
  top: 40px;
  height: 1px;
  border: 1px solid #3F3F3F;
`

export const SaveButton = styled(OutlinedButton)`
  width: 192px;
  height: 36px;
  display: block;
  font-weight: normal;
  margin-left: auto;
  margin-top: auto;
`

export const SubscriptionsWrapper = styled.div`
  margin-top: 45px;
  width: 100%;
  height: 100%;
  overflow: auto;
  ${customScrollbar};
  ${customStylesMixin};
`