Refactors UI components with new card header structure

Replaces `swp-section-label` with standardized `swp-card-header` and `swp-card-title`

Improves component consistency across multiple features:
- Adds structured card headers
- Introduces more semantic HTML elements
- Enhances layout and readability of card components

Updates CSS and component styles to support new structure

PlanTempus.Application/Features/Services/Components/ServiceDetailEmployees/Default.cshtml

@@ -1,10 +1,11 @@
 @model PlanTempus.Application.Features.Services.Components.ServiceDetailEmployeesViewModel
 
 <swp-detail-grid>
-    <div>
+    <swp-card-column>
         <swp-card>
-            <swp-section-label>@Model.LabelEmployeesForService</swp-section-label>
-
+            <swp-card-header>
+                <swp-card-title>@Model.LabelEmployeesForService</swp-card-title>
+            </swp-card-header>
             <swp-selectable-list>
                 @foreach (var employee in Model.Employees)
                 {
@@ -32,12 +33,13 @@
 
             <swp-see-all>@Model.LabelSelectAll</swp-see-all>
         </swp-card>
-    </div>
+    </swp-card-column>
 
-    <div>
+    <swp-card-column>
         <swp-card>
-            <swp-section-label>@Model.LabelAvailability</swp-section-label>
-
+            <swp-card-header>
+                <swp-card-title>@Model.LabelAvailability</swp-card-title>
+            </swp-card-header>
             <swp-availability-list>
                 @foreach (var day in Model.Availability)
                 {
@@ -62,5 +64,5 @@
                 }
             </swp-availability-list>
         </swp-card>
-    </div>
+    </swp-card-column>
 </swp-detail-grid>