fix: restore ServicesManagement.svelte component

frontend/src/lib/components/admin/ServicesManagement.svelte

@@ -70,10 +70,6 @@
 			return 'Duration must be greater than 0';
 		}
 
-		if (field === 'patch_test_duration_hours' && value < 0) {
-			return 'Cannot be negative';
-		}
-
 		if (field === 'minimum_age_required' && (value < 0 || value > 100)) {
 			return 'Must be between 0 and 100';
 		}
@@ -321,7 +317,6 @@
 	</Card.Header>
 
 	<Card.Content class="space-y-4">
-		<!-- Desktop Table -->
 		<div class="hidden w-full overflow-x-auto md:block">
 			<table class="w-full table-auto border-collapse text-sm">
 				<thead>
@@ -406,7 +401,6 @@
 			</table>
 		</div>
 
-		<!-- Mobile Cards -->
 		<div class="space-y-4 md:hidden">
 			{#if servicesLoading}
 				{#each Array(3) as _, i (i)}
@@ -492,7 +486,6 @@
 	</Card.Content>
 </Card.Root>
 
-<!-- Add Service Modal -->
 <Modal.Root bind:open={showServiceModal}>
 	<Modal.Content class="max-h-[90vh] max-w-sm overflow-y-auto md:max-w-lg">
 		<Modal.Header>
@@ -501,7 +494,6 @@
 		</Modal.Header>
 
 		<div class="space-y-4 px-4 pb-4">
-			<!-- Service Name -->
 			<div class="space-y-2">
 				<label for="service-name" class="text-sm font-medium">Service Name *</label>
 				<Input
@@ -511,14 +503,13 @@
 					placeholder="e.g., Haircut, Color, Blowdry"
 					bind:value={newService.name}
 					onblur={validateNameField}
-					class="w-full border-red-500={serviceErrors.name}"
+					class="w-full {serviceErrors.name ? 'border-red-500' : ''}"
 				/>
 				{#if serviceErrors.name}
 					<p class="text-sm text-red-600">{serviceErrors.name}</p>
 				{/if}
 			</div>
 
-			<!-- Description -->
 			<div class="space-y-2">
 				<label for="service-description" class="text-sm font-medium">Description</label>
 				<Input
@@ -530,9 +521,7 @@
 				/>
 			</div>
 
-			<!-- Price and Duration - Side by side on desktop -->
 			<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
-				<!-- Price -->
 				<div class="space-y-2">
 					<label for="service-price" class="text-sm font-medium">Price (£) *</label>
 					<div class="relative">
@@ -545,7 +534,7 @@
 							placeholder="0.00"
 							bind:value={newService.price}
 							onblur={validatePriceField}
-							class="w-full pl-8 border-red-500={serviceErrors.price}"
+							class="w-full pl-8 {serviceErrors.price ? 'border-red-500' : ''}"
 						/>
 					</div>
 					{#if serviceErrors.price}
@@ -553,7 +542,6 @@
 					{/if}
 				</div>
 
-				<!-- Duration -->
 				<div class="space-y-2">
 					<label for="service-duration" class="text-sm font-medium">Duration (minutes) *</label>
 					<Input
@@ -564,7 +552,7 @@
 						placeholder="60"
 						bind:value={newService.duration_minutes}
 						onblur={validateDurationField}
-						class="w-full border-red-500={serviceErrors.duration_minutes}"
+						class="w-full {serviceErrors.duration_minutes ? 'border-red-500' : ''}"
 					/>
 					{#if serviceErrors.duration_minutes}
 						<p class="text-sm text-red-600">{serviceErrors.duration_minutes}</p>
@@ -572,9 +560,7 @@
 				</div>
 			</div>
 
-			<!-- Patch Test and Minimum Age - Side by side on desktop -->
 			<div class="grid grid-cols-1 gap-4 md:grid-cols-2">
-				<!-- Minimum Age -->
 				<div class="space-y-2">
 					<label for="minimum-age" class="text-sm font-medium">Minimum Age</label>
 					<Input
@@ -586,7 +572,7 @@
 						placeholder="0"
 						bind:value={newService.minimum_age_required}
 						onblur={validateMinimumAgeField}
-						class="w-full border-red-500={serviceErrors.minimum_age_required}"
+						class="w-full {serviceErrors.minimum_age_required ? 'border-red-500' : ''}"
 					/>
 					{#if serviceErrors.minimum_age_required}
 						<p class="text-sm text-red-600">{serviceErrors.minimum_age_required}</p>
@@ -612,4 +598,4 @@
 			</Button>
 		</Modal.Footer>
 	</Modal.Content>
-</Modal.Root>
+</Modal.Root>