diff --git a/public/css/style.css b/public/css/style.css
index c44a691..55a4e05 100644
--- a/public/css/style.css
+++ b/public/css/style.css
@@ -578,6 +578,23 @@ body {
   margin-top: 8px;
 }
 
+/* Bootstrap-ähnliche .form-control: nicht unter .form-group, daher eigenes Theming */
+.form-control {
+  background-color: var(--bg-surface);
+  color: var(--text-main);
+  border: 1px solid var(--border-color);
+}
+
+.form-control::placeholder {
+  color: var(--text-soft);
+}
+
+.form-control:focus {
+  outline: none;
+  border-color: var(--primary);
+  box-shadow: 0 0 0 3px var(--focus-ring);
+}
+
 .week-selector-goto .form-control {
   width: 200px;
   max-width: 100%;
@@ -585,6 +602,8 @@ body {
   border: 1px solid var(--border-color);
   border-radius: 4px;
   font-size: 14px;
+  background-color: var(--bg-surface);
+  color: var(--text-main);
 }
 
 .go-to-week-error {
@@ -1032,6 +1051,15 @@ table input[type="text"] {
   border-top: 2px solid var(--border-soft);
 }
 
+#weekendContent,
+#weekendContent table,
+#weekendContent tbody,
+#weekendContent tr,
+#weekendContent td {
+  background-color: var(--bg-surface);
+  color: var(--text-main);
+}
+
 .activities-cell {
   padding: 15px !important;
 }
@@ -1371,7 +1399,12 @@ table input[type="text"] {
 
 /* Pausenfeld: rot nur wenn unter gesetzlicher Mindestpause (Tooltip im HTML) */
 input.break-below-legal {
-  color: #dc3545;
+  color: var(--danger) !important;
+}
+
+table input.break-below-legal,
+.break-below-legal {
+  color: var(--danger) !important;
 }
 
 /* App Footer */
diff --git a/public/js/dashboard.js b/public/js/dashboard.js
index c3b98af..91884b6 100644
--- a/public/js/dashboard.js
+++ b/public/js/dashboard.js
@@ -821,11 +821,11 @@ function renderWeek() {
     <tr>
       <td colspan="6" style="padding: 0; border: none;">
         <div class="weekend-section" style="margin-top: 10px;">
-          <div class="collapsible-header" onclick="toggleWeekendSection()" style="cursor: pointer; padding: 12px; background-color: #f5f5f5; border: 1px solid #ddd; border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
-            <h4 style="margin: 0; font-size: 14px; font-weight: 600;">Wochenende</h4>
+          <div class="collapsible-header" onclick="toggleWeekendSection()" style="cursor: pointer; padding: 12px; background-color: var(--bg-soft); border: 1px solid var(--border-color); border-radius: 4px; display: flex; justify-content: space-between; align-items: center;">
+            <h4 style="margin: 0; font-size: 14px; font-weight: 600; color: var(--text-strong);">Wochenende</h4>
             <span id="weekendToggleIcon" style="font-size: 16px; transition: transform 0.3s;">▼</span>
           </div>
-          <div id="weekendContent" style="display: none; border: 1px solid #ddd; border-top: none; border-radius: 0 0 4px 4px; background-color: #fff;">
+          <div id="weekendContent" style="display: none; border: 1px solid var(--border-color); border-top: none; border-radius: 0 0 4px 4px; background-color: var(--bg-surface);">
             <table style="width: 100%; border-collapse: collapse;">
               <tbody>
   `;