/* Theme Name: Wildscape Retreat
Description: Wildscape Wordpress Theme
Author: We Are Digital
Author URI: www.wearedgtl.co.uk
Template: hello-elementor
Version: 1.0
Text Domain: hello-elementor-child
License: GNU General Public License v3 or later.
License URI: https://www.wearedgtl.co.uk
*/

/*
 * Branding colors
 */
:root {
    --brand-color-calendar-primary: #9BA073;       
    --brand-color-calendar-primary-hover: #3D5153;
    --brand-color-calendar-primary-selected: #DDAe48; 
}
/* Customised calendar colors */
/* Change the background of available dates */
.wc-bookings-date-picker .ui-datepicker td.bookable a {
    background-color: var(--brand-color-calendar-primary) !important;
    background-image: none !important; /* Removes the default gradient */
    border-color: var(--brand-color-calendar-primary) !important;
    color: #ffffff !important;
}

.wc-bookings-date-picker .ui-datepicker td.bookable a:hover {
    background-color: var(--brand-color-calendar-primary-hover) !important;
    border-color: var(--brand-color-calendar-primary-hover) !important;
}

.wc-bookings-booking-form-button.single_add_to_cart_button {
    background-color: var(--brand-color-calendar-primary) !important;
    margin: 0!important;
    color:#fff!important;
}
.wc-bookings-booking-form-button.single_add_to_cart_button:hover {
    background-color: var(--brand-color-calendar-primary-hover) !important;
    margin: 0!important;
    color:#fff000!important;
}

/* Customised Bookings Form layout */
.elementor-product-booking .cart {
    flex-direction: column;
}
.wc-bookings-booking-form {
    display:flex;
    flex-direction:column;
}
.wc-bookings-booking-form .wc-bookings-date-picker-booking {
    order:1; /* put the calendar first */
}
.wc-bookings-booking-form .wc_bookings_field_persons,
.wc-bookings-booking-form .wc_bookings_field_persons_251,
.wc-bookings-booking-form .wc_bookings_field_persons_252,
.wc-bookings-booking-form .wc_bookings_field_persons_276,
.wc-bookings-booking-form .wc_bookings_field_persons_277,
.wc-bookings-booking-form .wc_bookings_field_persons_318,
.wc-bookings-booking-form .wc_bookings_field_persons_319{
    order:2;
}
.custom-booking-fields #dog-wrapper{
    margin-bottom:20px;
    border-top:1px solid #ccc;
    padding-top:10px;
}
.custom-booking-fields #vehicle-wrapper {
    margin-bottom:20px;
    border-top:1px solid #ccc;
    padding-top:10px;
}

.product .summary .woocommerce-product-details__short-description {
    display:none;
}

/* Embedded product form styling */
/* Container for the Booking Elements */
.yoga-class-tabs {
    font-family: "carrotflower", Sans-serif;
}
.ws-embedded-booking-form .wc-bookings-booking-form {
    display: flex;
    flex-wrap: wrap;
    gap: 20px;
    align-items: flex-start;
    flex-direction:row;
    border:0;
    font-family: "carrotflower", Sans-serif;
	padding-left:0;
}
.wc-bookings-booking-cost.price{
	margin-left: 0;
  	margin-right: 0;
}
/* Location picker */
.ws-embedded-booking-form .wc_booking_field_class-location{
    flex: 1 1 100% !important;
    width:100%;
}
.ws-embedded-booking-form .wc_booking_field_class-location label{
    color:white;
    font-size:1.3rem;
}
.ws-embedded-booking-form .wc_booking_field_class-location #wc_bookings_field_resource {
    width:calc(50% - 10px);
}
    /* 1. Calendar (Left 50%) */
.ws-embedded-booking-form .wc-bookings-date-picker {
    flex: 1 1 calc(50% - 10px) !important;
    width:49%;
    margin: 0 !important;
    padding: 0 !important;
    border:0;
}
.ws-embedded-booking-form .wc-bookings-date-picker .wc-bookings-date-picker-timezone-block{
    color:white;
    font-size:1.6rem;
}

/* 2. Time Slots (Right 50%) */
.ws-embedded-booking-form .form-field {
    flex: 1 1 calc(50% - 10px);
    width:49%;
    margin: 0 !important;
}
.ws-embedded-booking-form .form-field .block-picker {
    color:white;
    font-size:1.6rem;
}

/* 3. Cost and Button (Full Width Below) */
.ws-embedded-booking-form .wc-bookings-booking-cost,
.ws-embedded-booking-form .single_add_to_cart_button {
    flex: 0 0 50%;
    width: 50%;
    margin-top: 20px;
}

/* --- Visual Styling --- */

/* Make the price stand out */
.ws-embedded-booking-form .wc-bookings-booking-cost {
    background: #f9f9f9;
    padding: 15px;
    border: 1px solid #eee;
    border-radius: 4px;
    text-align: center;
    font-size: 1.2em;
}

/* Button Styling to match your brand */
.ws-embedded-booking-form .single_add_to_cart_button {
    padding: 15px 30px !important;
    font-size: 1.1em !important;
    text-transform: uppercase;
    font-weight: bold;
}

/* Time Slot Buttons Styling */
.ws-embedded-booking-form .block-picker .block {
    background-color:white!important;
}
.ws-embedded-booking-form ul.block-picker li.block a {
    width: 100% !important;
    height: auto !important;
    padding: 10px !important;
    border-radius: 4px;
    background: #fff;
    border: 1px solid #ddd;
    display: flex;
    justify-content: center;
    align-items: center;
}

.ws-embedded-booking-form ul.block-picker li.block a.selected {
    background-color: #008a00 !important; /* Change to your brand color */
    color: white !important;
    border-color: #008a00 !important;
}

/* Responsive adjustment for Mobile */
@media (max-width: 768px) {
    .ws-embedded-booking-form .wc-bookings-date-picker,
    .ws-embedded-booking-form .form-field {
        flex: 0 0 100% !important;
    }
}

/* Booking legend for Yoga class styles */
.ws-form-embedded-legend {
    background-color: var(--brand-color-calendar-primary-selected);
    padding:20px;
    margin:0;
}
.ws-form-embedded-legend table {
    background-color: white;
}
.wc_booking_field_location.wc_bookings_field_resource {
    flex:1 1 100%;
}
.wc_booking_field_location.wc_bookings_field_resource  label{
    color:white;
}
.wc_booking_field_location.wc_bookings_field_resource  select{
    width:100%;
}
@media (min-width: 938px) {
    .wc_booking_field_location.wc_bookings_field_resource  select{
        width:50%;
    }
}

/* Anytime Booking Styling */
#atb_selection-data {
	color:white;
}
#atb_unit_selection {
	padding: 10px!important;
}
#atb_prev, #atb_next{
	background-color: var(--e-global-color-primary)!important;
}