#evaluationModal {
  position: fixed;
  top: 50%;
  left: 50%; /* Keep left for centering, transform handles RTL */
  transform: translate(-50%, -50%);
  background: white; /* Use white background for consistency with other sections */
  border-radius: 20px; /* Larger border-radius for consistency */
  box-shadow: 0 25px 50px rgba(0,0,0,0.3); /* Stronger shadow like .modal-content */
  max-width: 500px;
  width: 90%;
  max-height: 90vh;
  overflow-y: auto;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  z-index: 10000;
  padding: 30px; /* Slightly more padding for consistency */
  direction: rtl; /* Enforce RTL for the modal content */
}

#evaluationModal h2 {
  margin-top: 0;
  text-align: center;
  color: #2c3e50; /* Darker blue from the general theme */
  font-size: 1.8rem; /* Larger font size for titles */
  font-weight: 600; /* Bolder font weight */
  margin-bottom: 20px; /* Add some margin for spacing */
}

#evaluationForm label {
  display: block;
  margin-bottom: 8px; /* Consistent margin with .form-label */
  font-weight: 500; /* Slightly lighter weight than before, consistent with .form-label */
  color: #2c3e50; /* Darker blue from the general theme */
}

#evaluationForm input[type="number"] {
  width: 100%;
  padding: 12px 15px; /* Consistent padding with .form-input */
  margin-bottom: 20px; /* Consistent margin with .form-group */
  border: 2px solid #e1e8ed; /* Consistent border with .form-input */
  border-radius: 10px; /* Consistent border-radius with .form-input */
  font-size: 14px; /* Consistent font size with .form-input */
  box-sizing: border-box;
  transition: all 0.3s ease; /* Transition matches .form-input */
  text-align: start; /* Ensures text aligns correctly in RTL input */
}

#evaluationForm input[type="number"]:focus {
  border-color: #9b59b6; /* Purple focus color from the general theme */
  outline: none;
  box-shadow: 0 0 0 3px rgba(155, 89, 182, 0.1); /* Consistent shadow with .form-input:focus */
}

.button-container {
  text-align: center;
  margin-top: 30px; /* Add some top margin for spacing */
}

#evaluationForm button {
  padding: 12px 25px;
  border: none;
  border-radius: 10px; /* Consistent border-radius with other buttons */
  font-weight: 600;
  font-size: 1rem;
  cursor: pointer;
  margin: 0 8px; /* Slightly more margin between buttons */
  transition: all 0.3s ease; /* Consistent transition with other buttons */
  user-select: none;
  touch-action: manipulation;
}

#evaluationForm button[type="submit"] {
  background: linear-gradient(135deg, #27ae60, #219a52); /* Primary green gradient from theme */
  color: white;
  text-transform: uppercase; /* Consistent with other buttons */
  letter-spacing: 1px; /* Consistent with other buttons */
}

#evaluationForm button[type="submit"]:hover {
  background: linear-gradient(135deg, #219a52, #1e8449); /* Darker green on hover */
  transform: translateY(-3px); /* Consistent hover effect */
  box-shadow: 0 8px 20px rgba(39, 174, 96, 0.4); /* Consistent hover shadow */
}

#evaluationForm button[type="button"] {
  background: linear-gradient(135deg, #9b59b6, #8e44ad); /* Secondary purple gradient from theme */
  color: white; /* Changed to white for consistency with secondary button */
  border: none; /* Removed border, now uses gradient */
  text-transform: uppercase; /* Consistent with other buttons */
  letter-spacing: 1px; /* Consistent with other buttons */
}

#evaluationForm button[type="button"]:hover {
  background: linear-gradient(135deg, #8e44ad, #7d3c98); /* Darker purple on hover */
  color: white; /* Stays white on hover */
  transform: translateY(-3px); /* Consistent hover effect */
  box-shadow: 0 8px 20px rgba(155, 89, 182, 0.4); /* Consistent hover shadow */
}

#evaluationResult {
  margin-top: 30px;
  background: white; /* Changed to white for consistency */
  border-radius: 15px; /* Consistent border-radius with sections */
  padding: 20px;
  overflow-x: auto;
  font-size: 1rem;
  color: #333;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.08); /* Consistent shadow with sections */
}

#evaluationResult table {
  width: 100%;
  border-collapse: collapse;
}

#evaluationResult th,
#evaluationResult td {
  padding: 12px; /* Slightly more padding for table cells */
  border-bottom: 1px solid #e9ecef;
}

#evaluationResult thead {
  background: linear-gradient(135deg, #9b59b6, #8e44ad); /* Secondary purple gradient for table header */
  color: white;
}

#evaluationResult tr:hover {
  background: #f0f8ff; /* Lighter hover background for table rows */
}

.modal-close-btn {
  position: absolute;
  top: 10px;
  left: 10px;
  background: none;
  border: none;
  font-size: 24px;
  color: #444;
  cursor: pointer;
  z-index: 10001;
}
.modal-close-btn:hover {
  color: #000;
}