Footer

import { Footer, FooterBottom, FooterBrand, FooterColumn, FooterColumns, FooterLegal, FooterLink, FooterSocial, FooterSocialLink } from "@/registry/ds/footer";
import { Globe, Mail } from "@/registry/ds/icons";

const Logo = () => (
  <svg viewBox="0 0 24 24" aria-hidden>
    <rect width="24" height="24" rx="6" fill="var(--primary)" />
    <path d="M7 12.5l3.5 3.5L17 9" stroke="var(--primary-fg)" strokeWidth="2.2" strokeLinecap="round" strokeLinejoin="round" fill="none" />
  </svg>
);

export default function FooterBasic() {
  return (
    <div className="w-full overflow-hidden rounded-lg">
      <Footer>
        <FooterColumns>
          <FooterBrand logo={<Logo />} name="Campus" description="Materias, inscripciones y certificados de la universidad en un solo lugar.">
            <FooterSocial>
              <FooterSocialLink href="https://example.edu" label="Sitio institucional">
                <Globe />
              </FooterSocialLink>
              <FooterSocialLink href="mailto:hola@campus.edu" label="Escribinos">
                <Mail />
              </FooterSocialLink>
            </FooterSocial>
          </FooterBrand>
          <FooterColumn title="Académico">
            <FooterLink href="#">Materias</FooterLink>
            <FooterLink href="#">Calendario</FooterLink>
            <FooterLink href="#">Docentes</FooterLink>
            <FooterLink href="#">Biblioteca</FooterLink>
          </FooterColumn>
          <FooterColumn title="Trámites">
            <FooterLink href="#">Inscripción</FooterLink>
            <FooterLink href="#">Certificados</FooterLink>
            <FooterLink href="#">Becas</FooterLink>
          </FooterColumn>
          <FooterColumn title="Ayuda">
            <FooterLink href="#">Centro de ayuda</FooterLink>
            <FooterLink href="#">Contacto</FooterLink>
            <FooterLink href="https://status.example.edu" external>
              Estado del sistema
            </FooterLink>
          </FooterColumn>
          <FooterColumn title="Institucional">
            <FooterLink href="#">La universidad</FooterLink>
            <FooterLink href="#">Sedes</FooterLink>
            <FooterLink href="#">Trabajá con nosotros</FooterLink>
          </FooterColumn>
        </FooterColumns>
        <FooterBottom>
          <p>© 2026 Universidad. Todos los derechos reservados.</p>
          <FooterLegal>
            <FooterLink href="#">Privacidad</FooterLink>
            <FooterLink href="#">Términos</FooterLink>
            <FooterLink href="#">Accesibilidad</FooterLink>
          </FooterLegal>
        </FooterBottom>
      </Footer>
    </div>
  );
}