import styled from 'styled-components/native';
import { getTheme, ifStyle } from '../../utils/helpers';
import Icon from '../Icon';
import TypographyComponent from '../Typography';
const isThemePrimary = ifStyle('isThemePrimary');
const isIOSPlatform = ifStyle('isIOSPlatform');
const spacingSm = getTheme('spacing.sm');
const spacingMd = getTheme('spacing.md');
const getThemePrimaryContrastTextColor = (props) => isThemePrimary(getTheme('brand.primary.contrast')(props), getTheme('info.contrast')(props))(props);
const getThemePrimaryContrastBackgroundColor = (props) => isThemePrimary(getTheme('brand.primary.main')(props), getTheme('background.z4')(props))(props);
export const Wrapper = styled.View `
  ${isIOSPlatform('overflow: hidden; padding-bottom: 5px;', '')};
`;
export const ContentWrapper = styled.View `
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  padding-horizontal: ${spacingMd}px;
  padding-vertical: ${spacingMd}px;
  height: 64px;
  background-color: ${getThemePrimaryContrastBackgroundColor};
  ${isIOSPlatform('', 'elevation: 3;')};
`;
export const TextWrapper = styled.View `
  flex: 1;
  align-items: center;
`;
export const Title = styled(TypographyComponent).attrs({
    variant: 'lg',
}) `
  color: ${getThemePrimaryContrastTextColor};
  font-weight: bold;
`;
export const Subtitle = styled(TypographyComponent).attrs({
    variant: 'sm',
}) `
  color: ${getThemePrimaryContrastTextColor};
  margin-top: ${spacingSm}px;
`;
export const StyledIcon = styled(Icon).attrs((props) => ({
    color: getThemePrimaryContrastTextColor(props),
})) ``;
//# sourceMappingURL=styles.js.map