import styled from 'styled-components';
import css from '@styled-system/css';
import { BoxBlock, TextBlock } from "../../../modules";
import { AlignCenter, AJCenter } from "../../../globalStyled";
export const RadioWrapperDiv = styled(BoxBlock) `
  position: relative;
  min-width: 20px;

  input {
    opacity: 0;
    position: absolute;
    left: -999999px;
  }
`;
export const RadioWrapperInnerDiv = styled(BoxBlock) `
  ${AlignCenter}
  flex-wrap: nowrap;
`;
export const RadioText = styled(TextBlock) ``;
export const RadioTextBlockDiv = styled(TextBlock) `
  cursor: pointer;
  ${css({ ml: 3 })}

  @media screen and (min-width: 1920px) {
    width: 70%;
  }
`;
export const RadioIconBlockDiv = styled(BoxBlock) `
  ${AJCenter}
  cursor: pointer;
  height: 24px;
  width: 24px;
  flex: 0 0 24px;
`;
