/* 
 * START WooCommerce Bookings datepicker calendar
   Modify the color styles of the WooCommerce Bookings datepicker calendar.
   Add any/all of these styles to your theme's custom CSS, but be sure to change
   the color hex codes to your choice. They're all black here.
*/

/* Hide borders */
#wc-bookings-booking-form.wc-bookings-booking-form,
#wc-bookings-booking-form .wc-bookings-date-picker {
	border: none;
}

#wc-bookings-booking-form .partial_booked a {
	background-color: orange !important;
}

#wc-bookings-booking-form .wc-bookings-date-picker .ui-widget-content {
	box-shadow: none;
	border: 1px solid #eee;
}

/* Hide timezone block */
#wc-bookings-booking-form .wc-bookings-date-picker-timezone-block {
	display: none;
}

/* Month header background color */
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker-header,
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker-header .ui-datepicker-title {
	background: var(--color-primary) !important;
}

/* Previous/Next month arrow background color */
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker .ui-datepicker-next, 
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker .ui-datepicker-prev {
	background-color: var(--color-primary);
}

/* Previous/Next month arrows if not allowed, and calendar dates that are not available */
.ui-state-disabled, 
.ui-widget-content .ui-state-disabled, 
.ui-widget-header .ui-state-disabled {
	opacity: 1;
}

/* Days of the week header background color */
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker th {
	background-color: #fff;
}

/* Days of the week header font color */
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker th {
	color: #000;
}

/* Past and unavailable calendar days background color (not available) */
.ui-datepicker-calendar tbody {
	/*background-color: #fff;*/
	background-color: #eee !important;
}

/* Available calendar days background color */
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker td.bookable a {
	/*background-color: #fff !important;*/
	color: #000 !important;
}

/* Available calendar day hover background color */
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker td.bookable a:hover {
	background-color: #000 !important;
	color: #fff !important;
}

/* Fully booked calendar days */
.wc-bookings-date-picker .ui-datepicker td.fully_booked a, 
.wc-bookings-date-picker .ui-datepicker td.fully_booked span {
	background-color: red !important;
	color: #fff !important;
}

/* Fully booked calendar days color opacity */
 .wc-bookings-date-picker .ui-datepicker td.ui-state-disabled {
	opacity: 1;
 }


/* Days not bookable based on the availability rules */
.wc-bookings-date-picker .ui-datepicker td.not_bookable {
	background-color: #eee !important;
}

/* Today's date on calendar background color */ 
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker td.ui-datepicker-today a {
	background-color: transparent !important;
}

/* Time Blocks */
#wc-bookings-booking-form .block-picker li a {
	background-color: #FFFFFF !important;
	color: var(--color-primary) !important;
}

/* Time Blocks Hover */
#wc-bookings-booking-form .block-picker li a:hover {
	background: #000 !important;
	color: #fff !important;
}

#wc-bookings-booking-form .block-picker li a.selected {
    background: #ff00ff !important;
    color: #212121 !important;
}
    
#wc-bookings-booking-form .block-picker li a.selected:focus {
        outline-color: #00ffff !important;
}

/* Selected Date*/ 
#wc-bookings-booking-form .wc-bookings-date-picker .ui-datepicker td.ui-datepicker-current-day a {
	background-color: #000 !important;
	color: #fff !important;
} 

/* Selected Time Block */ 
#wc-bookings-booking-form .block-picker li a.selected { 
	background: var(--color-primary) !important;
	color: #fff !important;
}

  
/* Booking costs block  */
.wc-bookings-booking-form .wc-bookings-booking-cost {
        background: var(--color-primary);
        color: #fff;
}
  
/* Book now button */

.wc-bookings-booking-form-button.single_add_to_cart_button {
        background: var(--color-primary) !important;
        color: #fff;
}
  
.wc-bookings-booking-form-button.single_add_to_cart_button:hover {
        background: #000 !important;
        color: #fff;
}

.picker .ui-datepicker-title .ui-datepicker-year,
.picker .ui-datepicker-title .ui-datepicker-month {
	display: inline-block;
}

.picker .ui-datepicker-title .ui-datepicker-year {
	margin-left: 10px;
}

/** END WooCommerce Bookings datepicker calendar */