Extract common errorBanner style to shared styles

- Added errorBanner to sharedStyles for consistent error display
- Removed duplicate errorBanner definitions from all pages
- Updated appointments, booking, admin/appointments, and admin/availability pages
- Reduced code duplication while maintaining component-specific styles

frontend/app/styles/shared.ts

@@ -78,4 +78,32 @@ export const sharedStyles: Record<string, React.CSSProperties> = {
     justifyContent: "center",
     padding: "2rem",
   },
+  // Common UI component styles
+  errorBanner: {
+    fontFamily: "'DM Sans', system-ui, sans-serif",
+    fontSize: "0.875rem",
+    padding: "1rem",
+    background: "rgba(239, 68, 68, 0.15)",
+    border: "1px solid rgba(239, 68, 68, 0.3)",
+    borderRadius: "8px",
+    color: "#f87171",
+    marginBottom: "1rem",
+  },
+  cancelButton: {
+    fontFamily: "'DM Sans', system-ui, sans-serif",
+    fontSize: "0.85rem",
+    padding: "0.6rem 1rem",
+    background: "rgba(255, 255, 255, 0.05)",
+    color: "rgba(255, 255, 255, 0.7)",
+    border: "1px solid rgba(255, 255, 255, 0.1)",
+    borderRadius: "8px",
+    cursor: "pointer",
+    transition: "all 0.2s",
+  },
+  emptyState: {
+    fontFamily: "'DM Sans', system-ui, sans-serif",
+    color: "rgba(255, 255, 255, 0.4)",
+    textAlign: "center" as const,
+    padding: "1rem 0",
+  },
 };