import { Tv, Music, Mic2, Calendar, Globe } from "lucide-react";
import Header from "@/components/header";
import Footer from "@/components/footer";

export default function AboutPage() {
  return (
    <div className="min-h-screen bg-background">
      <Header />
      <main className="max-w-4xl mx-auto px-4 sm:px-6 lg:px-8 py-8">
        <div className="flex items-center gap-3 mb-6">
          <Tv className="w-7 h-7 text-primary" />
          <h1 className="text-3xl font-bold text-foreground" data-testid="text-about-title">
            Über FOLX TV
          </h1>
        </div>

        <div className="bg-card rounded-lg border border-card-border p-6 mb-6" data-testid="section-about-intro">
          <p className="text-card-foreground leading-relaxed text-[15px]">
            FOLX TV ist Ihr Fernsehsender für volkstümliche Musik und Schlager. Der Sender präsentiert exklusiven Content aus der Welt der volkstümlichen Musik und des Schlagers. Über 90 % des Programms werden von FOLX NETWORK selbst produziert und bieten den Zuschauern eine abwechslungsreiche Auswahl an Musikvideos, Live-Shows und Unterhaltung mit den beliebtesten Stars der Szene.
          </p>
        </div>

        <div className="bg-card rounded-lg border border-card-border overflow-hidden mb-6" data-testid="section-about-empfang">
          <div className="flex items-center gap-3 px-5 py-4 border-b border-card-border bg-muted/20">
            <Globe className="w-4 h-4 text-primary" />
            <h2 className="text-lg font-bold text-card-foreground">Empfang</h2>
          </div>
          <div className="px-5 py-4">
            <p className="text-muted-foreground text-sm leading-relaxed">
              FOLX TV ist heute über IPTV-Plattformen und Kabelnetze in Deutschland, Österreich und der Schweiz empfangbar, unter anderem über MagentaTV, Zattoo, O2 TV, A1 Xplore TV, Swisscom blue TV sowie über verschiedene regionale Kabelnetze. Zusätzlich kann FOLX TV über den offiziellen Livestream im Internet verfolgt werden.
            </p>
          </div>
        </div>

        <div className="bg-card rounded-lg border border-card-border overflow-hidden mb-6" data-testid="section-about-network">
          <div className="flex items-center gap-3 px-5 py-4 border-b border-card-border bg-muted/20">
            <Music className="w-4 h-4 text-primary" />
            <h2 className="text-lg font-bold text-card-foreground">FOLX NETWORK</h2>
          </div>
          <div className="px-5 py-4">
            <p className="text-muted-foreground text-sm leading-relaxed">
              Als Teil des FOLX NETWORK steht der Sender für hochwertige Musikunterhaltung, authentische Volksmusik und modernen Schlager – produziert mit Leidenschaft und großer Nähe zur Musikszene.
            </p>
          </div>
        </div>

        <div className="bg-card rounded-lg border border-card-border overflow-hidden mb-6" data-testid="section-about-shows">
          <div className="flex items-center gap-3 px-5 py-4 border-b border-card-border bg-muted/20">
            <Mic2 className="w-4 h-4 text-primary" />
            <h2 className="text-lg font-bold text-card-foreground">Eigenproduktionen</h2>
          </div>
          <div className="px-5 py-4 space-y-3">
            <div>
              <h3 className="text-card-foreground font-semibold text-sm">FOLX Stadl</h3>
              <p className="text-muted-foreground text-sm">
                Mit Moderator Hanzi Berger, der regelmäßig Stars der volkstümlichen Musik und des Schlagers auf die Bühne bringt.
              </p>
            </div>
            <div>
              <h3 className="text-card-foreground font-semibold text-sm">Gipfelstammtisch</h3>
              <p className="text-muted-foreground text-sm">
                Spannende Gespräche und musikalische Beiträge aus der Welt der Alpen.
              </p>
            </div>
            <div>
              <h3 className="text-card-foreground font-semibold text-sm">Die Geschichte des Liedes</h3>
              <p className="text-muted-foreground text-sm">
                Faszinierende Einblicke in die Entstehung und Bedeutung bekannter volkstümlicher Melodien.
              </p>
            </div>
          </div>
        </div>

        <div className="bg-card rounded-lg border border-card-border overflow-hidden mb-6" data-testid="section-about-history">
          <div className="flex items-center gap-3 px-5 py-4 border-b border-card-border bg-muted/20">
            <Calendar className="w-4 h-4 text-primary" />
            <h2 className="text-lg font-bold text-card-foreground">Geschichte</h2>
          </div>
          <div className="px-5 py-4">
            <p className="text-muted-foreground text-sm leading-relaxed">
              FOLX TV wurde am 15. April 2013 gegründet und hat sich seitdem zu einem der wichtigsten Fernsehsender für volkstümliche Musik und Schlager im deutschsprachigen Raum entwickelt.
            </p>
          </div>
        </div>

        <div className="bg-card rounded-lg border border-card-border p-6" data-testid="section-about-vision">
          <p className="text-card-foreground leading-relaxed text-[15px] italic">
            Unsere Vision ist es, die musikalische Tradition des Alpenraums und der Schlagerwelt in moderner TV-Produktion weiterzuführen und ein internationales Publikum für diese einzigartige Musik zu begeistern.
          </p>
          <p className="text-primary font-semibold mt-4 text-sm">
            Schalten Sie ein und erleben Sie die Welt der Volksmusik und des Schlagers – nur bei FOLX TV.
          </p>
        </div>
      </main>
      <Footer />
    </div>
  );
}
