import { StyleSheet } from "react-native";
import {
  appColors,
  appFonts,
  fontSizes,
  windowHeight,
  windowWidth,
} from "@src/themes";
import { external } from "../../../styles/externalStyle";
import { commonStyles } from "../../../styles/commonStyle";

const styles = StyleSheet.create({
  container: {
    ...external.mb_15,
    paddingVertical: windowHeight(10),
    ...external.fd_row,
    ...external.ph_10,
    width: "98%",
    alignSelf: "center",
    borderBottomWidth: windowWidth(3),
    borderWidth: 0,
  },
  viewText: {
    width: windowHeight(31),
    height: windowHeight(31),
    paddingHorizontal: windowWidth(20),
    paddingVertical: windowHeight(14),
    borderRadius: windowHeight(25),
    backgroundColor: appColors.lightGreen,
    ...external.ai_center,
    ...external.js_center,
  },
  titleText: {
    ...commonStyles.regularText,
    color: appColors.primaryText,
    fontFamily: appFonts.medium,
    fontSize: fontSizes.FONT18,
  },
  subTitleText: {
    ...commonStyles.regularText,
    color: appColors.primaryText,
    fontFamily: appFonts.medium,
    fontSize: fontSizes.FONT18,
    paddingTop: windowHeight(2),
    width: "100%",
  },
  viewWidth: {
    width: windowWidth(20),
  },
  centerContainer: {
    ...external.ai_center,
    ...external.js_center,
    top: windowHeight(85),
    width: "90%",
    alignSelf: "center",
    paddingVertical: windowHeight(15),
    borderRadius: windowHeight(15),
  },
  image: {
    width: windowWidth(250),
    height: windowHeight(100),
  },
  title: {
    ...commonStyles.mediumTextBlack12,
    fontWeight: "700",
    fontSize: fontSizes.FONT22,
    marginTop: "9%",
  },
  text: {
    ...commonStyles.regularText,
    ...external.ti_center,
    ...external.ph_20,
    fontSize: fontSizes.FONT17,
    marginTop: windowHeight(14),
  },
  refreshButtonContainer: {
    width: "90%",
    marginTop: windowHeight(110),
    alignSelf: "center",
  },
});
export { styles };
