minecraft-tools/app/styles.ts

// styles.ts
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: {
    alignSelf: "flex-start",
    marginTop: 0,
    marginBottom: 20,
    paddingVertical: 8,
    paddingHorizontal: 15,
    backgroundColor: "rgba(106, 90, 205, 0.7)",
    borderRadius: 8,
    marginLeft: 0,
  },
  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%",
  },
  converterScrollContent: {
    flexGrow: 1,
    padding: 20,
    alignItems: "center",
    width: "100%",
  },
  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",
  },
  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",
  },
});