diff --git a/web/src/components/settings/Step1NameCamera.tsx b/web/src/components/settings/Step1NameCamera.tsx
index b0fceb4e1..c99b3ba04 100644
--- a/web/src/components/settings/Step1NameCamera.tsx
+++ b/web/src/components/settings/Step1NameCamera.tsx
@@ -38,6 +38,7 @@ import {
   StreamConfig,
 } from "@/types/cameraWizard";
 import { FaCircleCheck } from "react-icons/fa6";
+import { Card, CardContent, CardTitle } from "../ui/card";
 
 type Step1NameCameraProps = {
   wizardData: Partial<WizardFormData>;
@@ -109,7 +110,7 @@ export default function Step1NameCamera({
         wizardData.brandTemplate &&
         CAMERA_BRAND_VALUES.includes(wizardData.brandTemplate as CameraBrand)
           ? (wizardData.brandTemplate as CameraBrand)
-          : "hikvision",
+          : "dahua",
       customUrl: wizardData.customUrl || "",
     },
     mode: "onChange",
@@ -357,10 +358,8 @@ export default function Step1NameCamera({
                           (brand) => brand.value === field.value,
                         );
                         return selectedBrand ? (
-                          <FormDescription className="pt-0.5">
-                            <div className="mt-1 text-xs text-muted-foreground">
-                              {selectedBrand.exampleUrl}
-                            </div>
+                          <FormDescription className="mt-1 pt-0.5 text-xs text-muted-foreground">
+                            {selectedBrand.exampleUrl}
                           </FormDescription>
                         ) : null;
                       })()}
@@ -492,43 +491,51 @@ export default function Step1NameCamera({
               </div>
             )}
 
-            <div className="text-sm font-semibold text-primary-variant">
-              {t("cameraWizard.step1.streamDetails")}
-            </div>
-            <div className="text-sm">
-              {testResult.resolution && (
-                <div>
-                  <span className="text-secondary-foreground">
-                    {t("cameraWizard.testResultLabels.resolution")}:
-                  </span>{" "}
-                  <span className="text-primary">{testResult.resolution}</span>
-                </div>
-              )}
-              {testResult.videoCodec && (
-                <div>
-                  <span className="text-secondary-foreground">
-                    {t("cameraWizard.testResultLabels.video")}:
-                  </span>{" "}
-                  <span className="text-primary">{testResult.videoCodec}</span>
-                </div>
-              )}
-              {testResult.audioCodec && (
-                <div>
-                  <span className="text-secondary-foreground">
-                    {t("cameraWizard.testResultLabels.audio")}:
-                  </span>{" "}
-                  <span className="text-primary">{testResult.audioCodec}</span>
-                </div>
-              )}
-              {testResult.fps && (
-                <div>
-                  <span className="text-secondary-foreground">
-                    {t("cameraWizard.testResultLabels.fps")}:
-                  </span>{" "}
-                  <span className="text-primary">{testResult.fps}</span>
-                </div>
-              )}
-            </div>
+            <Card className="p-4">
+              <CardTitle className="mb-2 text-sm">
+                {t("cameraWizard.step1.streamDetails")}
+              </CardTitle>
+              <CardContent className="p-0 text-sm">
+                {testResult.resolution && (
+                  <div>
+                    <span className="text-secondary-foreground">
+                      {t("cameraWizard.testResultLabels.resolution")}:
+                    </span>{" "}
+                    <span className="text-primary">
+                      {testResult.resolution}
+                    </span>
+                  </div>
+                )}
+                {testResult.videoCodec && (
+                  <div>
+                    <span className="text-secondary-foreground">
+                      {t("cameraWizard.testResultLabels.video")}:
+                    </span>{" "}
+                    <span className="text-primary">
+                      {testResult.videoCodec}
+                    </span>
+                  </div>
+                )}
+                {testResult.audioCodec && (
+                  <div>
+                    <span className="text-secondary-foreground">
+                      {t("cameraWizard.testResultLabels.audio")}:
+                    </span>{" "}
+                    <span className="text-primary">
+                      {testResult.audioCodec}
+                    </span>
+                  </div>
+                )}
+                {testResult.fps && (
+                  <div>
+                    <span className="text-secondary-foreground">
+                      {t("cameraWizard.testResultLabels.fps")}:
+                    </span>{" "}
+                    <span className="text-primary">{testResult.fps}</span>
+                  </div>
+                )}
+              </CardContent>
+            </Card>
           </div>
         </div>
       )}
diff --git a/web/src/components/settings/Step2StreamConfig.tsx b/web/src/components/settings/Step2StreamConfig.tsx
index 2bb88bb78..4f0d938d0 100644
--- a/web/src/components/settings/Step2StreamConfig.tsx
+++ b/web/src/components/settings/Step2StreamConfig.tsx
@@ -247,8 +247,8 @@ export default function Step2StreamConfig({
                   )}
                   {stream.testResult && !stream.testResult.success && (
                     <div className="flex items-center gap-2 text-sm">
-                      <LuX className="size-4 text-destructive" />
-                      <span className="text-destructive">
+                      <LuX className="size-4 text-danger" />
+                      <span className="text-danger">
                         {t("cameraWizard.step2.notConnected")}
                       </span>
                     </div>
@@ -301,7 +301,7 @@ export default function Step2StreamConfig({
               {stream.testResult &&
                 !stream.testResult.success &&
                 stream.userTested && (
-                  <div className="rounded-md border border-destructive/20 bg-destructive/10 p-3 text-sm text-destructive">
+                  <div className="rounded-md border border-danger/20 bg-danger/10 p-3 text-sm text-danger">
                     <div className="font-medium">
                       {t("cameraWizard.step2.testFailedTitle")}
                     </div>
@@ -340,7 +340,7 @@ export default function Step2StreamConfig({
 
               <div className="space-y-2">
                 <Label className="text-sm font-medium">
-                  {t("cameraWizard.step2.liveViewTitle")}
+                  {t("cameraWizard.step2.featuresTitle")}
                 </Label>
                 <div className="rounded-lg bg-background p-3">
                   <div className="flex items-center justify-between">