/* Enhanced Calendar Border and Footer Styling */
.calendar {
  width: 100%;
  border-collapse: collapse;
  background-color: #1e1e1e; /* Dark calendar background */
  color: #f8f8f2; /* Light text color */
  border: 2px solid #ffd700; /* Yellow border for the calendar outline */
  border-radius: 8px; /* Rounded corners for a softer look */
}

/* Footer Dots */
.footer-dots {
  color: #ffb400; /* Orange/yellow color for footer dots */
}

/* Optional Styling for Footer Dots (if it's a background pattern) */
.footer-dots-background {
  background-color: #ffb400; /* Sets an orange/yellow background if the dots are an image or pattern */
}

/* Header (Month and Weekdays) */
.calendar th {
  background-color: #333333; /* Darker shade for header */
  color: #ffd700; /* Gold text for the header */
  padding: 10px;
  font-weight: normal;
}

/* Cells (Days) */
.calendar td {
  width: 14.28%;
  height: 100px;
  vertical-align: top;
  border: 1px solid #444444; /* Slightly lighter border for cells */
  background-color: #2e2e2e; /* Darker cell background */
  padding: 5px;
  color: #ffd700; /* Orange for day numbers */
  transition: background-color 0.3s, color 0.3s;
}

/* Link Styling for Days with Notes */
.calendar td a {
  display: block;
  text-decoration: none;
  color: #ffb400; /* Orange links */
  font-weight: bold;
}

.calendar td a:hover {
  color: #ffc107; /* Lighter yellow-orange on hover */
  background-color: #444444; /* Slightly darker background on hover */
  border-radius: 3px;
  padding: 3px;
}

/* Empty Cells */
.calendar td {
  text-align: right;
  padding: 5px;
  color: #d3d3d3; /* Lighter gray for day numbers without notes */
}

/* Highlighted Day Styling */
.calendar td.highlighted {
  background-color: #3e3e3e; /* Slightly darker background for highlighted days */
  color: #ffb400; /* Orange for highlighted day number */
}

.calendar td.highlighted a {
  color: #ffb400;
}

.calendar td.highlighted:hover {
  background-color: #555555; /* Darker shade on hover */
  color: #ffc107; /* Slightly lighter orange */
}