From c4f397af6f568d7d50f631399d98011a62e11bf8 Mon Sep 17 00:00:00 2001
From: Claude <noreply@anthropic.com>
Date: Wed, 1 Jul 2026 08:55:49 +0000
Subject: [PATCH] fix(service-map): stop horizontal overflow from mismatched
 bleed margin

The service-map route wrapped the map in a `-mx-6 -mb-6` bleed to extend
the ReactFlow canvas edge-to-edge, but its parent PageLayout.ScrollArea
only pads by `p-4` (1rem). The 1.5rem negative margin overshot the 1rem
padding by 0.5rem per side, pushing content past the overflow-auto box
and producing a horizontal scrollbar. Match the bleed to the parent
padding (`-mx-4 -mb-4`).

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
Claude-Session: https://claude.ai/code/session_01JP5QicYhXFPZx5PYBqs3rb
---
 apps/web/src/routes/service-map.tsx | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/apps/web/src/routes/service-map.tsx b/apps/web/src/routes/service-map.tsx
index 754d547bd..ab18b19ad 100644
--- a/apps/web/src/routes/service-map.tsx
+++ b/apps/web/src/routes/service-map.tsx
@@ -66,7 +66,7 @@ function ServiceMapContent() {
 				/>
 			}
 		>
-			<div className="-mx-6 -mb-6 h-[calc(100vh-10rem)]">
+			<div className="-mx-4 -mb-4 h-[calc(100vh-10rem)]">
 				<ServiceMapView startTime={effectiveStartTime} endTime={effectiveEndTime} />
 			</div>
 		</DashboardLayout>