Merge pull request #211 from subin-shk/dark-review

fixed dark mode in review section

style.css

@@ -72,9 +72,9 @@ button {
   cursor: pointer;
   transition: background 0.6s ease-in-out;
 }
-#btn:hover{
-  background-color: rgb(1, 20, 27); 
-  box-shadow: 0 0 10px lightblue, 0 0 20px lightblue; 
+#btn:hover {
+  background-color: rgb(1, 20, 27);
+  box-shadow: 0 0 10px lightblue, 0 0 20px lightblue;
 }
 /**** MAIN PAGE  ****/
 
@@ -683,11 +683,81 @@ body.dark-mode {
   border-color: #ccc;
 }
 
-.dark-mode .review-item {
-  border-color: black; /* Dark border in dark mode */
+/* Dark Mode Styles for Reviews Section */
+.dark-mode .reviews-section {
+  background-color: #121212; /* Dark background */
+  color: white; /* White text */
 }
 
-.cab-booking-section input, .cab-booking-section select {
+.dark-mode .review {
+  background-color: #1e1e1e; /* Dark background for review cards */
+  color: white; /* White text for review content */
+  border: 1px solid #333; /* Darker border */
+}
+
+.dark-mode .review h4 {
+  color: #ffa500; /* Optional: Highlight the reviewer's name */
+}
+
+.dark-mode .review p {
+  color: white; /* White text for review paragraphs */
+}
+
+/* Adjusting rating stars color in dark mode */
+.dark-mode .rating {
+  color: #ffcc00; /* Bright yellow stars for dark mode */
+}
+
+/* Dark Mode Styles for Review Form */
+.review-form {
+  background-color: #121212; /* Dark background for the review form */
+  color: white; /* White text color */
+  padding: 20px; /* Padding for inner spacing */
+  border-radius: 5px; /* Rounded corners */
+  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.5); /* Optional: shadow for depth */
+}
+
+.review-form h1 {
+  margin-bottom: 10px; /* Space below heading */
+}
+
+.review-form label {
+  margin-top: 10px; /* Space above labels */
+  display: block; /* Makes the label block-level for better spacing */
+}
+
+.review-form input,
+.review-form select,
+.review-form textarea {
+  width: 100%; /* Full width */
+  padding: 10px; /* Padding inside fields */
+  background-color: #1e1e1e; /* Dark background for inputs */
+  color: white; /* White text */
+  border: 1px solid #333; /* Dark border */
+  border-radius: 4px; /* Slightly rounded corners */
+  margin-bottom: 10px; /* Space between fields */
+}
+
+.review-form input::placeholder,
+.review-form textarea::placeholder {
+  color: #aaa; /* Lighter placeholder text */
+}
+
+.review-form button {
+  background-color: #333; /* Dark button background */
+  color: white; /* White button text */
+  border: none; /* No border */
+  padding: 10px 15px; /* Padding inside button */
+  border-radius: 4px; /* Rounded corners */
+  cursor: pointer; /* Pointer on hover */
+}
+
+.review-form button:hover {
+  background-color: #444; /* Slightly lighter on hover */
+}
+
+.cab-booking-section input,
+.cab-booking-section select {
   width: 100%;
   font-weight: 600;
   padding: 20px;