feat: redesign appointments (نوبت‌ها) admin UI to match tauri turns + expandable sidebar

Rebuild the /admin/appointments page visual layer to match the tauri
clinic-pro-tauri "turns" design while keeping all existing data wiring and
backend endpoints unchanged (add/edit/move/transfer-reserve/replace already
supported via PATCH /api/v1/appointment/{uuid} and POST /api/v1/my/appointment).

Frontend (assets/admin):
- Sidebar: نوبت‌ها becomes an expandable parent with sub-items
  «نوبت های تایید شده» (/admin/appointments) and «افزودن نوبت»
  (/admin/appointments/new); auto-expands on active child. Applied to
  admin/clinic/doctor/secretary roles. Adds nav-subitem styling.
- New presentational components under components/appointments/: tauri status
  palette (turnStatus), TurnsStatInfo, TurnsViewToggle (sliding), DoctorTabs
  (underline), TurnsTimeline (marker rail + status cards, empty slot → افزودن
  نوبت), TurnsTable.
- AppointmentsPage recomposed with the new components (stats bar, doctor tabs,
  view toggle, timeline/table), preserving queries, filters, pagination,
  quick-book modal and the row actions menu.
- AppointmentCreatePage: full-page create form (CreateTurn layout) at
  /admin/appointments/new, reusing POST /api/v1/my|admin/appointment.

Tests: TurnsStatInfo, TurnsTimeline, Sidebar (expandable), AppointmentsPage,
AppointmentCreatePage. Backend move/reserve/replace verified green via existing
tests/Appointment/AppointmentUpdateTest + AppointmentWorkflowFieldsTest.

No API endpoints changed → no docs/api change.

Co-Authored-By: Claude Opus 4.8 (1M context) <noreply@anthropic.com>

assets/admin/components/appointments/TurnsViewToggle.tsx

@@ -0,0 +1,51 @@
+/**
+ * سوییچ کشویی «نمایش جدولی / زمانبندی» — بازسازی `TurnsViewModeToggle.jsx` طرح
+ * tauri (کادر ۱۹۳×۴۸، پس‌زمینهٔ لغزنده، متن فعال #5559ce).
+ */
+export type TurnsViewMode = 'table' | 'timeline';
+
+export default function TurnsViewToggle({
+  viewMode, onChange,
+}: {
+  viewMode: TurnsViewMode;
+  onChange: (m: TurnsViewMode) => void;
+}) {
+  const activeText = 'var(--primary)';
+  const idleText = 'var(--text-3)';
+  return (
+    <div style={{
+      position: 'relative', width: 193, height: 44, display: 'flex', overflow: 'hidden',
+      border: '1px solid var(--border)', borderRadius: 'var(--r-sm)', background: 'var(--surface)',
+    }}>
+      {/* پس‌زمینهٔ لغزنده */}
+      <div style={{
+        position: 'absolute', top: 0, right: 0, height: '100%', width: '50%',
+        background: 'var(--primary-soft)', transition: 'transform .3s var(--ease)',
+        transform: viewMode === 'table' ? 'translateX(100%)' : 'translateX(0%)',
+      }} />
+      <button
+        type="button"
+        onClick={() => onChange('table')}
+        style={{
+          position: 'relative', zIndex: 1, width: '50%', height: '100%', border: 'none',
+          background: 'transparent', cursor: 'pointer', fontFamily: 'inherit',
+          fontSize: 13, fontWeight: 500, color: viewMode === 'table' ? activeText : idleText,
+        }}
+      >
+        نمایش جدولی
+      </button>
+      <div style={{ position: 'relative', zIndex: 1, width: 1, height: '100%', background: 'var(--border)' }} />
+      <button
+        type="button"
+        onClick={() => onChange('timeline')}
+        style={{
+          position: 'relative', zIndex: 1, width: '50%', height: '100%', border: 'none',
+          background: 'transparent', cursor: 'pointer', fontFamily: 'inherit',
+          fontSize: 13, fontWeight: 500, color: viewMode === 'timeline' ? activeText : idleText,
+        }}
+      >
+        زمانبندی
+      </button>
+    </div>
+  );
+}