#mvsr-attendance-calculator {
  max-width: 500px;
  margin: 20px auto;
  font-family: inherit;
  padding: 15px;
  background: #fff;
  border: 2px solid #007BFF; /* Blue accent border */
  border-radius: 10px;
  box-shadow: 0px 4px 8px rgba(0,0,0,0.1);
}

#mvsr-attendance-calculator h2 {
  text-align: center;
  margin-bottom: 15px;
  font-weight: bold;
  color: #007BFF; /* Blue accent for heading */
}

.subject-row {
  border: 1px solid #ddd;
  margin-bottom: 10px;
  border-radius: 5px;
  overflow: hidden;
}

/* Collapse button with blue accent */
.collapse-btn {
  width: 100%;
  background-color: #e6f0ff !important; /* Light blue background */
  color: #000 !important;
  border: none !important;
  text-align: left;
  padding: 10px;
  font-size: 14px;
  font-weight: bold;
  cursor: pointer;
}
.collapse-btn:hover {
  background-color: #d0e4ff !important; /* Darker blue on hover */
}

.subject-content {
  padding: 10px;
  display: none;
}

#mvsr-attendance-calculator label {
  display: block;
  margin-top: 8px;
}

#mvsr-attendance-calculator input {
  width: 100%;
  padding: 6px;
  margin-top: 3px;
  border: 1px solid #ccc;
  border-radius: 5px;
  box-sizing: border-box;
}

#mvsr-attendance-calculator button {
  margin-top: 12px;
  padding: 10px;
  width: 100%;
  background: #007BFF;
  border: none;
  color: white;
  border-radius: 5px;
  cursor: pointer;
  font-weight: bold;
}
#mvsr-attendance-calculator button:hover {
  background: #0056b3;
}

#mvsr-attendance-calculator #result {
  margin-top: 15px;
  font-weight: bold;
  white-space: pre-line;
  padding: 10px;
  border: 1px solid #007BFF;
  background: #f0f7ff;
  border-radius: 5px;
}