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

const styles = StyleSheet.create({
  slideContainer: {
    ...commonStyles.flexContainer,
  },
  languageContainer: {
    justifyContent: "space-between",
    alignItems: "center",
    position: "absolute",
    top: windowHeight(8),
    width: "100%",
    paddingHorizontal: windowWidth(5),
    zIndex: 1,
  },
  imageBackground: {
    width: "100%",
    height: "100%",
    marginBottom: windowHeight(40),
    resizeMode: "contain",
    bottom: windowHeight(23),
  },
  title: {
    ...commonStyles.mediumText23,
    marginTop: windowHeight(15),
    ...external.ti_center,
    fontFamily: appFonts.semiBold,
  },
  description: {
    ...commonStyles.regularText,
    paddingTop: windowHeight(12),
    width: "85%",
    ...external.as_center,
    fontSize: fontSizes.FONT19,
    lineHeight: windowHeight(18),
    ...external.ti_center,
    textAlign: "center",
  },
  backArrow: {
    width: windowHeight(138),
    height: windowHeight(38),
    borderRadius: windowHeight(34),
    backgroundColor: appColors.blackColor,
    alignItems: "center",
    justifyContent: "center",
    marginTop: windowHeight(38),
    marginBottom: 0,
  },
  img: {
    width: "100%",
    height: windowHeight(220),
    marginBottom: windowHeight(25),
  },
  activeStyle: {
    width: "6%",
    backgroundColor: appColors.primary,
    marginTop: windowHeight(45),
    height: windowHeight(5),
  },
  paginationStyle: {
    height: "25%",
    marginTop: windowHeight(85),
  },
  imageBgView: {
    ...commonStyles.flexContainer,
    ...external.js_end,
  },
  flagImage: {
    height: windowHeight(24),
    width: windowHeight(24),
    borderRadius: windowHeight(24),
  },
  downArrow: {
    paddingVertical: windowHeight(4),
    paddingHorizontal: windowWidth(5),
  },
  dropdownManu: {
    borderRadius: windowHeight(4.5),
    borderWidth: 0,
    marginHorizontal: windowWidth(15),
  },
  dropdownContainer: {
    width: windowWidth(180),
    borderWidth: 0,
    color: appColors.alertRed,
  },
  labelStyle: {
    fontFamily: appFonts.medium,
    fontSize: fontSizes.FONT19,
  },
  dropdown: {
    borderWidth: 0,
    backgroundColor: "transparent",
    width: "100%",
  },
  skipText: {
    color: appColors.primaryText,
    fontFamily: appFonts.medium,
    fontSize: fontSizes.FONT19,
  },
  dotStyles: {
    marginTop: windowHeight(35),
  },
  box: {
    paddingVertical: windowHeight(5),
    width: "100%",
    alignSelf: "center",
    paddingBottom: windowHeight(15),
    borderTopLeftRadius: windowWidth(20),
    borderTopRightRadius: windowWidth(20),
  },
  line: {
    height: windowHeight(4.8),
    width: windowWidth(55),
    backgroundColor: appColors.primary,
    alignSelf: "center",
    borderRadius: windowWidth(20),
    marginTop: windowHeight(8),
  },
  headerView: {
    height: windowHeight(70),
    justifyContent: "center",
    borderBottomLeftRadius: windowWidth(20),
    borderBottomRightRadius: windowWidth(20),
    elevation: 1,
  },
});
export { styles };
