import { SITE } from "@/data/content";

export default function Footer() {
  return (
    <div
      style={{
        position: "fixed",
        bottom: 0,
        left: 0,
        right: 0,
        height: 28,
        background: "var(--surface)",
        borderTop: "1px solid var(--border)",
        display: "flex",
        alignItems: "center",
        justifyContent: "space-evenly",
        padding: "0 16px",
        fontFamily: "var(--mono)",
        fontSize: 11,
        color: "var(--muted)",
        zIndex: 100,
      }}
    >
      <div style={{ display: "flex", gap: 16 }}>
        <span>
        (2026)  - Hunter W. 
        </span>
      </div>
      <div style={{ display: "flex", gap: 16 }}>
        <span>Use this design: 
          <a 
          href={SITE.source.link}
          style={{             
              alignItems: "center",
              gap: 8,
              padding: "10px 12px",
              fontFamily: "var(--mono)",
              fontSize: 11,
              fontWeight: 500,
              color: "var(--fg-secondary)",
             }}
             >
              {SITE.source.label}
            </a>
          </span>
      </div>
    </div>
  );
}