diff --git a/src/components/BMDashboard/WeeklyProjectSummary/Financials/CostBreakDown/CostBreakDown.module.css b/src/components/BMDashboard/WeeklyProjectSummary/Financials/CostBreakDown/CostBreakDown.module.css
index 7f1a0490e4e..3923a7283cf 100644
--- a/src/components/BMDashboard/WeeklyProjectSummary/Financials/CostBreakDown/CostBreakDown.module.css
+++ b/src/components/BMDashboard/WeeklyProjectSummary/Financials/CostBreakDown/CostBreakDown.module.css
@@ -347,7 +347,7 @@
 }
 
 .wrapperDark .filterInput[type='date']::-webkit-calendar-picker-indicator {
-  filter: invert(1) opacity(0.8);
+  filter: opacity(0.8);
 }
 
 /* ===================== Responsive ===================== */
@@ -430,3 +430,10 @@
     display: none;
   }
 }
+
+/* Dark mode date inputs: two classes so the global input[type='date'] rule does not override them */
+.wrapperDark .filterInput {
+  background-color: var(--cb-input-bg);
+  color: var(--cb-text-color);
+  color-scheme: dark;
+}
diff --git a/src/components/BMDashboard/WeeklyProjectSummary/Financials/CostVarianceTrendGraph.module.css b/src/components/BMDashboard/WeeklyProjectSummary/Financials/CostVarianceTrendGraph.module.css
index d7f4d28260c..328a5629de6 100644
--- a/src/components/BMDashboard/WeeklyProjectSummary/Financials/CostVarianceTrendGraph.module.css
+++ b/src/components/BMDashboard/WeeklyProjectSummary/Financials/CostVarianceTrendGraph.module.css
@@ -35,7 +35,7 @@
   width: 100%;
 }
 
-@media (max-width: 900px) {
+@media (width <= 900px) {
   .filtersGrid {
     grid-template-columns: 1fr; 
   }
@@ -75,7 +75,7 @@
   width: 100%;
 }
 
-.dateInput {
+.datePickerWrapper .dateInput {
   width: 100%;
   padding: 8px 30px 8px 12px;
   border-radius: 6px;
@@ -86,18 +86,18 @@
   outline: none;
 }
 
-.dateInput:focus {
+.datePickerWrapper .dateInput:focus {
   border-color: #4285F4;
 }
 
-.darkDateInput {
+.dateInput.darkDateInput {
   background-color: #253342;
   color: #fff;
   border-color: #2d4059;
   color-scheme: dark;
 }
 
-.darkDateInput:focus {
+.dateInput.darkDateInput:focus {
   border-color: #3a506b;
 }
 
@@ -174,7 +174,7 @@
 }
 
 .varianceOverLight { color: #e74c3c !important; }
-.varianceOverDark { color: #ff4444 !important; }
+.varianceOverDark { color: #f44 !important; }
 
 .varianceUnderLight { color: #2ecc71 !important; }
 .varianceUnderDark { color: #4ade80 !important; }
\ No newline at end of file
diff --git a/src/components/BMDashboard/WeeklyProjectSummary/Tools/ToolsStoppageHorizontalBarChart/ToolsStoppageHorizontalBarChart.module.css b/src/components/BMDashboard/WeeklyProjectSummary/Tools/ToolsStoppageHorizontalBarChart/ToolsStoppageHorizontalBarChart.module.css
index bcbb1248044..6617401682c 100644
--- a/src/components/BMDashboard/WeeklyProjectSummary/Tools/ToolsStoppageHorizontalBarChart/ToolsStoppageHorizontalBarChart.module.css
+++ b/src/components/BMDashboard/WeeklyProjectSummary/Tools/ToolsStoppageHorizontalBarChart/ToolsStoppageHorizontalBarChart.module.css
@@ -8,7 +8,7 @@
 
 /* Base styles define size - dark mode only changes colors */
 :global(.datePickerInput),
-:global(.react-datepicker-wrapper input),
+.datepickerWrapper :global(.react-datepicker-wrapper input),
 :global(.react-datepicker-wrapper .datePickerInput) {
   font-size: 13px !important;
   padding: 8px 12px !important;