import { StyleSheet } from "react-native";

export const styles = StyleSheet.create({
  // --- Global / Reusable Styles ---
  appContainer: {
    flex: 1,
    backgroundColor: "#2e2e2e",
  },
  mainTitle: {
    fontSize: 38,
    fontWeight: "bold",
    color: "#fff",
    textAlign: "center",
    paddingTop: 60,
    marginBottom: 20,
    textShadowColor: "rgba(0, 0, 0, 0.75)",
    textShadowOffset: { width: 2, height: 2 },
    textShadowRadius: 5,
    fontFamily: "Minecraft",
  },
  gridContainer: {
    flex: 1,
    flexDirection: "row",
    flexWrap: "wrap",
  },
  gridItem: {
    width: "50%",
    height: "50%",
  },
  touchableWrapper: {
    flex: 1,
  },
  imageBackground: {
    flex: 1,
    justifyContent: "center",
    alignItems: "center",
    padding: 10,
  },
  overlay: {
    ...StyleSheet.absoluteFillObject,
    backgroundColor: "rgba(0, 0, 0, 0.5)",
    justifyContent: "center",
    alignItems: "center",
  },
  linkButtonText: {
    color: "#fff",
    fontSize: 20,
    fontWeight: "bold",
    textAlign: "center",
    textShadowColor: "rgba(0, 0, 0, 0.7)",
    textShadowOffset: { width: 1, height: 1 },
    textShadowRadius: 3,
    fontFamily: "Minecraft",
  },
  backButton: {
    marginTop: 20,
    padding: 10,
    backgroundColor: "rgba(255,255,255,0.2)",
    borderRadius: 8,
    alignSelf: "flex-start"
  },
  backButtonText: {
      color: "#fff",
      fontSize: 16,
      fontWeight: "bold",
      fontFamily: "Minecraft"
  },
  
  // --- Nether Portal Calculator ---
  converterScreenRoot: {
    flex: 1,
    backgroundColor: "#000",
  },
  converterBackgroundImage: {
    ...StyleSheet.absoluteFillObject,
    resizeMode: "cover",
  },
  converterBackgroundOverlay: {
    ...StyleSheet.absoluteFillObject,
    backgroundColor: "rgba(0, 0, 0, 0.6)",
  },
  converterContentWrapper: {
    flex: 1,
  },
  converterContainer: {
    flex: 1,
    width: "100%",
    paddingHorizontal: 20
  },
  converterScrollContent: {
    flexGrow: 1,
    padding: 20,
    paddingBottom: 20
  },
  converterTitle: {
    fontSize: 44,
    fontWeight: "bold",
    textAlign: "center",
    color: "#fff",
    marginBottom: 30,
    marginTop: 20,
    textShadowColor: "rgba(0, 0, 0, 0.7)",
    textShadowOffset: { width: 1, height: 1 },
    textShadowRadius: 3,
    fontFamily: "Minecraft",
  },
  dimensionContainer: {
    width: "90%",
    padding: 15,
    marginBottom: 20,
    alignItems: "center",
  },
  dimensionTitle: {
    color: "#fff",
    fontSize: 28,
    fontWeight: "bold",
    marginBottom: 15,
    textShadowColor: "rgba(0, 0, 0, 0.5)",
    textShadowOffset: { width: 1, height: 1 },
    textShadowRadius: 2,
    fontFamily: "Minecraft",
  },
  coordinatesRow: {
    flexDirection: "row",
    justifyContent: "space-between",
    width: "100%",
  },
  coordInputGroup: {
    flex: 1,
    marginHorizontal: 5,
    flexDirection: "row",
    alignItems: "center",
    justifyContent: "center",
  },
  coordInputLabel: {
    color: "#e0e0e0",
    fontSize: 16,
    marginRight: 8,
    fontWeight: "bold",
    textShadowColor: "rgba(0, 0, 0, 0.5)",
    textShadowOffset: { width: 1, height: 1 },
    textShadowRadius: 2,
    fontFamily: "Minecraft",
  },
  coordTextInput: {
    backgroundColor: "rgba(58, 58, 58, 0.8)",
    color: "#fff",
    paddingVertical: 8,
    paddingHorizontal: 10,
    borderRadius: 8,
    fontSize: 18,
    borderWidth: 1,
    borderColor: "#555",
    flex: 1,
    textAlign: "center",
    fontFamily: "Minecraft",
  },
  clearButton: {
    backgroundColor: "#d32f2f",
    paddingVertical: 12,
    paddingHorizontal: 25,
    borderRadius: 8,
    marginTop: 30,
  },
  clearButtonText: {
    color: "#fff",
    fontSize: 16,
    fontWeight: "bold",
    fontFamily: "Minecraft",
  },

  // --- Todo List ---
  todoInputContainer: {
    flexDirection: "row",
    width: "90%",
    backgroundColor: "rgba(255,255,255,0.8)",
    borderRadius: 10,
    padding: 5,
    marginBottom: 20,
    alignItems: "center",
  },
  todoInputField: {
    flex: 1,
    paddingVertical: 10,
    paddingHorizontal: 15,
    fontSize: 16,
    color: "#333",
    fontFamily: "Minecraft",
  },
  addTodoButton: {
    backgroundColor: "#4CAF50",
    paddingVertical: 10,
    paddingHorizontal: 20,
    borderRadius: 8,
    marginLeft: 10,
  },
  addTodoButtonText: {
    color: "#fff",
    fontSize: 16,
    fontWeight: "bold",
  },
  todoListContainer: {
    width: "90%",
  },
  todoItem: {
    flexDirection: "row",
    justifyContent: "space-between",
    alignItems: "center",
    backgroundColor: "rgba(255,255,255,0.9)",
    borderRadius: 8,
    paddingVertical: 12,
    paddingHorizontal: 15,
    marginBottom: 10,
    shadowColor: "#000",
    shadowOffset: { width: 0, height: 2 },
    shadowOpacity: 0.1,
    shadowRadius: 3,
    elevation: 3,
  },
  todoText: {
    flex: 1,
    fontSize: 18,
    color: "#333",
    fontFamily: "Minecraft",
  },
  removeTodoButton: {
    backgroundColor: "#FF6347",
    paddingVertical: 5,
    paddingHorizontal: 10,
    borderRadius: 5,
    marginLeft: 15,
  },
  removeTodoButtonText: {
    color: "#fff",
    fontWeight: "bold",
    fontSize: 16,
  },
  placeholderText: {
    color: "#fff",
    textAlign: "center",
    marginTop: 20,
    fontSize: 18,
    fontStyle: "italic",
    textShadowColor: "rgba(0, 0, 0, 0.75)",
    textShadowOffset: { width: -1, height: 1 },
    textShadowRadius: 5,
    fontFamily: "Minecraft",
  },

  // --- Saved Coordinates ---
  coordinateInputSection: {
      flexDirection: "column",
      backgroundColor: "rgba(30,30,30,0.8)",
      borderRadius: 10,
      padding: 15,
      marginBottom: 20,
      shadowColor: "#000",
      shadowOffset: { width: 0, height: 4 },
      shadowOpacity: 0.3,
      shadowRadius: 5,
      elevation: 8
  },
  coordinateInputField: {
      flex: 1,
      backgroundColor: "#444",
      color: "#eee",
      padding: 12,
      borderRadius: 8,
      fontSize: 16,
      marginBottom: 10,
      height: 50,
      fontFamily: "Minecraft"
  },
  coordinateValuesInputRow: {
      flexDirection: "row",
      justifyContent: "space-between",
      marginBottom: 10
  },
  coordinateValueInput: {
      flex: 1,
      backgroundColor: "#444",
      color: "#eee",
      padding: 12,
      borderRadius: 8,
      fontSize: 16,
      marginHorizontal: 5,
      height: 50,
      fontFamily: "Minecraft"
  },
  addCoordinateButton: {
      backgroundColor: "#2196F3",
      padding: 15,
      borderRadius: 8,
      alignItems: "center",
      justifyContent: "center"
  },
  addCoordinateButtonText: {
      color: "#fff",
      fontSize: 18,
      fontWeight: "bold",
      fontFamily: "Minecraft"
  },
  savedCoordinatesListContainer: {
      backgroundColor: "rgba(30,30,30,0.8)",
      borderRadius: 10,
      padding: 15,
      minHeight: 100,
      shadowColor: "#000",
      shadowOffset: { width: 0, height: 4 },
      shadowOpacity: 0.3,
      shadowRadius: 5,
      elevation: 8
  },
  coordinateListItem: {
      flexDirection: "row",
      justifyContent: "space-between",
      alignItems: "center",
      backgroundColor: "#555",
      borderRadius: 8,
      padding: 15,
      marginBottom: 10,
      shadowColor: "#000",
      shadowOffset: { width: 0, height: 2 },
      shadowOpacity: 0.2,
      shadowRadius: 3,
      elevation: 3
  },
  coordinateTextInfo: {
      flex: 1,
      marginRight: 15,
      fontFamily: "Minecraft"
  },
  coordinateListName: {
      color: "#FFD700",
      fontSize: 18,
      fontWeight: "bold",
      marginBottom: 5,
      fontFamily: "Minecraft"
  },
  coordinateListValues: {
      color: "#ADD8E6",
      fontSize: 16
  },
  removeCoordinateButton: {
      backgroundColor: "#FF5252",
      width: 35,
      height: 35,
      borderRadius: 17.5,
      justifyContent: "center",
      alignItems: "center"
  },
  removeCoordinateButtonText: {
      color: "#fff",
      fontSize: 18,
      fontWeight: "bold",
      fontFamily: "Minecraft"
  },

  // MOTD
  textInput: {
    backgroundColor: "rgba(255, 255, 255, 0.1)",
    borderRadius: 10,
    padding: 15,
    fontSize: 16,
    color: "#fff",
    marginBottom: 20,
    minHeight: 80,
    textAlignVertical: "top",
    borderColor: "#4CAF50",
    borderWidth: 1
  },
  sectionTitle: {
      fontSize: 20,
      fontWeight: "bold",
      color: "#fff",
      marginBottom: 10,
      marginTop: 15
  },
  buttonRow: {
      flexDirection: "row",
      flexWrap: "wrap",
      justifyContent: "center",
      marginBottom: 15
  },
  colorButton: {
      backgroundColor: "#1e88e5",
      paddingVertical: 8,
      paddingHorizontal: 12,
      borderRadius: 5,
      margin: 5
  },
  formatButton: {
      backgroundColor: "#ffb300",
      paddingVertical: 8,
      paddingHorizontal: 12,
      borderRadius: 5,
      margin: 5
  },
  buttonText: {
      color: "#fff",
      fontWeight: "bold",
      fontSize: 14
  },
  previewContainer: {
    backgroundColor: "#000",
    padding: 15,
    borderRadius: 10,
    minHeight: 60,
    justifyContent: "center",
    marginBottom: 20,
    borderColor: "#555",
    borderWidth: 1,
  },
  previewBaseText: {
    fontSize: 18,
  },
  saveButton: {
      backgroundColor: "#4CAF50",
      paddingVertical: 15,
      borderRadius: 10,
      alignItems: "center",
      marginBottom: 20
  },
  saveButtonText: {
      color: "#fff",
      fontSize: 18,
      fontWeight: "bold"
  },
  noMotdsText: {
      color: "#ccc",
      textAlign: "center",
      fontStyle: "italic",
      marginTop: 10
  },
  savedMotdsContainer: {
      backgroundColor: "rgba(255, 255, 255, 0.1)",
      borderRadius: 10,
      padding: 10
  },
  savedMotdItem: {
      flexDirection: "row",
      justifyContent: "space-between",
      alignItems: "center",
      backgroundColor: "rgba(0, 0, 0, 0.4)",
      padding: 10,
      borderRadius: 8,
      marginBottom: 8,
      borderWidth: 1,
      borderColor: "#333"
  },
  savedMotdText: {
      color: "#eee",
      fontSize: 16,
      flexShrink: 1
  },
  deleteButton: {
      backgroundColor: "#e53935",
      paddingVertical: 5,
      paddingHorizontal: 10,
      borderRadius: 5
  },
  deleteButtonText: {
      color: "#fff",
      fontWeight: "bold"
  }
});