/* ----------------------------------------------------------------
FONTS
-----------------------------------------------------------------*/
body,
input,
.input {
    font-family: Helvetica, Arial, Helvetica, sans-serif;
}
h1, h2, h3, h4, h5, h6 {
    font-family: Helvetica, Arial, Helvetica, sans-serif;
}

/* ----------------------------------------------------------------
COLORS
-----------------------------------------------------------------*/
a,
header.bookingSiteHeader .logo a:hover,
header.bookingSiteHeader nav.mainMenu ul li a:hover,
nav.mobileMenu ul li a:hover,
section.bookingWidgetHeader nav.mainMenu ul li a:hover,
section.bookingSteps ul li .bookingStepWrapper.bookingStepWrapperLink:hover .bookingStepLabel,
.timezoneNotice p strong,
.timezoneNotice select.input,
.checkoutCountdown p span,
section.filtersMenu a.button:hover,
section.filtersMenu a.button.active,
nav.inventoryItemTabsNavigation ul li a:hover,
.inventoryItemInformation .inventoryItemPricing h5,
.card .cardContent .cardDescriptionPricingWrapper .cardPricing h5,
.card .cardContent .cardTicketPurchaseContainer .cardTicketFooterSubtotal h5,
.card .cardActions a:hover,
footer nav.footerMenu ul li a:hover,
.menu li a:hover {
    color: #dc06d5;
}
body,
input,
.input,
.button.rescheduleDate,
nav.mainMenu ul li a,
nav.mainMenu ul li .selectWrapper:after,
nav.mainMenu ul li select.input,
section.filtersMenu a.button,
section.filtersMenu .filtersMenuDateSelect a,
section.resovaCalendar table td.bookingSelectReveal a.bookingSelectRevealClose,
.card .cardContent .cardEventMetaGoBackContainer a.cardEventMetaGoBackButton,
.card .cardContent .cardTimesContainer .showMoreTimesContainer a.showMoreTimesButton,
.card .cardContent .cardTimesContainer .showMoreTimesContainer a.seeMoreDatesButton,
.inventoryItemInformation .inventoryItemSharing ul li a,
.card .cardContent .cardTimesContainer .cardTimeSlotWrapper .cardTimeSlot.cardTimeSlotUnavailable:hover,
.card .cardActions a,
.card .cardShare ul li a,
.infoRibbon:before,
.infoRibbon p,
.infoRibbon a,
.infoRibbon a.button.buttonRaised,
nav.inventoryItemTabsNavigation ul li a,
aside .bookingAsideWrapper .bookingAsideAddNewBooking .button,
aside .bookingAsideWrapper .basketBooking .basketBookingItem .basketBookingItemDetails ul.basketActions li a,
footer nav.footerMenu ul li a,
footer .footerLogo a,
.inputSpinnerWrapper .button.buttonRaised.inputSpinnerButton,
.articleBox .infoRibbon p,
.menu li a {
    color: #ffffff;
}
.intl-tel-input .country-list .country {
    color: #ffffff!important;
}
/*--DATEPICKER STYLES--*/
.mydp .btnclear,
.mydp .btndecrease,
.mydp .btnincrease,
.mydp .btnpicker,
.mydp .headerbtn,
.mydp .monthlabel,
.mydp .yearlabel,
.mydp .headermonthtxt,
.mydp .headermonthtxt button,
.mydp .headertodaybtn,
.mydp .headeryeartxt,
.mydp .yearchangebtn,
.mydp .weekdaytitle,
.mydp .daycell.disabled,
.mydp .caltable,
.mydp .daycell,
.mydp .monthcell,
.mydp .monthtable,
.mydp .weekdaytitle,
.mydp .yearcell,
.mydp .yeartable,
.mydp .highlight {
    color: #ffffff!important;
}
.checkbox label:after {
    border-color: #ffffff;
}
.inputSpinnerWrapper input.inputSpinnerInput:disabled {
  -webkit-text-fill-color: #ffffff;
}
/*--DATEPICKER STYLES--*/
h1, h2, h3, h4, h5, h6,
.bookingManagerMenu ul li a {
    color: #ffffff;
}
.textDanger,
.inputContainer.requiredInput label:after,
span.inputCaption.inputCaptionError {
  color: #ed344e!important;
}
.textSuccess {
    color: #52B266!important;
}

/* ----------------------------------------------------------------
BACKGROUND COLORS
-----------------------------------------------------------------*/
body,
.full-preloader,
.preloaderContainer,
figure.featuredImage,
section.bookingSteps ul li span.step,
section.bookingSteps ul li span.bookingStepLabel,
section.bookingSteps ul li span.step:after,
.card,
.card .cardContent .cardEventMetaGoBackContainer a.cardEventMetaGoBackButton,
.card .cardContent .cardTimesContainer .showMoreTimesContainer a.showMoreTimesButton,
.card .cardContent .cardTimesContainer .cardTimeSlotWrapper .cardTimeSlot.cardTimeSlotUnavailable:hover,
aside .bookingAsideWrapper .taxFeeBreakdown,
aside .bookingAsideWrapper .taxFeeBreakdown:before,
span.orTag,
.expressCheckoutOrLine span,
.dialogBackdrop .dialogWrapper .dialogContainer,
.bookingManagerMenu,
.menu {
    background-color: #062c3f;
}
.intl-tel-input .country-list {
    background-color: #062c3f!important;
}
/*--DATEPICKER STYLES--*/
.mydp .header,
.mydp .headerbtn,
.mydp .headerlabelbtn,
.mydp .yearchangebtn,
.mydp .headerbtncell,
.mydp .btnclear,
.mydp .btndecrease,
.mydp .btnincrease,
.mydp .btnpicker,
.mydp .headertodaybtn,
.mydp .selector thead,
.mydp .caltable,
.mydp .monthtable,
.mydp .yeartable,
.mydp .daycell.disabled {
    background: #062c3f!important;
}
/*--DATEPICKER STYLES--*/
section.resovaCalendar table td.activeTimeSlot:after {
  border-bottom-color: #062c3f;
}
/*--DATEPICKER STYLES--*/
.mydp .selector:after,
.mydp .selectorarrow:after {
  border-bottom-color: #062c3f!important;
}
/*--DATEPICKER STYLES--*/
.full-preloader .three-bounce > div,
section.bookingSteps ul li span.step.bookingStepActive:before,
section.bookingSteps ul li span.step.bookingStepComplete,
article .articleBox .articleBoxInner.articleBoxWSelect .checkboxContainer .checkbox label:after,
.giftVoucherPlaceholderBG {
    background: #dc06d5;
}
@media (max-width: 959px) {
    header.bookingSiteHeader,
    header.bookingSiteHeader.transparentHeader {
        background: #302a29;
    }
}

/* ----------------------------------------------------------------
BUTTON COLORS
-----------------------------------------------------------------*/
.buttonRaised,
.iconButtonRaised,
nav.mainMenu a.shoppingBasketButton span,
.inventoryItemDateBadge,
.card .cardContent .cardTimesContainer .cardTimeSlotWrapper .cardTimeSlot:hover,
.messageState i,
table.confirmationBookingsBreakdown td.confirmationBookingsBreakdownInformation i,
.bookingManagerMenu ul li a:hover,
.bookingManagerMenu ul li a.active,
.menu .menuContent .button.buttonBlock:hover {
    background: #dc06d5;
}
/*--DATEPICKER STYLES--*/
.mydp .selectedday,
.mydp .daycell.selectedday,
.mydp .selectedday,
.mydp .selectedmonth,
.mydp .selectedyear,
.mydp .tablesingleday:hover,
.mydp .tablesinglemonth:hover,
.mydp .tablesingleyear:hover,
.mydp .monthcell.selectedmonth:hover {
    background: #dc06d5!important;
}
/*--DATEPICKER STYLES--*/
@media (max-width: 959px) {
    section.resovaCalendarList table td .resovaCalendarListItemTime {
        background: #dc06d5;
    }
}
.button,
.button.buttonRaised,
.inventoryItemDateBadge,
.inventoryItemDateBadge h6,
.card .cardContent .cardTimesContainer .cardTimeSlotWrapper .cardTimeSlot:hover,
.messageState i,
table.confirmationBookingsBreakdown td.confirmationBookingsBreakdownInformation i,
.bookingManagerMenu ul li a:hover,
.bookingManagerMenu ul li a.active,
.menu .menuContent .button.buttonBlock:hover {
    color: #ffffff;
}
/*--DATEPICKER STYLES--*/
.mydp .selectedday,
.mydp .daycell.selectedday,
.mydp .selectedday,
.mydp .selectedmonth,
.mydp .selectedyear,
.mydp .tablesingleday:hover,
.mydp .tablesinglemonth:hover,
.mydp .tablesingleyear:hover,
.mydp .monthcell.selectedmonth:hover {
    color: #ffffff!important;
}
/*--DATEPICKER STYLES--*/
@media (max-width: 959px) {
    section.resovaCalendarList table td .resovaCalendarListItemTime h6,
    section.resovaCalendarList table td .resovaCalendarListItemTime span {
        color: #ffffff;
    }
}

/* ----------------------------------------------------------------
BORDERS
-----------------------------------------------------------------*/
section.bookingSteps ul li:before,
section.bookingSteps ul li span.step:before,
.menu li.menu-separator {
    background: #37ff14;
}
input,
.input,
section.bookingSteps ul li span.step,
section.filtersMenu a.button.filterSort,
section.filtersMenu .filtersMenuDateSelect a.button,
aside.basketDropdown .bookingAsideWrapper .basketBooking,
.timezoneNotice,
.checkoutCountdown,
.inventoryItemInformation .inventoryInformationSectionBreak,
.inventoryItemInformation .inventoryItemSharing ul li.inventoryItemInfoIcon,
.inventoryItemInformation .inventoryItemSharing ul li a,
.inventoryItemInformation .inventoryItemSharing ul li input,
.card,
.card .cardContent .cardDescriptionPricingWrapper .cardDescription,
.card .cardContent .cardCounterWrapper .cardPricing,
.card .cardContent .cardTimesContainer:before,
.card .cardContent .cardTicketPurchaseContainer:before,
.card .cardContent .cardTimesContainer .cardTimeSlotWrapper .cardTimeSlot,
.card .cardContent .cardTimesContainer .cardTimeSlotWrapper .cardTimeSlot.cardTimeSlotUnavailable:hover,
.card .cardContent .cardEventMetaGoBackContainer:before,
.card .cardContent .cardEventMetaGoBackContainer a.cardEventMetaGoBackButton,
.card .cardContent .cardTimesContainer .showMoreTimesContainer a.showMoreTimesButton,
.card .cardContent .cardTicketPurchaseContainer .cardTicketFooter,
.card .cardActions a,
.card .cardActions a:nth-of-type(2),
.card .cardShare,
.card .cardShare ul li,
.inventoryListItem,
.infoRibbon a.button.buttonRaised,
nav.inventoryItemTabsNavigation:after,
.eventSearchItem,
.eventSearchContainer .eventSearchNoResults,
article .waiverSignature .waiverSignatureBox,
article .articleBox,
article .articleBox .articleBoxInner .checkoutLoginRegisterBox,
aside .bookingAsideWrapper,
aside .bookingAsideWrapper .bookingAsideAddNewBooking,
aside .bookingAsideWrapper .bookingAsideHeading,
aside .bookingAsideWrapper .basketBookings,
aside .bookingAsideWrapper .basketBookings .basketBooking,
aside .bookingAsideWrapper .basketBooking .singleBookingTotal,
aside .bookingAsideWrapper .bookingAsideTransactionBreakdownWrapper table.transactionTotals,
aside .bookingAsideWrapper .bookingAsideTransactionMetaWrapper,
aside .bookingAsideWrapper .bookingAsidePromoWrapper,
aside .bookingAsideWrapper .basketBookings .basketBooking .basketBookingItem.basketBookingItemWExtra:before,
aside .bookingAsideWrapper .basketBookings .basketBooking .basketBookingItem.basketBookingItemExtra:before,
aside .bookingAsideWrapper .bookingAsidePasswordProtectWrapper,
aside .bookingAsideWrapper .payFullAmountWrapper,
aside .bookingAsideWrapper .taxFeeBreakdown,
.inventoryItemReviews .inventoryItemReview,
section.resovaCalendar table th,
section.resovaCalendar table td,
section.resovaCalendarList table td,
table td.bookingSelectReveal,
table.confirmationBookingsBreakdown td,
table.confirmationBookingsBreakdown tr.bookingWExtra td.confirmationBookingsBreakdownInformation:before,
.itemExtraListItemContainer,
.itemExtraListItem,
.loginRegisterBox,
.loginRegisterBox .socialLoginRegisterWrapper,
footer section.footerInner:before,
.checkbox label:before,
.inputSpinnerWrapper .button.buttonRaised.inputSpinnerButton,
.inputSpinnerWrapper input.inputSpinnerInput,
.dialogBackdrop .dialogWrapper .dialogContainer .dialogHeader,
.dialogBackdrop .dialogWrapper.bookingSupportModal .dialogContainer .dialogBody .supportModalItem,
.continueButtonSection,
.menu,
.menu li.seperator:after,
.expressCheckoutOrLine,
.stripeElement,
.bookingManagerMenu:after,
.bookingManagerMenu ul.bookingManagerMainMenu,
.bookingManagerMenu ul li a {
    border-color: #37ff14;
}
.inventoryItemInformation .inventoryInformationSectionBreak.inventoryPrivateOption {
    border-color: #062c3f;
}
.intl-tel-input .country-list {
border-color: #37ff14!important;
}
/*--DATEPICKER STYLES--*/
.mydp .selector,
.mydp .headertodaybtn,
.mydp .caltable,
.mydp .daycell,
.mydp .monthcell,
.mydp .monthtable,
.mydp .weekdaytitle,
.mydp .yearcell,
.mydp .yeartable {
    border-color: #37ff14!important;
}
/*--DATEPICKER STYLES--*/
/*--DATEPICKER STYLES--*/
.mydp .selector:before,
.mydp .selectorarrow:before,
.mydp .selectorarrow:before {
    border-bottom-color: #37ff14!important;
}
/*--DATEPICKER STYLES--*/
section.bookingSteps ul li span.step.bookingStepActive,
section.bookingSteps ul li span.step.bookingStepComplete,
nav.inventoryItemTabsNavigation ul li.active a {
    border-color: #dc06d5;
}
article .waiverSignature .waiverSignatureBox { background: #ffffff }

/* ----------------------------------------------------------------
BOOKING SITE MENU
-----------------------------------------------------------------*/
header.bookingSiteHeader .logo a h1,
header.bookingSiteHeader nav.mainMenu ul li a,
header.bookingSiteHeader nav.mainMenu ul li .selectWrapper:after,
header.bookingSiteHeader nav.mainMenu ul li select.input,
nav.mobileMenu ul li a,
aside.mobileMenuPopUp header.mobileMenuHeader h6 {
    color: #ffffff;
}
header.bookingSiteHeader nav.mainMenu a.shoppingBasketButton span {
    color: #ffffff;
}
header,aside.mobileMenuPopUp {
    background: #302a29;
}
header.bookingSiteHeader.transparentHeader {
    background: transparent;
}
@media (max-width: 959px) {
  header.bookingSiteHeader,
  header.bookingSiteHeader.transparentHeader {
    background: #302a29;
  }
}

/* ----------------------------------------------------------------
CALENDAR COLOURS
-----------------------------------------------------------------*/
.closedTimeSlot,
.button.closedTimeSlot {
    color: #ffffff;
    background: #ed344e;
}
.availableTimeSlot,
.button.availableTimeSlot {
    color: #ffffff;
    background: #52b266;
}
.partiallyBookedTimeSlot,
.button.partiallyBookedTimeSlot {
    color: #ffffff;
    background: #e2a603;
}
.blockedTimeSlot,
.button.blockedTimeSlot {
    color: #ffffff;
    background: #ed344e;
}
.soldOutimeSlot,
.button.soldOutimeSlot {
    color: #ffffff;
    background: #ed344e;
}
.callToBookTimeSlot,
.button.callToBookTimeSlot {
    color: #ffffff;
    background: #ed344e;
}

/* ----------------------------------------------------------------
CUSTOMER
-----------------------------------------------------------------*/

.availableLabel {
    display: none;
}

.cardTimeSlotLabelsContainer {
    color: transparent; /* Hides the original text */
    position: relative; /* Ensures the new text is positioned correctly */
}

.cardTimeSlotLabelsContainer::before {
    content: "Book Now!"; /* Replaces the original text */
    color: white; /* Changes the color of the new text to white */
    font-family: inherit; /* Ensures the same font is used */
    font-size: 18px; /* Sets the font size to 30px */
    position: absolute;
    top: 0;
    left: 0;
    width: 100%; /* Ensures the text covers the element */
    height: 100%; 
    display: flex;
    align-items: center; /* Centers the text vertically */
    justify-content: center; /* Centers the text horizontally */
    pointer-events: none; /* Ensures this doesn't affect any interactions */
}

.seeMoreDatesButton {
    display: none; /* Hides the element */
}

.cardTimeSlotsContainer {
    display: flex; /* Enables flexbox */
    flex-direction: column; /* Aligns children vertically */
    align-items: center; /* Centers children horizontally */
    text-align: center; /* Centers text inside the container */
}

.cardTimeSlotWrapper {
    justify-content: center; /* Centers child elements horizontally */
}

.cardTimeSlot {
    display: flex; /* Enables flexbox for card time slots */
    align-items: center; /* Centers content horizontally */
}

.cardTimeSlotLabelsContainer {
    display: flex; /* Enables flexbox for labels container */
    align-items: center; /* Centers content horizontally */
}

/* Increase specificity to ensure the styles are applied */
.bookingAsideContent .inputContainer.selectWrapper label::after {
    content: " "; /* New text to display */
    visibility: visible; /* Makes the pseudo-element visible */
    position: absolute; /* Positions the pseudo-element over the label */
    left: 0; /* Aligns to the left edge of the label */
    top: 0; /* Aligns to the top edge of the label */
    color: white !important; /* Ensures the text color is white, overriding other styles */
}

/* Ensure the parent elements do not have color with higher specificity */
.bookingAsideContent .inputContainer.selectWrapper label {
    visibility: hidden; /* Hides the text of the label */
    position: relative; /* Establishes a positioning context for pseudo-elements */
}

/* Hide the select element with class 'input' and formcontrolname 'instance_id' */
select.input[formcontrolname="instance_id"] {
    display: none;
}

/* Targeting the second <li> in .inventoryItemMetaList to hide "7:00pm" */
.inventoryItemMetaList li:nth-child(2) span {
    visibility: hidden; /* Hides the text but keeps the element's space */
}

/* Target the specific <strong> element that includes 'Time:' */
p[_ngcontent-c17] strong:last-child {
    display: none; /* Completely hides the element */
};
