import { AppBrand } from "../shell/AppBrand";
import { NavLinks } from "./NavLinks";

export function Sidebar() {
  return (
    <aside className="fixed inset-y-0 z-20 hidden w-72 overflow-hidden border-r border-slate-200 bg-white/96 shadow-[8px_0_24px_rgba(15,23,42,0.045)] lg:flex lg:flex-col">
      <div className="border-b border-slate-200 px-6 py-5">
        <AppBrand />
        <div className="mt-4 overflow-hidden rounded-xl border border-slate-200 bg-slate-50 px-3.5 py-3 text-sm text-[var(--color-text-secondary)]">
          <div className="flex items-center gap-2 font-semibold text-[var(--color-text-primary)]">
            <span className="size-2 rounded-full bg-primary" />
            今日工作台
          </div>
          <div className="mt-1.5 leading-6">待处理、团队状态和常用入口。</div>
        </div>
      </div>

      <div className="min-h-0 flex-1 overflow-y-auto px-4 py-4 [scrollbar-width:thin]">
        <NavLinks />
      </div>
    </aside>
  );
}