BUG :: Fix the Rate your Experience [ Not visible text ]

index.html

@@ -2515,19 +2515,19 @@ <h2 style="color: #0057B3;" id="h1darkbtn">Rate your experience</h2>
 
         <div style="display: flex;">
           <form class="form" id="reviewForm">
-            <label for="name" id="darkbtn" style="color: black;">Your Name:</label>
+            <label for="name" id="darkbtn" >Your Name:</label>
             <input type="text" id="name" name="name" required pattern="[a-zA-Z ]+"
             placeholder="Enter your name"
             oninvalid="this.setCustomValidity('Numbers and Symbols are not allowed')"
             oninput="this.setCustomValidity('')"/>
 
-            <label for="destination" id="darkbtn" style="color: black;">Destination/Service:</label>
+            <label for="destination" id="darkbtn">Destination/Service:</label>
             <input type="text" id="destination" name="destination" required  required pattern="[a-zA-Z ]+"
             placeholder="Enter your destination or service"
             oninvalid="this.setCustomValidity('Numbers and Symbols are not allowed')"
             oninput="this.setCustomValidity('')"/>
 
-            <label for="rating" id="darkbtn" style="color: black;">Rating:</label>
+            <label for="rating" id="darkbtn">Rating:</label>
            <!-- <select id="rating" class="rating" name="rating">
               <option value="5">⭐⭐⭐⭐⭐</option>
               <option value="4">⭐⭐⭐⭐</option>
@@ -2553,9 +2553,9 @@ <h2 style="color: #0057B3;" id="h1darkbtn">Rate your experience</h2>
             </div>
            </div>
 
-            <label for="review" id="darkbtn" style="color: black;">Your Review:</label>
+            <label for="review" id="darkbtn" >Your Review:</label>
             <textarea id="review" name="review" rows="3" placeholder="Write your review here..."></textarea>
-            <label for="complaint" id="darkbtn" style="color: black;">Complaint (if any):</label>
+            <label for="complaint" id="darkbtn" >Complaint (if any):</label>
             <textarea id="complaint" name="complaint" rows="3"
               placeholder="Describe any issue with the staff here. Please provide details"></textarea>
 

style.css

@@ -1656,6 +1656,12 @@ Light mode styles body.light-mode {
 .dark-mode .review-p {
   color: whitesmoke;
 }
+.dark-mode #darkbtn {
+  color: whitesmoke;
+}
+ #darkbtn{
+  color: #000000;
+ }
 .reviews-section h2 {
   font-size: 3em;
   margin-bottom: 20px;