frontend/src/app/(dashboard)/appointments/page.tsx

@@ -4,7 +4,7 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { appointmentsApi } from '@/lib/api/appointments';
 import { patientsApi } from '@/lib/api/patients';
 import { useAuth } from '@/lib/hooks/useAuth';
-import { canEditAppointments, hasPermission } from '@/shared/permissions';
+import { canEditAppointments, hasPermission } from '@/components/shared/permissions';
 import type { AppointmentColumnProvider, AppointmentRecord } from '@/types/appointment';
 import type { CreatePatientInput, Patient } from '@/types/patient';
 import { CreatePatientModal } from '@/components/ui/patient/CreatePatientModal';
@@ -13,8 +13,8 @@ import { AppointmentBookingModal } from '@/components/ui/appointments/Appointmen
 import { AppointmentScheduleGrid } from '@/components/ui/appointments/AppointmentScheduleGrid';
 import { AppointmentsPatientSearch } from '@/components/ui/appointments/AppointmentsPatientSearch';
 import { AppointmentScheduleLegend } from '@/components/ui/appointments/AppointmentScheduleLegend';
-import { ScheduleDayPicker } from '@/components/ui/common/ScheduleDayPicker';
-import { ToastStack } from '@/components/ui/common/Toast';
+import { ScheduleDayPicker } from '@/components/ui/shared/ScheduleDayPicker';
+import { ToastStack } from '@/components/ui/shared/Toast';
 import { useToast } from '@/lib/hooks/useToast';
 import type { AppointmentPurpose } from '@/types/appointment';
 import { formatApiErrorMessage } from '@/lib/formatApiError';

frontend/src/app/(dashboard)/billing/page.tsx

@@ -2,13 +2,13 @@
 'use client';
 import { useState } from 'react';
 import { Pencil } from 'lucide-react';
-import { Button } from '@/components/ui/common/Button';
-import { Badge } from '@/components/ui/common/Badge';
-import { Card } from '@/components/ui/common/Card';
-import { Table } from '@/components/ui/common/Table';
-import { SearchBar } from '@/components/ui/common/SearchBar';
+import { Button } from '@/components/ui/shared/Button';
+import { Badge } from '@/components/ui/shared/Badge';
+import { Card } from '@/components/ui/shared/Card';
+import { Table } from '@/components/ui/shared/Table';
+import { SearchBar } from '@/components/ui/shared/SearchBar';
 import { useAuth } from '@/lib/hooks/useAuth';
-import { hasPermission } from '@/shared/permissions';
+import { hasPermission } from '@/components/shared/permissions';
 // Mock data matching your design
 const invoices = [
     { id: '#123456', patient: 'Ali Rahmani', date: '24/9/2026', service: 'Hygiene', amount: 300, paid: 0, status: 'unpaid' },

frontend/src/app/(dashboard)/layout.tsx

@@ -3,15 +3,15 @@
 import { memo, useEffect } from 'react';
 import { usePathname, useRouter } from 'next/navigation';
 import { useAuth } from '@/lib/hooks/useAuth';
-import Sidebar from '@/components/ui/common/Sidebar';
-import { ThemeToggle } from '@/components/ui/common/ThemeToggle';
+import Sidebar from '@/components/ui/shared/Sidebar';
+import { ThemeToggle } from '@/components/ui/shared/ThemeToggle';
 import { DashboardAccountMenu } from '@/components/ui/dashboard/DashboardAccountMenu';
 import {
   canAccessAppointmentsSection,
   firstAccessibleDashboardPath,
   getRequiredReadPermissionForPath,
   hasPermission,
-} from '@/shared/permissions';
+} from '@/components/shared/permissions';
 
 export default function DashboardLayout({ children }: { children: React.ReactNode }) {
   const { user, currentOrganization, isAuthReady } = useAuth();

frontend/src/app/(dashboard)/organizations/page.tsx

@@ -14,12 +14,12 @@ import {
 import { invitationTargetFromConnectionRow } from '@/components/invitations/organizationInviteLinks';
 import { CopyInvitationLinkButton } from '@/components/ui/organizations/CopyInvitationLinkButton';
 import { InvitationHistoryDialog } from '@/components/ui/organizations/InvitationHistoryDialog';
-import { Button } from '@/components/ui/common/Button';
-import { Badge, organizationConnectionStatusVariant } from '@/components/ui/common/Badge';
-import { Input } from '@/components/ui/common/Input';
-import { SearchBar } from '@/components/ui/common/SearchBar';
-import { Table } from '@/components/ui/common/Table';
-import { ToastStack } from '@/components/ui/common/Toast';
+import { Button } from '@/components/ui/shared/Button';
+import { Badge, organizationConnectionStatusVariant } from '@/components/ui/shared/Badge';
+import { Input } from '@/components/ui/shared/Input';
+import { SearchBar } from '@/components/ui/shared/SearchBar';
+import { Table } from '@/components/ui/shared/Table';
+import { ToastStack } from '@/components/ui/shared/Toast';
 import type { ApiError } from '@/types/api';
 
 function formatOrganizationStatusLabel(status: string): string {

frontend/src/app/(dashboard)/patients/page.tsx

@@ -1,13 +1,13 @@
 'use client';
 
 import { useEffect, useMemo, useState } from 'react';
-import { Button } from '@/components/ui/common/Button';
-import { ToastStack } from '@/components/ui/common/Toast';
+import { Button } from '@/components/ui/shared/Button';
+import { ToastStack } from '@/components/ui/shared/Toast';
 import { patientsApi } from '@/lib/api/patients';
 import { formatApiErrorMessage } from '@/lib/formatApiError';
 import { useAuth } from '@/lib/hooks/useAuth';
 import { useToast } from '@/lib/hooks/useToast';
-import { hasPermission } from '@/shared/permissions';
+import { hasPermission } from '@/components/shared/permissions';
 import {
   CreatePatientInput,
   CreateTreatmentHistoryInput,

frontend/src/app/(dashboard)/settings/subscriptions/page.tsx

@@ -5,8 +5,8 @@ import Link from 'next/link';
 import { useRouter } from 'next/navigation';
 import { useAuth } from '@/lib/hooks/useAuth';
 import { authApi } from '@/lib/api/auth';
-import { Button } from '@/components/ui/common/Button';
-import { Toast } from '@/components/ui/common/Toast';
+import { Button } from '@/components/ui/shared/Button';
+import { Toast } from '@/components/ui/shared/Toast';
 import type { SubscriptionAlertData } from '@/types/subscription';
 
 const PLAN_OPTIONS = [

frontend/src/app/(dashboard)/staff/page.tsx

@@ -6,7 +6,7 @@ import {
   firstAccessibleDashboardPath,
   canEditStaff,
   canViewStaff,
-} from '@/shared/permissions';
+} from '@/components/shared/permissions';
 import {
   STAFF_FEATURE_GROUPS,
   permissionNamesFromFeatureState,
@@ -17,14 +17,14 @@ import {
   type FeaturePermState,
 } from '../../../components/staff/staff-permission-form';
 import { Pencil, Trash2, Copy, Check, X } from 'lucide-react';
-import { DialogCloseButton } from '@/components/ui/common/DialogCloseButton';
+import { DialogCloseButton } from '@/components/ui/shared/DialogCloseButton';
 import { useAuth } from '@/lib/hooks/useAuth';
 import { staffApi, type StaffMemberDto } from '@/lib/api/staff';
-import { Button } from '@/components/ui/common/Button';
-import { Badge } from '@/components/ui/common/Badge';
-import { Input } from '@/components/ui/common/Input';
-import { Checkbox } from '@/components/ui/common/Checkbox';
-import { Table } from '@/components/ui/common/Table';
+import { Button } from '@/components/ui/shared/Button';
+import { Badge } from '@/components/ui/shared/Badge';
+import { Input } from '@/components/ui/shared/Input';
+import { Checkbox } from '@/components/ui/shared/Checkbox';
+import { Table } from '@/components/ui/shared/Table';
 import type { ApiError } from '@/types/api';
 
 type StoredInviteLink = {

frontend/src/app/(dashboard)/today/page.tsx

@@ -2,7 +2,7 @@
 
 import Link from 'next/link';
 import { useAuth } from '@/lib/hooks/useAuth';
-import { Card } from '@/components/ui/common/Card';
+import { Card } from '@/components/ui/shared/Card';
 
 export default function TodayPage() {
   const { currentOrganization } = useAuth();

frontend/src/app/(public)/accept-invite/page.tsx

@@ -4,8 +4,8 @@ import { useEffect, useMemo, useState } from 'react';
 import { Suspense } from 'react';
 import Link from 'next/link';
 import { useRouter, useSearchParams } from 'next/navigation';
-import { Button } from '@/components/ui/common/Button';
-import { Input } from '@/components/ui/common/Input';
+import { Button } from '@/components/ui/shared/Button';
+import { Input } from '@/components/ui/shared/Input';
 import { staffApi } from '@/lib/api/staff';
 
 function AcceptInviteContent() {

frontend/src/app/(public)/accept-organization-invite/page.tsx

@@ -8,8 +8,8 @@ import type { OrganizationDetailsFormValues } from '@/components/ui/auth/Organiz
 import { zodResolver } from '@hookform/resolvers/zod';
 import * as z from 'zod';
 import { Lock, Mail, User } from 'lucide-react';
-import { Button } from '@/components/ui/common/Button';
-import { Input } from '@/components/ui/common/Input';
+import { Button } from '@/components/ui/shared/Button';
+import { Input } from '@/components/ui/shared/Input';
 import { OrganizationDetailsFields } from '@/components/ui/auth/OrganizationDetailsFields';
 import { RegistrationProgressSteps } from '@/components/ui/auth/RegistrationProgressSteps';
 import { organizationApi } from '@/lib/api/organization';

frontend/src/app/(public)/login/page.tsx

@@ -116,8 +116,8 @@ import Link from 'next/link';
 import { Mail, Lock } from 'lucide-react';
 
 import { useAuth } from '@/lib/hooks/useAuth';
-import { Button } from '@/components/ui/common/Button';
-import { Input } from '@/components/ui/common/Input';
+import { Button } from '@/components/ui/shared/Button';
+import { Input } from '@/components/ui/shared/Input';
 
 const loginSchema = z.object({
   email: z.string().email('Please enter a valid email address'),

frontend/src/app/(public)/page.tsx

@@ -2,8 +2,8 @@
 
 import Link from 'next/link';
 import { useAuth } from '@/lib/hooks/useAuth';
-import { Button } from '@/components/ui/common/Button';
-import { ThemeToggle } from '@/components/ui/common/ThemeToggle';
+import { Button } from '@/components/ui/shared/Button';
+import { ThemeToggle } from '@/components/ui/shared/ThemeToggle';
 import { Building2, Beaker, Calendar, Shield, Clock, Users } from 'lucide-react';
 
 export default function HomePage() {

frontend/src/app/(public)/register/page.tsx

@@ -9,8 +9,8 @@ import { Mail, Lock, User } from 'lucide-react';
 import { useAuth } from '@/lib/hooks/useAuth';
 import { OrganizationDetailsFields } from '@/components/ui/auth/OrganizationDetailsFields';
 import { RegistrationProgressSteps } from '@/components/ui/auth/RegistrationProgressSteps';
-import { Button } from '@/components/ui/common/Button';
-import { Input } from '@/components/ui/common/Input';
+import { Button } from '@/components/ui/shared/Button';
+import { Input } from '@/components/ui/shared/Input';
 const registerSchema = z.object({
     name: z.string().min(2, 'Name must be at least 2 characters'),
     email: z.string().email('Please enter a valid email address'),

frontend/src/components/ui/appointments/AppointmentBookingModal.tsx

@@ -1,9 +1,9 @@
 'use client';
 
 import { useEffect, useState } from 'react';
-import { Button } from '@/components/ui/common/Button';
-import { DialogCloseButton } from '@/components/ui/common/DialogCloseButton';
-import { Dropdown } from '@/components/ui/common/Dropdown';
+import { Button } from '@/components/ui/shared/Button';
+import { DialogCloseButton } from '@/components/ui/shared/DialogCloseButton';
+import { Dropdown } from '@/components/ui/shared/Dropdown';
 import type { AppointmentPurpose, AppointmentRecord } from '@/types/appointment';
 import { APPOINTMENT_PURPOSE_LABEL } from '@/components/ui/appointments/appointmentPurposeStyles';
 import type { Patient } from '@/types/patient';

frontend/src/components/ui/appointments/AppointmentOverlapPopover.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { useEffect, useRef } from 'react';
-import { DialogCloseButton } from '@/components/ui/common/DialogCloseButton';
+import { DialogCloseButton } from '@/components/ui/shared/DialogCloseButton';
 import {
   APPOINTMENT_PURPOSE_LABEL,
   purposeStyle,

frontend/src/components/ui/appointments/AppointmentsPatientSearch.tsx

@@ -1,8 +1,8 @@
 'use client';
 
 import { Search } from 'lucide-react';
-import { Button } from '@/components/ui/common/Button';
-import { Input } from '@/components/ui/common/Input';
+import { Button } from '@/components/ui/shared/Button';
+import { Input } from '@/components/ui/shared/Input';
 import type { Patient } from '@/types/patient';
 
 interface AppointmentsPatientSearchProps {

frontend/src/components/ui/auth/OrganizationDetailsFields.tsx

@@ -2,7 +2,7 @@
 
 import { Building2, Mail } from 'lucide-react';
 import type { FieldErrors, UseFormRegister, UseFormSetValue } from 'react-hook-form';
-import { Input } from '@/components/ui/common/Input';
+import { Input } from '@/components/ui/shared/Input';
 
 export type OrganizationDetailsFormValues = {
   organizationName: string;

frontend/src/components/ui/organizations/InvitationHistoryDialog.tsx

@@ -1,10 +1,10 @@
 'use client';
 
-import { DialogCloseButton } from '@/components/ui/common/DialogCloseButton';
-import { ToastStack, type ToastMessages } from '@/components/ui/common/Toast';
+import { DialogCloseButton } from '@/components/ui/shared/DialogCloseButton';
+import { ToastStack, type ToastMessages } from '@/components/ui/shared/Toast';
 import type { OrganizationInvitationHistoryItemDto } from '@/lib/api/organization';
-import { Badge, organizationConnectionStatusVariant } from '@/components/ui/common/Badge';
-import { Table } from '@/components/ui/common/Table';
+import { Badge, organizationConnectionStatusVariant } from '@/components/ui/shared/Badge';
+import { Table } from '@/components/ui/shared/Table';
 import { CopyInvitationLinkButton } from '@/components/ui/organizations/CopyInvitationLinkButton';
 
 function formatInvitationStatusLabel(status: OrganizationInvitationHistoryItemDto['status']): string {

frontend/src/components/ui/organizations/OrganizationSelectorContent.tsx

@@ -3,8 +3,8 @@
 import { useState } from 'react';
 import { useAuth } from '@/lib/hooks/useAuth';
 import { Building2, Beaker, Mail } from 'lucide-react';
-import { Input } from '@/components/ui/common/Input';
-import { Button } from '@/components/ui/common/Button';
+import { Input } from '@/components/ui/shared/Input';
+import { Button } from '@/components/ui/shared/Button';
 
 export function OrganizationSelectorContent() {
   const { organizations, selectOrganization, createOrganization, isLoading, error, clearError } = useAuth();

frontend/src/components/ui/patient/CreatePatientModal.tsx

@@ -1,7 +1,7 @@
 'use client';
 
-import { Button } from '@/components/ui/common/Button';
-import { Input } from '@/components/ui/common/Input';
+import { Button } from '@/components/ui/shared/Button';
+import { Input } from '@/components/ui/shared/Input';
 import { CreatePatientInput } from '@/types/patient';
 
 interface CreatePatientModalProps {

frontend/src/components/ui/patient/PatientSearchSelect.tsx

@@ -1,7 +1,7 @@
 'use client';
 
 import { Search } from 'lucide-react';
-import { Input } from '@/components/ui/common/Input';
+import { Input } from '@/components/ui/shared/Input';
 import { Patient } from '@/types/patient';
 
 interface PatientSearchSelectProps {

frontend/src/components/ui/shared/Sidebar.tsx

@@ -13,7 +13,7 @@ import {
   CreditCard,
 } from 'lucide-react';
 import { useAuth } from '@/lib/hooks/useAuth';
-import { canAccessAppointmentsSection, canViewTab } from '@/shared/permissions';
+import { canAccessAppointmentsSection, canViewTab } from '@/components/shared/permissions';
 
 const menu = [
   { name: 'Today', path: '/today', icon: LayoutDashboard, read: 'TAB_TODAY_READ' as const },

frontend/src/components/ui/shared/Toast.tsx

@@ -1,5 +1,5 @@
 import type { ReactNode } from 'react';
-import type { BadgeVariant } from '@/components/ui/common/Badge';
+import type { BadgeVariant } from '@/components/ui/shared/Badge';
 
 interface ToastProps {
   children: ReactNode;

frontend/src/components/ui/treatment/AppointmentsStrip.tsx

@@ -2,8 +2,8 @@
 
 import { CalendarDays } from 'lucide-react';
 import { purposeStyle } from '@/components/ui/appointments/appointmentPurposeStyles';
-import { Card } from '@/components/ui/common/Card';
-import { ScheduleDayPicker } from '@/components/ui/common/ScheduleDayPicker';
+import { Card } from '@/components/ui/shared/Card';
+import { ScheduleDayPicker } from '@/components/ui/shared/ScheduleDayPicker';
 import { startOfLocalDay } from '@/lib/appointmentTime';
 import type { TreatmentAppointment } from '@/types/treatment';
 

frontend/src/components/ui/treatment/TreatmentWorkspace.tsx

@@ -4,11 +4,11 @@ import { useCallback, useEffect, useMemo, useRef, useState } from 'react';
 import { AppointmentsStrip } from '@/components/ui/treatment/AppointmentsStrip';
 import { FdiToothChart } from '@/components/ui/treatment/FdiToothChart';
 import { PastTreatmentsPanel } from '@/components/ui/treatment/PastTreatmentsPanel';
-import { Checkbox } from '@/components/ui/common/Checkbox';
-import { Button } from '@/components/ui/common/Button';
-import { Dropdown } from '@/components/ui/common/Dropdown';
-import { SearchBar } from '@/components/ui/common/SearchBar';
-import { Toast } from '@/components/ui/common/Toast';
+import { Checkbox } from '@/components/ui/shared/Checkbox';
+import { Button } from '@/components/ui/shared/Button';
+import { Dropdown } from '@/components/ui/shared/Dropdown';
+import { SearchBar } from '@/components/ui/shared/SearchBar';
+import { Toast } from '@/components/ui/shared/Toast';
 import { isSameLocalCalendarDay, startOfLocalDay } from '@/lib/appointmentTime';
 import {
   fetchLinkedOrganizations,
@@ -18,7 +18,7 @@ import {
   sendTreatmentRecord,
 } from '@/lib/mocks/treatmentMockApi';
 import { pickAutoAppointment } from '@/lib/treatmentSelection';
-import { canEditTreatment } from '@/shared/permissions';
+import { canEditTreatment } from '@/components/shared/permissions';
 import type { Organization } from '@/types/organization';
 import type {
   FdiToothId,

frontend/src/lib/hooks/useToast.ts

@@ -1,7 +1,7 @@
 'use client';
 
 import { useCallback, useEffect, useState } from 'react';
-import type { ToastMessages } from '@/components/ui/common/Toast';
+import type { ToastMessages } from '@/components/ui/shared/Toast';
 
 const DEFAULT_DURATION_MS = 4000;