body {
  font-family: 'Cairo', sans-serif;
  background-color: #f8f9fa;
}

.week-card {
  width: 160px;
  height: 220px;
  background: #ffffff;
  border: 2px solid #0d6efd;
  border-radius: 12px;
  box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.1);
  cursor: pointer;
  transition: transform 0.2s;
}

.week-card:hover {
  transform: scale(1.05);
  background-color: #e9f3ff;
}

.week-card h4 {
  font-size: 1.2rem;
  font-weight: bold;
  color: #0d6efd;
}

.icon-date {
  color: #0d6efd;
  font-size: 2rem;
}

.teacher-location-group select {
  /* padding: 0.25rem;  */
  /* padding-right: 20px; */
  width: 200px;
  text-align: center;
}

.add-input-btn {
  font-size: 0.8rem;
  color: #198754;
  background-color: transparent;
  border: none;
}

.teacher-location-group {
  border-bottom: 1px solid #000000;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  margin-top: 0.5rem;
}

.remove-input-btn i{
  color: red;
  cursor: pointer;
}

#supervisionTableBody, #dutyTableBody {
  border: 1px solid #0d6efd;
  border-radius: 8px;
  padding: 1rem;
  background-color: #f8f9fa;
  min-height: 200px;
}

.modal-body h4 {
  color: #0d6efd;
  font-weight: bold;
}

.modal-title{
  color : #390dfd;
  font-weight: bold;
  font-size: 1.5rem;
}

.day1 {
  color: #28a745; /* Slightly lighter green for a fresher look */
  background-color: #d4edda; /* Light green background */
  border: 1px solid #28a745; /* Border matching the text color */
  border-radius: 5px; /* Rounded corners */
  padding: 5px 10px; /* Padding for better spacing */
}

.day2 {
  color: #dc3545; /* Strong red for impact */
  background-color: #f8d7da; /* Light red background */
  border: 1px solid #dc3545; /* Border matching the text color */
  border-radius: 5px;
  padding: 5px 10px;
}

.day3 {
  color: #ffc107; /* Bright yellow */
  background-color: #fff3cd; /* Soft yellow background */
  border: 1px solid #ffc107;
  border-radius: 5px;
  padding: 5px 10px;
}

.day4 {
  color: #0d6efd; /* Vibrant blue */
  background-color: #cce5ff; /* Light blue background */
  border: 1px solid #0d6efd;
  border-radius: 5px;
  padding: 5px 10px;
}

.day5 {
  color: #6f42c1; /* Purple */
  background-color: #e2d9f1; /* Light purple background */
  border: 1px solid #6f42c1;
  border-radius: 5px;
  padding: 5px 10px;
}


.week1{
  color: #198754;
}

.week2{
  color: #dc3545;
}

.week3{
  color: #ffc107;
}

.week4{
  color: #0d6efd;
}

.week5{
  color: #6f42c1;
}
.week6{
  color: #198754;
}