import Link from "next/link";
import { Collection, Cpu } from "react-bootstrap-icons";

export default function Home() {
  return (
    <div className="container-fluid py-4">
      <div className="row g-3">
        <div className="col-lg-6">
          <div className="card h-100 shadow-sm">
            <div className="card-body d-flex flex-column gap-3">
              <div className="d-flex align-items-center gap-3">
                <Collection size={40} aria-hidden />
                <div>
                  <h1 className="h3 mb-1">ZXDB Explorer</h1>
                  <p className="text-secondary mb-0">Search entries, releases, magazines, and labels.</p>
                </div>
              </div>
              <div className="d-flex flex-wrap gap-2">
                <Link className="btn btn-primary" href="/zxdb">Open ZXDB</Link>
              </div>
              <div className="text-secondary small">Built for deep linking and fast filters.</div>
            </div>
          </div>
        </div>

        <div className="col-lg-6">
          <div className="card h-100 shadow-sm">
            <div className="card-body d-flex flex-column gap-3">
              <div className="d-flex align-items-center gap-3">
                <Cpu size={40} aria-hidden />
                <div>
                  <h2 className="h3 mb-1">NextReg Explorer</h2>
                  <p className="text-secondary mb-0">Browse Spectrum Next registers and bitfields.</p>
                </div>
              </div>
              <div className="d-flex flex-wrap gap-2">
                <Link className="btn btn-primary" href="/registers">Open registers</Link>
              </div>
              <div className="text-secondary small">Parsed locally from official NextReg definitions.</div>
            </div>
          </div>
        </div>
      </div>
    </div>
  );
}
