fix: use semantic colors across admin pages

src/app/admin/alerts/page.tsx

@@ -21,14 +21,14 @@ function severityColor(severity: string): string {
       return "var(--color-danger)";
     case "warning":
     case "warn":
-      return "var(--color-primary)";
+      return "var(--admin-accent)";
     case "success":
       return "var(--color-secondary)";
     case "info":
     case "notice":
       return "var(--color-accent)";
     default:
-      return "var(--color-text-muted)";
+      return "var(--admin-text-muted)";
   }
 }
 
@@ -73,12 +73,12 @@ export default async function AdminAlerts() {
   return (
     <main>
       <div className="flex items-center gap-3 mb-6">
-        <div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[var(--color-primary)]/20 to-[var(--color-primary)]/5 grid place-items-center">
-          <Bell size={20} className="text-[var(--color-primary)]" />
+        <div className="w-10 h-10 rounded-xl bg-gradient-to-br from-[var(--admin-accent)]/20 to-[var(--admin-accent)]/5 grid place-items-center">
+          <Bell size={20} className="text-[var(--admin-accent)]" />
         </div>
         <div>
-          <h1 className="m-0 text-xl font-extrabold text-[var(--color-text)]">{t("title")}</h1>
-          <p className="m-0 text-xs text-[var(--color-text-muted)] mt-0.5">{t("subtitle")}</p>
+          <h1 className="m-0 text-xl font-extrabold text-[var(--admin-text)]">{t("title")}</h1>
+          <p className="m-0 text-xs text-[var(--admin-text-muted)] mt-0.5">{t("subtitle")}</p>
         </div>
       </div>
 
@@ -141,7 +141,7 @@ export default async function AdminAlerts() {
                       <Badge label={a.severity || "—"} color={severityColor(a.severity)} />
                     </td>
                     <td>
-                      <Badge label={a.type || "—"} color="var(--color-text-muted)" />
+                      <Badge label={a.type || "—"} color="var(--admin-text-muted)" />
                     </td>
                     <td>{a.message}</td>
                   </tr>