import styled, { css } from 'styled-components'

import { isMobileDevice } from 'config/userAgent'

import { ButtonBase } from '../StreamPlayer/styled'

export const AirplayButton = styled(ButtonBase)`
  width: 24px;
  height: 24px;
  padding: 0;
  display: none;
  margin-right: 25px;

  ${isMobileDevice
    ? css`
      width: 22px;
      height: 22px;
      margin-right: 15px;
    `
    : ''};
`

export const AirplayIcon = styled.img`
  width: 24px;
  height: 24px;
`
