/* Booking Calendar - Preline/Tailwind-like styling */

.booking-calendar {
  --fc-border-color: rgb(229 231 235);
  --fc-page-bg-color: transparent;
  --fc-neutral-bg-color: rgb(249 250 251);
  --fc-today-bg-color: rgb(239 246 255);
  --fc-event-bg-color: rgb(37 99 235);
  --fc-event-border-color: rgb(37 99 235);
  --fc-event-text-color: #ffffff;
  --fc-button-bg-color: #ffffff;
  --fc-button-border-color: rgb(209 213 219);
  --fc-button-text-color: rgb(55 65 81);
  --fc-button-hover-bg-color: rgb(249 250 251);
  --fc-button-hover-border-color: rgb(209 213 219);
  --fc-button-active-bg-color: rgb(37 99 235);
  --fc-button-active-border-color: rgb(37 99 235);
}

/* Overall calendar */
.booking-calendar .fc {
  font-family: inherit;
  color: rgb(31 41 55);
}

/* Toolbar spacing */
.booking-calendar .fc-header-toolbar {
  margin-bottom: 1rem;
  gap: 0.75rem;
}

/* Calendar title */
.booking-calendar .fc-toolbar-title {
  font-size: 1.125rem;
  font-weight: 600;
  color: rgb(31 41 55);
}

/* Toolbar button group */
.booking-calendar .fc-button-group {
  border-radius: 0.75rem;
  overflow: hidden;
}
/* FullCalendar toolbar buttons - Preline style */

.booking-calendar .fc-button {
  font-size: 0.8125rem; /* smaller text */
  font-weight: 500;
  line-height: 1.25rem;
  padding: 0.45rem 0.75rem;
  text-transform: none;
  box-shadow: none !important;
  border: 1px solid rgb(209 213 219);
  background-color: #ffffff;
  color: rgb(55 65 81);
}

/* Remove FullCalendar default button focus shadow */
.booking-calendar .fc-button:focus,
.booking-calendar .fc-button-primary:focus {
  box-shadow: none !important;
  outline: none;
}

/* Hover */
.booking-calendar .fc-button:hover {
  background-color: rgb(249 250 251);
  border-color: rgb(209 213 219);
  color: rgb(31 41 55);
}

/* Active button */
.booking-calendar .fc-button-primary:not(:disabled).fc-button-active,
.booking-calendar .fc-button-primary:not(:disabled):active {
  background-color: rgb(37 99 235);
  border-color: rgb(37 99 235);
  color: #ffffff;
}

/* Disabled button */
.booking-calendar .fc-button:disabled {
  background-color: rgb(249 250 251);
  color: rgb(156 163 175);
  opacity: 1;
}

/* Button groups */
.booking-calendar .fc-button-group {
  display: inline-flex;
  border-radius: 0.5rem;
  overflow: hidden;
}

/* Remove double borders inside button groups */
.booking-calendar .fc-button-group > .fc-button {
  border-radius: 0;
  margin-left: -1px;
}

/* First button in group */
.booking-calendar .fc-button-group > .fc-button:first-child {
  margin-left: 0;
  border-top-left-radius: 0.5rem;
  border-bottom-left-radius: 0.5rem;
}

/* Last button in group */
.booking-calendar .fc-button-group > .fc-button:last-child {
  border-top-right-radius: 0.5rem;
  border-bottom-right-radius: 0.5rem;
}

/* Standalone Today button */
.booking-calendar .fc-today-button {
  border-radius: 0.5rem !important;
  margin-left: 0.75rem;
}

/* Calendar border */
.booking-calendar .fc-scrollgrid {
  border-radius: 0.75rem;
  overflow: hidden;
  border-color: rgb(229 231 235);
}

/* Day headers */
.booking-calendar .fc-col-header-cell {
  background-color: rgb(249 250 251);
}

.booking-calendar .fc-col-header-cell-cushion {
  padding: 0.75rem 0.5rem;
  font-size: 0.75rem;
  font-weight: 600;
  color: rgb(75 85 99);
  text-transform: uppercase;
  letter-spacing: 0.025em;
  text-decoration: none;
}

/* Day number */
.booking-calendar .fc-daygrid-day-number {
  padding: 0.5rem;
  font-size: 0.875rem;
  color: rgb(55 65 81);
  text-decoration: none;
}

/* Other month dates */
.booking-calendar .fc-day-other .fc-daygrid-day-number {
  color: rgb(156 163 175);
}

/* Today cell */
.booking-calendar .fc-day-today .fc-daygrid-day-number {
  color: rgb(37 99 235);
  font-weight: 700;
}

/* Event pills */
.booking-calendar .fc-event {
  border-radius: 0.5rem;
  border: 0;
  padding: 0.125rem 0.375rem;
  font-size: 0.75rem;
  font-weight: 500;
  cursor: pointer;
}

/* Event hover */
.booking-calendar .fc-event:hover {
  filter: brightness(0.95);
}

/* Time grid event */
.booking-calendar .fc-timegrid-event {
  border-radius: 0.5rem;
  padding: 0.25rem;
}

/* More link */
.booking-calendar .fc-daygrid-more-link {
  font-size: 0.75rem;
  color: rgb(37 99 235);
  font-weight: 500;
  text-decoration: none;
}

/* Time labels */
.booking-calendar .fc-timegrid-slot-label {
  font-size: 0.75rem;
  color: rgb(107 114 128);
}

/* Time grid now indicator */
.booking-calendar .fc .fc-timegrid-now-indicator-line {
  border-color: rgb(239 68 68);
}

.booking-calendar .fc .fc-timegrid-now-indicator-arrow {
  border-color: rgb(239 68 68);
}

.booking-calendar .fc-daygrid-event {
  color: rgb(55 65 81);
}

.booking-calendar .booking-event-cancelled {
  opacity: 0.65;
}

.booking-calendar .booking-event-cancelled .fc-event-title {
  text-decoration: line-through;
}


/* Booking event content */

.booking-calendar .booking-event-content {
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.booking-calendar .booking-event-line {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.booking-calendar .booking-event-title {
  font-weight: 600;
}

.booking-calendar .booking-event-location {
  font-size: 0.6875rem;
  opacity: 0.85;
}

.booking-calendar .booking-event-addons {
  font-size: 0.6875rem;
  opacity: 0.8;
}

/* Monthly view should stay compact */
.booking-calendar .fc-daygrid-event {
  padding: 0.125rem 0.375rem;
}

/* Week/day event blocks can show more detail */
.booking-calendar .fc-timegrid-event .booking-event-content {
  padding: 0.125rem;
}

.booking-calendar .fc-timegrid-event .booking-event-title,
.booking-calendar .fc-timegrid-event .booking-event-location,
.booking-calendar .fc-timegrid-event .booking-event-addons {
  color: inherit;
}

/* Booking status dot colours */

.booking-calendar .booking-event-pending .booking-event-status-dot {
  background-color: rgb(234 179 8); /* yellow */
}

.booking-calendar .booking-event-confirmed .booking-event-status-dot {
  background-color: rgb(22 163 74); /* green */
}

.booking-calendar .booking-event-ongoing .booking-event-status-dot {
  background-color: rgb(249 115 22); /* orange */
}

.booking-calendar .booking-event-completed .booking-event-status-dot {
  background-color: rgb(37 99 235); /* blue */
}

.booking-calendar .booking-event-cancelled .booking-event-status-dot {
  background-color: rgb(107 114 128); /* gray */
}

.booking-calendar .booking-event-default .booking-event-status-dot {
  background-color: rgb(37 99 235);
}

/* Monthly view custom event layout */

.booking-calendar .fc-daygrid-event .booking-event-content {
  display: flex;
  align-items: flex-start;
  gap: 0.375rem;
  width: 100%;
  min-width: 0;
  overflow: hidden;
}

.booking-calendar .booking-event-status-dot {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  min-width: 0.5rem;
  margin-top: 0.35rem;
  border-radius: 9999px;
  background-color: rgb(37 99 235);
  flex-shrink: 0;
}

.booking-calendar .booking-event-text {
  min-width: 0;
  flex: 1;
}

.booking-calendar .booking-event-line {
  display: block;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Week / Day view event block colours */

.booking-calendar .fc-timegrid-event.booking-event-pending {
  background-color: rgb(234 179 8) !important;
  border-color: rgb(234 179 8) !important;
  color: rgb(17 24 39) !important;
}

.booking-calendar .fc-timegrid-event.booking-event-confirmed {
  background-color: rgb(22 163 74) !important;
  border-color: rgb(22 163 74) !important;
  color: #ffffff !important;
}

.booking-calendar .fc-timegrid-event.booking-event-ongoing {
  background-color: rgb(249 115 22) !important;
  border-color: rgb(249 115 22) !important;
  color: #ffffff !important;
}

.booking-calendar .fc-timegrid-event.booking-event-completed {
  background-color: rgb(37 99 235) !important;
  border-color: rgb(37 99 235) !important;
  color: #ffffff !important;
}

.booking-calendar .fc-timegrid-event.booking-event-cancelled {
  background-color: rgb(107 114 128) !important;
  border-color: rgb(107 114 128) !important;
  color: #ffffff !important;
  opacity: 0.75;
}

.booking-calendar .fc-timegrid-event.booking-event-default {
  background-color: rgb(37 99 235) !important;
  border-color: rgb(37 99 235) !important;
  color: #ffffff !important;
}

/* Week / Day event text */

.booking-calendar .fc-timegrid-event .booking-event-content {
  padding: 0.125rem 0.25rem;
  color: inherit;
}

.booking-calendar .fc-timegrid-event .booking-event-title,
.booking-calendar .fc-timegrid-event .booking-event-location,
.booking-calendar .fc-timegrid-event .booking-event-addons {
  color: inherit;
}

.booking-calendar .fc-timegrid-event .booking-event-title {
  font-weight: 600;
}

.booking-calendar .fc-timegrid-event .booking-event-location,
.booking-calendar .fc-timegrid-event .booking-event-addons {
  opacity: 0.9;
}