/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
 #events h3   {
	/* add your css rule here */
}


 #events p.duration, #events div.duration   {
	/* add your css rule here */
}


 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


/* Hide the per-class breakdown inside package cards/popups */
.selected-package-list.short {
  display: none !important;
}
/* Hide class-by-class list on PACKAGE CARDS (catalog grid) */
.selected-package-list,
.selected-package-list.short {
  display: none !important;
}

/* Hide class-by-class list INSIDE THE PACKAGE POPUP/MODAL */
.sb-package-popup .selected-package-list,
.sb-package-popup .selected-package-list.short,
.sb-package-popup .package-list-item,
.sb-package-popup .sb-list,
.sb-package-popup .sb-list__item {
  display: none !important;
}

/* Optional: tighten spacing after we hide the list */
.sb-package-popup .sb-package-info { margin-bottom: 0 !important; }

/* Minimal text button: MENU */
.nav-trigger{
  background: none !important;
  border: 0 !important;
  box-shadow: none !important;
  padding: 4px 10px !important;
  width: auto !important; height: auto !important;
  cursor: pointer;
  position: relative;
  line-height: 1;
}

/* hide any built-in icon */
.nav-trigger i,
.nav-trigger svg { display: none !important; }

/* inject the word MENU */
.nav-trigger::after{
  content: "MENU";
  display: inline-block !important;
  font: 600 16px/1 "Noto Sans", system-ui, -apple-system, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  letter-spacing: 1px;
  color: #000;
}

/* Hide "Show on map" button */
.btn.map {
  display: none !important;
}

/* Style the Book button clean */
.btn.book a {
  display: inline-block;
  padding: 10px 24px;
  border: 1px solid #fff;      /* thin white border */
  border-radius: 0;            /* remove rounded corners */
  background: transparent !important;
  color: #fff !important;
  font-family: Arial, sans-serif !important;
  font-size: 16px !important;
  font-weight: 500;
  text-decoration: none !important;
  transition: all 0.2s ease;
  line-height: 1.2;
}

/* Kill any icons (✓, arrows, etc.) */
.btn.book a i,
.btn.book a svg,
.btn.book a::before,
.btn.book a::after {
  display: none !important;
  content: none !important;
}

/* Change the button text */
.btn.book a {
  content: "Book Session Now" !important;
}

/* Hover effect (optional, subtle invert) */
.btn.book a:hover {
  background: rgba(255,255,255,0.15) !important;
}

/* Make availability clearer in SimplyBook */
.slot--available-slot {
  display: inline-flex;
  align-items: baseline;
  font-family: 'Inter', sans-serif;
  font-weight: 500;
  color: #111;
  background: #f5f7fa;
  border-radius: 6px;
  padding: 4px 8px;
}

.slot--available-slot::before {
  content: "Left: ";
  font-size: 13px;
  color: #6b7280;
  margin-right: 4px;
}

.slot--available-slot::after {
  content: " total";
  font-size: 13px;
  color: #9ca3af;
  margin-left: 2px;
}

/* Optional: visually emphasize the remaining number */
.slot--available-slot {
  font-size: 15px;
  font-weight: 600;
  color: #2f855a; /* green tone for clarity */
}

