Phase 2/3: Employees list/detail + mutation RPCs + action panels

- supabase/functions.sql, functions_2.sql: Postgres RPCs for every
  employee/position/reorg mutation (hire, terminate, transfer, promote,
  start/adjust/return karenz, change data, rehire, create position, staff
  internally, apply/undo reorg). Each resolves manager_id server-side,
  writes history + audit atomically, and enforces hr_admin via
  require_hr_admin() (backed by the existing RLS policy).
- actions/employees.ts, positions.ts, reorg.ts: Server Actions wrapping
  the RPCs, returning success/error for client-side toast handling.
- Employees list (search/filter/pagination) and detail (4 tabs: Stammdaten,
  Vertrag & Gehalt, Organisation, Historie) reading from employees_directory.
- 6 action slide-over panels: Transfer, Promote, Karenz (start/adjust/
  return), Daten aendern (person+contract diffing), Terminate (with direct-
  report reparenting warning + offboarding checklist), Rehire.
- lib/org.ts: shared division/department/team/location lookups.

Verified live: promote mutation updates salary, writes history/audit, and
the detail page reflects it after refresh, no console errors.

Note: the spec's Karenz-verwalten panel only covers employees already on
Karenz; added a start-Karenz mode (Karenzbeginn/geplante Rueckkehr) to
cover the Aktiv-employee case implied by the header button but not
specified in the panel list.

components/employees/panels/TransferPanel.tsx

@@ -0,0 +1,133 @@
+"use client";
+
+import { useRouter } from "next/navigation";
+import { useMemo, useState } from "react";
+import { transferEmployee } from "@/actions/employees";
+import { SlideOver } from "@/components/ui/SlideOver";
+import { useToast } from "@/components/ui/Toast";
+import type { Database } from "@/lib/supabase/types";
+
+type EmployeeRow = Database["public"]["Views"]["employees_directory"]["Row"];
+type Division = Database["public"]["Tables"]["divisions"]["Row"];
+type Department = Database["public"]["Tables"]["departments"]["Row"];
+type Team = Database["public"]["Tables"]["teams"]["Row"];
+
+type TransferPanelProps = {
+  open: boolean;
+  onClose: () => void;
+  employee: EmployeeRow;
+  divisions: Division[];
+  departments: Department[];
+  teams: Team[];
+  currentTeamId: string | null;
+};
+
+export function TransferPanel({ open, onClose, employee, divisions, departments, teams, currentTeamId }: TransferPanelProps) {
+  const { showToast } = useToast();
+  const router = useRouter();
+  const [effectiveDate, setEffectiveDate] = useState("");
+  const [divisionId, setDivisionId] = useState(employee.division_id);
+  const [teamId, setTeamId] = useState(currentTeamId ?? "");
+  const [newTitle, setNewTitle] = useState("");
+  const [pending, setPending] = useState(false);
+
+  const teamsInDivision = useMemo(() => {
+    const deptIds = new Set(departments.filter((d) => d.division_id === divisionId).map((d) => d.id));
+    return teams.filter((t) => deptIds.has(t.department_id));
+  }, [departments, teams, divisionId]);
+
+  async function handleSubmit() {
+    if (!effectiveDate || !teamId) {
+      showToast("Bitte Datum und Zielteam angeben.", "error");
+      return;
+    }
+    setPending(true);
+    const result = await transferEmployee({
+      employee_id: employee.id,
+      effective_date: effectiveDate,
+      new_team_id: teamId,
+      new_title: newTitle || undefined,
+    });
+    setPending(false);
+    if (result.success) {
+      showToast(`${employee.first_name} ${employee.last_name} wurde versetzt.`);
+      router.refresh();
+      onClose();
+    } else {
+      showToast(result.error ?? "Fehler beim Speichern.", "error");
+    }
+  }
+
+  return (
+    <SlideOver
+      open={open}
+      onClose={onClose}
+      title="Versetzung"
+      subtitle={`${employee.first_name} ${employee.last_name} · ${employee.job_title}`}
+      footer={
+        <>
+          <button onClick={onClose} className="rounded px-4 py-2 text-sm font-semibold text-ink-body hover:bg-surface">
+            Abbrechen
+          </button>
+          <button
+            onClick={handleSubmit}
+            disabled={pending}
+            className="rounded bg-brand-500 px-4 py-2 text-sm font-semibold text-white disabled:opacity-50"
+          >
+            Versetzen
+          </button>
+        </>
+      }
+    >
+      <div className="flex flex-col gap-4">
+        <div>
+          <label className="mb-1 block text-sm font-semibold text-ink">Wirksam ab*</label>
+          <input
+            type="date"
+            value={effectiveDate}
+            onChange={(e) => setEffectiveDate(e.target.value)}
+            className="w-full rounded border border-border px-3 py-2 text-sm"
+          />
+        </div>
+        <div>
+          <label className="mb-1 block text-sm font-semibold text-ink">Neuer Bereich*</label>
+          <select
+            value={divisionId}
+            onChange={(e) => {
+              setDivisionId(e.target.value);
+              setTeamId("");
+            }}
+            className="w-full rounded border border-border px-3 py-2 text-sm"
+          >
+            {divisions.map((d) => (
+              <option key={d.id} value={d.id}>
+                {d.name}
+              </option>
+            ))}
+          </select>
+        </div>
+        <div>
+          <label className="mb-1 block text-sm font-semibold text-ink">Neues Team*</label>
+          <select value={teamId} onChange={(e) => setTeamId(e.target.value)} className="w-full rounded border border-border px-3 py-2 text-sm">
+            <option value="">Bitte wählen…</option>
+            {teamsInDivision.map((t) => (
+              <option key={t.id} value={t.id}>
+                {t.name}
+              </option>
+            ))}
+          </select>
+        </div>
+        <div>
+          <label className="mb-1 block text-sm font-semibold text-ink">Neuer Titel (optional)</label>
+          <input
+            value={newTitle}
+            onChange={(e) => setNewTitle(e.target.value)}
+            placeholder={employee.job_title}
+            className="w-full rounded border border-border px-3 py-2 text-sm"
+          />
+        </div>
+        <p className="text-xs text-ink-muted">Die neue Führungskraft wird automatisch anhand des Zielteams bestimmt.</p>
+      </div>
+    </SlideOver>
+  );
+}