import { Platform, Dimensions } from 'react-native';

import EStyleSheet from 'react-native-extended-stylesheet';

import { Colors, Fonts, Metrics } from '../../../theme';
import FontHelper from '../../../helpers/FontHelper';
const { width, height } = Dimensions.get('window');

export default EStyleSheet.create({
  // header: {
  //   width: '100%',
  //   height: '55rem',
  //   flexDirection: 'row',
  //   backgroundColor: Colors.white,
  //   alignItems: 'center',
  //   position: 'absolute',
  //   top: 0,
  //   zIndex: 99999
  // },
  header: {
    height: width / 1.29,
    width,
    alignSelf: 'center',
    position: 'absolute',
    top: 0
    // zIndex: 99999
  },
  headerBlue: {
    position: 'absolute',
    top: 0,
    alignItems: 'center',
    alignSelf: 'center',
    width: '100%',
    height: '100%'
  },
  bigHeaderImg: {
    height: width / 1.29,
    width,
    alignSelf: 'center'
  },
  transparent: {
    backgroundColor: 'transparent',
    ...Platform.select({
      ios: {
        shadowColor: null,
        shadowOffset: null,
        shadowOpacity: null
      },
      android: {
        elevation: null
      }
    })
  },
  left: {
    flexDirection: 'row',
    justifyContent: 'flex-start',
    alignItems: 'center',
    width: '15%',
    position: 'absolute',
    left: 0,
    paddingTop: Metrics.statusBarHeight
  },
  right: {
    flexDirection: 'row',
    justifyContent: 'flex-end',
    alignItems: 'center',
    width: '15%',
    height: '100%',
    position: 'absolute',
    right: 0
  },
  title: {
    paddingHorizontal: '10rem',
    flexDirection: 'row',
    justifyContent: 'center',
    alignItems: 'center',
    position: 'absolute',
    width: '70%',
    height: '100%',
    left: '15%'
  },
  titleTxt: {
    ...Fonts.style.semiBoldWhite,
    fontSize: '18rem',
    color: Colors.black,
    top: '5rem',
    '@media android': {
      top: 0
    }
  },
  backImg: {
    height: '16rem',
    width: '24rem',
    marginLeft: '24rem'
  },
  backWImg: {
    height: '32rem',
    width: '32rem'
  },
  backBtn: {
    flex: 1,
    paddingVertical: '20rem'
  },
  gStyle2: {
    height: '75rem',
    width: '150rem',
    borderBottomLeftRadius: '90rem',
    borderBottomRightRadius: '90rem',
    marginLeft: '50rem',
    opacity: 0.1,
    position: 'absolute',
    left: 0,
    top: 0
  },
  gStyle3: {
    height: '100rem',
    width: '100rem',
    opacity: 0.1,
    borderBottomRightRadius: '80rem',
    position: 'absolute',
    left: 0,
    top: 0
  },
  gStyle4: {
    height: '50rem',
    width: '50rem',
    opacity: 0.4,
    borderRadius: '30rem',
    left: '75rem',
    top: '85rem',
    position: 'absolute'
  }
});
