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/Settings/Components/SettingsReminders/Default.cshtml

@@ -1,10 +1,12 @@
 <swp-two-column-grid>
     <!-- EMAIL -->
     <swp-card>
-        <swp-section-label>
-            <i class="ph ph-envelope"></i>
-            Email
-        </swp-section-label>
+        <swp-card-header>
+            <swp-card-title>
+                <i class="ph ph-envelope"></i>
+                Email
+            </swp-card-title>
+        </swp-card-header>
         <swp-toggle-row>
             <div>
                 <swp-toggle-label>Bekræftelse</swp-toggle-label>
@@ -51,10 +53,12 @@
 
     <!-- SMS -->
     <swp-card>
-        <swp-section-label>
-            <i class="ph ph-chat-text"></i>
-            SMS
-        </swp-section-label>
+        <swp-card-header>
+            <swp-card-title>
+                <i class="ph ph-chat-text"></i>
+                SMS
+            </swp-card-title>
+        </swp-card-header>
         <swp-toggle-row>
             <div>
                 <swp-toggle-label>Bekræftelse online <span class="text-secondary">(0,30 kr.)</span></swp-toggle-label>