import { StyleSheet } from "react-native";
import {
  appColors,
  appFonts,
  fontSizes,
  windowHeight,
  windowWidth,
} from "@src/themes";

const MARKER_WIDTH = windowHeight(40);
const MARKER_HEIGHT = windowHeight(40);

const styles = StyleSheet.create({
  backView: {
    height: windowHeight(80),
    width: "100%",
    position: "absolute",
    zIndex: 2,
    alignItems:'center',
    shadowColor: appColors.blackColor,
    shadowOffset: { width: 0, height: 4 },
    shadowOpacity: 0.1,
    shadowRadius: 5,
    elevation: 1,
    borderBottomLeftRadius: windowWidth(20),
    borderBottomRightRadius: windowWidth(20),
    paddingHorizontal: windowWidth(25),
  },
  backButton: {
    width: windowHeight(35),
    height: windowHeight(35),
    borderColor: appColors.lightGray,
    borderRadius: windowHeight(35),
    borderWidth: windowWidth(2),
    alignItems: "center",
    justifyContent: "center",
  },
  textInputContainer: {
    position: "absolute",
    right: windowHeight(15),
    left: windowHeight(15),
    alignItems: "flex-start",
    borderRadius: windowHeight(8),
    zIndex: 10,
    bottom: windowHeight(90),
    borderWidth: windowHeight(0.42),
    borderColor: appColors.go,
  },
  textInput: {
    flex: 1,
    fontSize: fontSizes.FONT15,
    fontFamily: appFonts.medium,
  },
  pointerMarker: {
    position: "absolute",

    top: "50%",
    left: "50%",
    width: MARKER_WIDTH,
    height: MARKER_HEIGHT,
    transform: [
      { translateX: -(MARKER_WIDTH / 2) },
      { translateY: -MARKER_HEIGHT },
    ],
    alignItems: "center",
    justifyContent: "center",
    zIndex: 5,
  },
  confirmButton: {
    backgroundColor: appColors.blackColor,
    position: "absolute",
    height: windowHeight(40),
    alignItems: "center",
    justifyContent: "center",
    borderRadius: windowHeight(35),
    bottom: windowHeight(20),
    right: windowHeight(15),
    left: windowHeight(15),
    zIndex: 10,
    elevation: 5,
  },
  confirmText: {
    color: appColors.whiteColor,
    fontFamily: appFonts.semiBold,
  },
  pinImage: {
    width: windowHeight(27),
    height: windowHeight(27),
    resizeMode: "contain",
  },
  addressBtnView: {
    borderRadius: windowHeight(8),
    alignItems: "center",
    justifyContent: "center",
    marginHorizontal: windowHeight(10),
    marginVertical: windowHeight(10),
  },
  mapView: {
    flex: 1,
    height: "100%",
  },
  loaderContainer: {
    flex: 1,
    height: "100%",
    justifyContent: "center",
    alignItems: "center",
  },
});
export default styles;
