import ThemedLayout from "@/components/layouts/ThemedLayout";

export default function AcademyPage() {
  return (
    <ThemedLayout theme="minimal" title="Arb Academy">
      <div className="space-y-12 text-[#e6e6e6]">
        <header className="border-b-4 border-white/20 pb-4">
          <h2 className="text-5xl font-black uppercase tracking-tighter text-[#fafafa]">The Art of the Trade</h2>
          <p className="mt-2 text-sm italic text-[#a0a0a0]">Knowledge is the only currency that never devalues.</p>
        </header>

        <div className="grid grid-cols-1 gap-12 md:grid-cols-3">
          <div className="col-span-2 space-y-8">
            <section>
              <h3 className="text-2xl font-bold mb-4 underline decoration-4">Lesson 01: OpSec</h3>
              <p className="leading-relaxed">
                Operational Security is not a tool, it is a mindset. Before you enter the market, 
                you must understand the trail you leave behind. Every packet is a footprint.
              </p>
            </section>
            <section>
              <h3 className="text-2xl font-bold mb-4 underline decoration-4">Lesson 02: PGP</h3>
              <p className="leading-relaxed">
                Encryption is the wall between you and the void. If you cannot sign your words, 
                your words have no weight. Master the key, master the trade.
              </p>
            </section>
          </div>
          <aside className="space-y-6 border border-white/10 bg-[#141414] p-8 text-[#e8e8e8]">
            <h4 className="border-b border-white/20 pb-2 text-xl font-bold uppercase">Resources</h4>
            <ul className="text-xs space-y-4">
              <li className="hover:underline cursor-pointer">The Anarchist's Cookbook v2</li>
              <li className="hover:underline cursor-pointer">Tor Routing Deep Dive</li>
              <li className="hover:underline cursor-pointer">Bitcoin Tumbling 101</li>
            </ul>
          </aside>
        </div>

        <div className="mt-20 flex items-center justify-between border-t-2 border-white/15 pt-8">
          <div className="text-4xl font-black">A.A.</div>
          <div className="text-xs uppercase font-bold">Est. 2024 // Node 07</div>
        </div>
      </div>
    </ThemedLayout>
  );
}