import Feather from "@expo/vector-icons/Feather";
import { router } from "expo-router";
import React from "react";
import { ScrollView, Text, TouchableOpacity, View } from "react-native";

export default function LegalScreen() {
  return (
    <View style={{ flex: 1, backgroundColor: "hsl(220, 15%, 10%)" }}>


      <View
        style={{
          paddingTop: 18,
          paddingHorizontal: 16,
          paddingBottom: 6,
          flexDirection: "row",
          alignItems: "center",
          justifyContent: "space-between",
        }}
      >
        <Text
          style={{
            color: "white",
            fontSize: 20,
            fontWeight: "700",
            letterSpacing: 0.3,
          }}
        >
          Info
        </Text>

        <TouchableOpacity
          onPress={() => router.back()}
          accessibilityRole="button"
          accessibilityLabel="Modal schließen"
          style={{
            height: 40,
            width: 40,
            alignItems: "center",
            justifyContent: "center",
            borderRadius: 10,
            backgroundColor: "rgba(255,255,255,0.08)",
          }}
        >
          <Feather name="x" size={22} color="#FFFFFF" />
        </TouchableOpacity>
      </View>

      <ScrollView
        contentContainerStyle={{
          paddingHorizontal: 16,
          paddingBottom: 28,
        }}
        showsVerticalScrollIndicator={false}
      >
        {/* Impressum Card */}
        <View
          style={{
            backgroundColor: "rgba(255,255,255,0.05)",
            borderRadius: 14,
            padding: 16,
            gap: 10,
            marginTop: 8,
          }}
        >
          <Text style={{ color: "white", fontSize: 18, fontWeight: "700" }}>
            Impressum
          </Text>

          <View style={{ gap: 4 }}>
            <Text style={styles.mono}>Berg Autosoft</Text>
            <Text style={styles.mono}>Joe Felipe Berg</Text>
            <Text style={styles.mono}>Stöckener Straße 35</Text>
            <Text style={styles.mono}>30419 Hannover</Text>
          </View>

          <View style={{ height: 8 }} />

          <View style={{ gap: 4 }}>
            <Text style={styles.dim}>+49 1522 5642948</Text>
            <Text style={styles.dim}>kontakt@berg-autosoft.de</Text>
          </View>

          <View style={{ height: 8 }} />

          <View style={{ gap: 4 }}>
            <Text style={styles.dim}>Steuernummer: 25/103/17193</Text>
            <Text style={styles.dim}>USt-ID: DE361689728</Text>
          </View>
        </View>

        {/* Support Card */}
        <View
          style={{
            backgroundColor: "rgba(255,255,255,0.05)",
            borderRadius: 14,
            padding: 16,
            gap: 10,
            marginTop: 12,
          }}
        >
          <Text style={{ color: "white", fontSize: 18, fontWeight: "700" }}>
            Support
          </Text>

          <Text style={styles.body}>
            Sollten Sie Probleme bei der Nutzung der iOS- oder Android-App FLTR
            haben, wenden Sie sich bitte direkt an den Support.
          </Text>

          <View style={{ height: 6 }} />

          <Text style={styles.body}>Schreiben Sie eine E-Mail an:</Text>
          <Text style={[styles.mono, { fontSize: 15 }]}>
            developer@berg-autosoft.de
          </Text>

          <Text style={[styles.dim, { marginTop: 10 }]}>
            Wir bemühen uns, Ihr Anliegen so schnell wie möglich zu bearbeiten.
          </Text>
        </View>

        {/* Footer */}
        <View style={{ alignItems: "center", marginTop: 18 }}>
          <Text
            style={{
              color: "rgba(255,255,255,0.6)",
              fontSize: 12,
              letterSpacing: 0.2,
            }}
          >
            © 2025 Berg Autosoft
          </Text>
        </View>
      </ScrollView>
    </View>
  );
}

const styles = {
  mono: {
    color: "rgba(255,255,255,0.92)",
    fontSize: 16,
  } as const,
  dim: {
    color: "rgba(255,255,255,0.75)",
    fontSize: 14,
  } as const,
  body: {
    color: "rgba(255,255,255,0.88)",
    fontSize: 14,
    lineHeight: 20,
  } as const,
};