const logs = [
  "[Signal_Rcv] :: Offset=0x3f4 :: Status=Stable",
  "[Agent_Sync] :: UUID_4492 :: Auth_Granted",
  "[IO_Wait] :: 0.042ms :: Vector_Validated",
  "[Core_Idle] :: Temp_Optimal",
  "[Log_Dump] :: Stream_Active",
];

export default function IntelligenceTicker() {
  // Duplicate for seamless looping
  const allLogs = [...logs, ...logs];

  return (
    <footer
      className="rounded-xl border overflow-hidden"
      style={{ backgroundColor: "#0C0C0E", padding: "1rem" }}
    >
      <div className="flex items-center gap-6 overflow-hidden">
        <span
          className="text-[10px] font-extrabold uppercase tracking-widest rounded-full px-3 py-1 flex-shrink-0"
          style={{
            color: "#A78BFA",
            backgroundColor: "rgba(167,139,250,0.1)",
            border: "1px solid rgba(167,139,250,0.2)",
          }}
        >
          System_Log
        </span>

        <div className="overflow-hidden flex-1">
          <div className="ticker-track">
            {allLogs.map((log, i) => (
              <span
                key={i}
                className="text-[10px] font-medium text-zinc-600 uppercase tracking-wide opacity-80 mr-12 whitespace-nowrap"
              >
                {log}
              </span>
            ))}
          </div>
        </div>
      </div>
    </footer>
  );
}