import type { Metadata } from "next";
import Link from "next/link";

export const metadata: Metadata = {
  title: "Safety Resources | AdultWorld",
  description:
    "Essential safety information including screening tips, red flags, emergency contacts, and reporting guides for escorts and clients.",
  openGraph: {
    title: "Safety Resources | AdultWorld",
    description:
      "Essential safety information including screening tips, red flags, emergency contacts, and reporting guides.",
  },
};

const sections = [
  {
    title: "Screening Tips",
    icon: (
      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M9 12l2 2 4-4m5.618-4.016A11.955 11.955 0 0112 2.944a11.955 11.955 0 01-8.618 3.04A12.02 12.02 0 003 9c0 5.591 3.824 10.29 9 11.622 5.176-1.332 9-6.03 9-11.622 0-1.042-.133-2.052-.382-3.016z" />
      </svg>
    ),
    items: [
      "Always verify identity before meeting — ask for a recent photo or video call",
      "Request references from other trusted providers or clients",
      "Use a screening service or verify through established community boards",
      "Google the phone number and email provided to check for red flags",
      "Trust your instincts — if something feels off, do not proceed",
      "Keep screening records in a secure, private location",
    ],
  },
  {
    title: "Red Flags to Watch For",
    icon: (
      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4.5c-.77-.833-2.694-.833-3.464 0L3.34 16.5c-.77.833.192 2.5 1.732 2.5z" />
      </svg>
    ),
    items: [
      "Refusing to provide any verification or screening information",
      "Pressuring you to meet immediately without proper communication",
      "Offering amounts significantly above or below market rates",
      "Requesting unusual payment methods (gift cards, crypto-only)",
      "Aggressive, threatening, or disrespectful language",
      "Requesting to meet at isolated or unfamiliar locations",
      "Inconsistent stories or details that don't add up",
      "Requesting services you haven't agreed to",
    ],
  },
  {
    title: "Emergency Contacts",
    icon: (
      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M3 5a2 2 0 012-2h3.28a1 1 0 01.948.684l1.498 4.493a1 1 0 01-.502 1.21l-2.257 1.13a11.042 11.042 0 005.516 5.516l1.13-2.257a1 1 0 011.21-.502l4.493 1.498a1 1 0 01.684.949V19a2 2 0 01-2 2h-1C9.716 21 3 14.284 3 6V5z" />
      </svg>
    ),
    items: [
      "Emergency Services: 999 (UK) / 112 (EU) / 911 (US)",
      "National Domestic Violence Hotline: 0808 2000 247 (UK)",
      "Samaritans: 116 123 (UK, free 24/7)",
      "National Human Trafficking Hotline: 08000 121 700 (UK)",
      "Crimestoppers (anonymous): 0800 555 111 (UK)",
      "SWEAT Helpline (Sex Worker support): Various local numbers",
    ],
  },
  {
    title: "Reporting on AdultWorld",
    icon: (
      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M3 21v-4m0 0V5a2 2 0 012-2h6.5l1 1H21l-3 6 3 6h-8.5l-1-1H5a2 2 0 00-2 2zm9-13.5V9" />
      </svg>
    ),
    items: [
      "Use the 'Report' button on any profile to flag suspicious activity",
      "Contact our support team at support@adultworld.ai with evidence",
      "Reports are reviewed within 24 hours by our safety team",
      "All reports are confidential — your identity is never shared",
      "Repeat offenders are permanently banned from the platform",
      "We cooperate with law enforcement when required by law",
    ],
  },
  {
    title: "Legal Information",
    icon: (
      <svg className="w-6 h-6" fill="none" stroke="currentColor" viewBox="0 0 24 24">
        <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={1.5} d="M3 6l3 1m0 0l-3 9a5.002 5.002 0 006.001 0M6 7l3 9M6 7l6-2m6 2l3-1m-3 1l-3 9a5.002 5.002 0 006.001 0M18 7l3 9m-3-9l-6-2m0-2v2m0 16V5m0 16H9m3 0h3" />
      </svg>
    ),
    items: [
      "Know the laws in your jurisdiction regarding adult services",
      "Keep records of all communications and agreements",
      "Understand your rights regarding privacy and data protection",
      "Consult with a legal professional if you have concerns",
    ],
    links: [
      { label: "Terms of Service", href: "/terms-of-service" },
      { label: "Privacy Policy", href: "/privacy-policy" },
      { label: "2257 Compliance", href: "/2257" },
      { label: "Modern Slavery Statement", href: "/slavery" },
    ],
  },
];

export default function SafetyPage() {
  return (
    <div className="max-w-4xl mx-auto">
      <div className="mb-8">
        <h1 className="text-3xl font-bold text-text mb-2">Safety Resources</h1>
        <p className="text-text-muted">
          Your safety is our priority. Review these guidelines to stay safe while using AdultWorld.
        </p>
      </div>

      <div className="bg-gold/10 border border-gold/30 rounded-lg p-4 mb-8 flex items-start gap-3">
        <svg className="w-6 h-6 text-gold shrink-0 mt-0.5" fill="none" stroke="currentColor" viewBox="0 0 24 24">
          <path strokeLinecap="round" strokeLinejoin="round" strokeWidth={2} d="M12 9v2m0 4h.01m-6.938 4h13.856c1.54 0 2.502-1.667 1.732-2.5L13.732 4.5c-.77-.833-2.694-.833-3.464 0L3.34 16.5c-.77.833.192 2.5 1.732 2.5z" />
        </svg>
        <div>
          <p className="text-gold font-semibold text-sm">Important</p>
          <p className="text-text-muted text-sm mt-1">
            If you are in immediate danger, call emergency services right away. These resources are
            informational and do not replace professional help.
          </p>
        </div>
      </div>

      <div className="space-y-6">
        {sections.map((section) => (
          <div key={section.title} className="bg-surface rounded-lg p-6">
            <div className="flex items-center gap-3 mb-4">
              <span className="text-gold">{section.icon}</span>
              <h2 className="text-xl font-semibold text-text">{section.title}</h2>
            </div>
            <ul className="space-y-2">
              {section.items.map((item, idx) => (
                <li key={idx} className="flex items-start gap-2 text-text-muted text-sm">
                  <span className="text-gold mt-1 shrink-0">&#8226;</span>
                  {item}
                </li>
              ))}
            </ul>
            {"links" in section && section.links && (
              <div className="mt-4 pt-4 border-t border-surface-light flex flex-wrap gap-3">
                {section.links.map((link) => (
                  <Link
                    key={link.href}
                    href={link.href}
                    className="text-gold hover:text-gold/80 text-sm font-medium transition-colors"
                  >
                    {link.label} &rarr;
                  </Link>
                ))}
              </div>
            )}
          </div>
        ))}
      </div>

      <div className="mt-8 bg-surface rounded-lg p-6 text-center">
        <h3 className="text-lg font-semibold text-text mb-2">Need Help?</h3>
        <p className="text-text-muted text-sm mb-4">
          If you need assistance or want to report something, our support team is here for you.
        </p>
        <div className="flex items-center justify-center gap-4">
          <Link
            href="/contact"
            className="bg-gold hover:bg-gold/90 text-black px-6 py-2.5 rounded-lg font-semibold transition-colors"
          >
            Contact Support
          </Link>
          <Link
            href="/help"
            className="bg-surface-light hover:bg-surface-light/80 text-text px-6 py-2.5 rounded-lg font-semibold transition-colors"
          >
            Help Center
          </Link>
        </div>
      </div>
      {/* Related Guides */}
      <div className="mt-12 pt-6 border-t border-surface-light">
        <p className="text-sm text-text-muted">
          Related:{" "}
          <Link href="/community-guidelines" className="text-gold hover:underline">Community Guidelines</Link>
          {" · "}
          <Link href="/client-etiquette" className="text-gold hover:underline">Client Etiquette</Link>
          {" · "}
          <Link href="/escort-guide" className="text-gold hover:underline">Escort Guide</Link>
        </p>
      </div>
    </div>
  );
}