.custom-calendar {
  background: #fff;
  border-radius: 12px;
  padding: 1rem;
}

.calendar-grid {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 6px;
}

.day-name {
  text-align: center;
  font-weight: 600;
  font-size: 0.85rem;
  color: #555;
}

.calendar-day {
  text-align: center;
  padding: 8px 0;
  border-radius: 50%;
  cursor: pointer;
  font-size: 0.85rem;
}

.calendar-day:hover {
  background: #eef3ff;
}

.calendar-day.selected {
  background: #cfe2ff;
  font-weight: 600;
}

.calendar-day.sunday {
  background: #fde2e2;
}
/* ===== Calendar Hover & Selection Animation ===== */

.calendar-day {
  transition: 
    background-color 0.25s ease,
    transform 0.15s ease,
    box-shadow 0.15s ease;
}

/* Hover effect */
.calendar-day:hover {
  background-color: #eef3ff;
  transform: scale(1.08);
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.08);
}

/* Selected day */
.calendar-day.selected {
  background-color: #3b82f6;
  color: #fff;
  font-weight: 600;
  transform: scale(1.12);
  box-shadow: 0 6px 14px rgba(59, 130, 246, 0.35);
}

/* Selected + hover (keeps smoothness) */
.calendar-day.selected:hover {
  transform: scale(1.15);
}

/* Sunday animation override */
.calendar-day.sunday:hover {
  background-color: #fde2e2;
}

/* Prevent animation on empty cells */
.calendar-grid > div:empty {
  pointer-events: none;
}


.legend {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 50%;
}

.legend.full { background: #c7f0d8; }
.legend.half { background: #fff3bf; }
.legend.optional { background: #dbeafe; }
.legend.sunday { background: #fde2e2; }

 /* Right side booking form alignment */
.booking-form {
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.booking-form .form-select,
.booking-form .form-control {
  height: 44px;
  font-size: 0.95rem;
}

.booking-form .btn {
  height: 46px;
  font-size: 1rem;
  margin-top: 6px;
}

/* Spacing consistency */
.booking-form > * {
  margin-bottom: 14px;
}

/* Remove extra gap below button */
.booking-form > *:last-child {
  margin-bottom: 0;
}

/* Booked dates: red background, not selectable */
.calendar-day.red-day {
  background: #c0392b !important;
  color: #fff !important;
  font-weight: bold;
  cursor: not-allowed;
  pointer-events: none;
}
.calendar-day.red-day:hover {
  background: #c0392b !important;
  color: #fff !important;
  transform: none;
}

.booked { background: #c7f0d8; color: #fff; }
.halfday { background: #fff3bf; color: #000; }
.optional { background: #dbeafe; color: #fff; }
.holiday { background: #fde2e2; color: #fff; }