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

const styles = StyleSheet.create({
  container: {
    ...commonStyles.flexContainer,
  },
  headerContainer: {
    backgroundColor: appColors.whiteColor,
    height: windowHeight(60),
    justifyContent: "center",
  },
  appPagesContainer: {
    width: "90%",
    backgroundColor: appColors.whiteColor,
    marginTop: windowHeight(35),
    borderRadius: windowHeight(15),
    marginHorizontal: windowHeight(16),
    paddingHorizontal: windowWidth(16),
    paddingVertical: windowHeight(9),
    shadowColor: appColors.blackColor,
    shadowOffset: { width: 0, height: 4 },
    shadowOpacity: 0.1,
    shadowRadius: 5,
    elevation: 1,
    borderColor: appColors.whiteColor,
  },
  listItemContainer: {
    ...external.fd_row,
    ...external.ai_center,
    marginVertical: windowHeight(9),
  },
  iconContainer: {
    width: windowHeight(35),
    height: windowHeight(35),
    backgroundColor: appColors.whiteColor,
    borderRadius: windowHeight(35),
    ...external.ai_center,
    ...external.js_center,
    borderWidth: windowWidth(2),
    borderColor: appColors.lightGray,
  },
  listItemText: {
    ...commonStyles.regularText,
    color: appColors.primaryText,
    marginHorizontal: windowHeight(8),
    flexGrow: 0.95,
  },
  symbolView: {
    width: windowHeight(32),
    height: windowHeight(32),
    alignItems: "center",
    justifyContent: "center",
    borderColor: appColors.blackColor,
    borderWidth: windowHeight(1),
    borderRadius: windowWidth(25),
  },
  flagImage: {
    width: windowHeight(30),
    height: windowHeight(30),
    borderRadius: windowHeight(30),
  },
  updateButton: {
    marginBottom: windowHeight(3),
    marginTop: windowHeight(12),
  },
  updateButton1: {
    marginTop: windowHeight(9.5),
    marginBottom: windowHeight(2),
  },
  lineView: {
    marginTop: windowHeight(1.5),
  },
  updateButton2: {
    marginBottom: windowHeight(10),
    top: windowHeight(10),
  },
  symbol: {
    color: appColors.blackColor,
  },
  languageContainer: {
    marginTop: windowHeight(3),
  },
  line: {
    height: windowHeight(4.5),
    width: "108%",
    backgroundColor: appColors.loaderPrimary,
    alignSelf: "center",
    marginVertical: windowHeight(3),
  },
});
export { styles };
