fix: visual issues

Author: RitzzzZ2021

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

@@ -61,13 +61,15 @@
 }
 
 /* Labels */
-.dateLabel {
+.dateLabelLight {
   font-size: 14px;
   font-weight: 500;
   color: #333;
 }
 
-.dark .dateLabel {
+.dateLabelDark {
+  font-size: 14px;
+  font-weight: 500;
   color: #cfd7e3;
 }
 
@@ -96,8 +98,14 @@
   width: 100%;
 }
 
+:global(.react-datepicker__close-icon::after) {
+  background: none;
+  color: #b9b9b9;
+  font-size: 18px;
+}
+
 .selectDark {
-  color: #cfd7e3;
+  color: #142032;
 }
 
 /* No data text */
@@ -116,6 +124,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

@@ -101,14 +101,18 @@ function IssueCharts() {
       <h2 className={darkMode ? styles.titleDark : styles.title}>Longest Open Issues</h2>
 
       <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>
@@ -118,11 +122,15 @@ function IssueCharts() {
               selected={endDate}
               onChange={date => setEndDate(date)}
               placeholderText="End Date"
+              isClearable
               className={darkMode ? styles.dateDark : styles.dateLight}
             />
           </div>
         </div>
 
+        {/* Label: Project */}
+        <div className={styles.rowLabel}>Project</div>
+
         {/* Row 2: Project selector */}
         <div className={styles.projectRow}>
           <Select