/* Headings on services (like "Brand Consult Call") */
#events h3 {
  font-family: 'Helvetica Neue', sans-serif;
  font-size: 22px;
  font-weight: bold;
  text-transform: uppercase;
  color: #000000;
}

/* Duration label */
#events p.duration, #events div.duration {
  color: #555555;
  font-style: italic;
  font-size: 14px;
}

/* Service description */
#events p.description, #events div.description {
  font-size: 16px;
  line-height: 1.5;
  color: #222;
  font-family: 'Helvetica Neue', sans-serif;
  margin-bottom: 10px;
}

/* Selected service highlight */
#events .selectedEvent {
  border: 2px solid #FFD700;
  background-color: #FFF8DC;
  padding: 15px;
  border-radius: 10px;
}

/* Reserve time button (main call to action) */
#events input.reserve_time_btn {
  background-color: #000000;
  color: #ffffff;
  font-weight: bold;
  font-size: 16px;
  border: none;
  padding: 12px 24px;
  border-radius: 8px;
  cursor: pointer;
  text-transform: uppercase;
}

#events input.reserve_time_btn:hover {
  background-color: #FFD700;
  color: #000000;
}

/* Select another service button */
#events input.select_another_btn {
  background-color: #f0f0f0;
  color: #333;
  font-size: 14px;
  padding: 10px 20px;
  border-radius: 6px;
  border: 1px solid #ccc;
  margin-top: 10px;
}

/* Timeline (time slot selection area) */
#eventForm #timeline-container h3 {
  font-weight: bold;
  font-size: 18px;
  color: #000;
}

/* Save/confirm booking button */
#eventForm #save_button {
  background-color: #000000;
  color: #ffffff;
  font-size: 16px;
  font-weight: bold;
  padding: 12px 24px;
  border: none;
  border-radius: 8px;
  cursor: pointer;
  text-transform: uppercase;
}

#eventForm #save_button:hover {
  background-color: #FFD700;
  color: #000000;
}

/* Calendar visual tweaks */
.timeline td.not_worked_time {
  background-color: #f5f5f5;
}

.timeline td.free_time {
  background-color: #e0ffe0;
}

.timeline td.selected_time {
  background-color: #FFD700;
}

.timeline td.reserved_time {
  background-color: #ffcccc;
}

/* Loader (if applicable) */
div#loading {
  display: none;
}
