fix: conficts

Author: RitzzzZ2021

src/components/BMDashboard/Issues/issueChart.module.css

@@ -243,13 +243,15 @@
 }
 
 /* Labels */
-.dateLabel {
+.dateLabelLight {
   font-size: 14px;
   font-weight: 500;
   color: #333;
 }
 
-.dark .dateLabel {
+.dateLabelDark {
+  font-size: 14px;
+  font-weight: 500;
   color: #cfd7e3;
 }
 
@@ -278,6 +280,12 @@
   width: 100%;
 }
 
+:global(.react-datepicker__close-icon::after) {
+  background: none;
+  color: #b9b9b9;
+  font-size: 18px;
+}
+
 /* DARK MODE CONTROL */
 .controlDark {
   background: #22272e !important;
@@ -360,6 +368,13 @@
   font-size: 16px;
 }
 
+.rowLabel {
+  margin: 8px 0 8px;
+  font-weight: 600;
+  font-size: 16px;
+}
+
+
 /* Responsive */
 @media (max-width: 650px) {
   .dateRow {

src/components/BMDashboard/Issues/openIssueCharts.jsx

@@ -128,14 +128,18 @@ function IssueCharts() {
         Date Range
       </label>
       <div className={styles.filterCenterWrapper}>
+        {/* Label: Date */}
+        <div className={styles.rowLabel}>Date</div>
+
         {/* Row 1: Date picker */}
         <div className={styles.dateRow}>
-          <span className={styles.dateLabel}>From</span>
+          <span className={darkMode ? styles.dateLabelDark : styles.dateLabelLight}>From</span>
           <div className={styles.dateField}>
             <DatePicker
               selected={startDate}
               onChange={date => setStartDate(date)}
               placeholderText="Start Date"
+              isClearable
               className={darkMode ? styles.dateDark : styles.dateLight}
             />
           </div>
@@ -145,6 +149,7 @@ function IssueCharts() {
               selected={endDate}
               onChange={date => setEndDate(date)}
               placeholderText="End Date"
+              isClearable
               className={darkMode ? styles.dateDark : styles.dateLight}
             />
           </div>