@import url('./variables.css');
body.lightMode {
	background-color: #ffffff;
}
body.darkMode {
	background-color: var(--darkmode-primary-color);
	color: var(--darkmode-text-color) !important;
}
.darkMode .textWhite{
    color: var(--darkmode-text-color) !important;
}
.darkMode .bgBlack{
    background-color: var(--darkmode-primary-color) !important;
}
.darkMode .bgBlackTwo{
    background-color: var(--darkmode-secondary-color) !important;
}
.darkMode .darkFooterConent ul li a{
    color: var(--darkmode-text-color);
}
.darkMode .darkFooterConent h3::before {
    background: var(--darkmode-text-color);
}
.darkMode .darkheroBkgAnimated{
    background: url('../static/footerDarkMode.svg') repeat-x !important;
    width: auto;
    margin: 0;
    min-height: 420px;
    padding-top: 10%;
    box-sizing: border-box;
    position: relative;
    background-position: top center;
    background-size: cover !important;
}
.darkMode .aboutBgTwoDark{
    background: inherit !important;
}
.darkMode .sliderBoxDark::before{
background: var(--darkmode-secondary-color);
}
.darkMode .navigationLinkDark a{
    color: var(--darkmode-text-color) !important;
}
.darkMode .svgImg img {
    filter: invert(100%) sepia(8%) saturate(20%) hue-rotate(248deg) brightness(110%) contrast(93%);
}
.darkMode .menuToggle span {
    background: var(--darkmode-text-color);   
}
.darkMode .form-control {
    color: var(--darkmode-text-color) !important;
    background: transparent;
}
.darkMode select {
    color: var(--darkmode-text-color) !important;
    background-image: url('../Icons/selectArrowDark.svg') !important;
    background-repeat: no-repeat;
}
.darkMode .audioSectionDark{
    border-color: #ced4da !important;
}
.darkMode .toneDarkMode{
    background: transparent !important;
    color: var(--darkmode-text-color) !important;
    border-color: #ced4da !important;
}
.darkMode .toneDarkMode:hover{
    color: var(--darkmode-text-color) !important;
}
.darkMode .card {
    background-color: transparent;
}
.darkMode .tableSticky .table thead th {
    background-color: var(--darkmode-primary-color) !important;
    color: var(--darkmode-text-color) !important;
}
.darkMode .NewResponsiveTable table tbody tr {
    background-color: var(--darkmode-secondary-color);
    color: var(--darkmode-text-color);
}
.darkMode .modal-content {
    background-color: var(--darkmode-secondary-color);
}
.darkMode .modal-content .close {
    color: var(--darkmode-text-color) !important;
    text-shadow: inherit;
    opacity: .9;
}
.darkMode .react-tel-input .country-list {
    background-color: var(--darkmode-secondary-color);
}
.darkMode .react-tel-input .country-list .country:hover {
    background-color: var(--darkmode-primary-color);
}
.darkMode .react-tel-input .country-list .country.highlight {
    background-color: var(--darkmode-primary-color);
}
.darkMode .react-tel-input .country-list .country .dial-code {
    color: var(--darkmode-text-color);
}
.darkMode .react-tel-input .selected-flag .arrow {
    border-top: 4px solid var(--darkmode-text-color);
}
.darkMode .react-tel-input .flag-dropdown:hover .selected-flag, .darkMode .react-tel-input .flag-dropdown:focus .selected-flag {
    background-color: var(--darkmode-secondary-color);
}
.darkMode .geosuggest__suggests {
    background: var(--darkmode-secondary-color);
}
.darkMode .geosuggest__item:hover, .geosuggest__item:focus {
    background: var(--darkmode-primary-color);
}
.darkMode .geosuggest__suggests:after {
    background: url(../powered_by_google.png) center left 98% no-repeat var(--darkmode-secondary-color);
}
.darkMode .bookingNowForm .geosuggest__input {
    color: var(--darkmode-text-color);
}
.darkMode .gmnoprint div:first-child{
background-color: var(--darkmode-primary-color) !important;
}
.darkMode .gm-control-active>img{
    filter: invert(100%) sepia(8%) saturate(20%) hue-rotate(248deg) brightness(110%) contrast(93%);
}
.darkMode .SingleDatePickerInput {
    background-color: transparent;
}
.darkMode .DateInput{
    background-color: transparent;
}
.darkMode .DateInput_input{
    background-color: transparent;
}
.darkMode .DateInput_input {
    color: var(--darkmode-text-color) !important;
}
.darkMode .SingleDatePickerInput_clearDate_svg {
    fill: var(--darkmode-text-color);
}
.darkMode .CalendarMonth {
    background: var(--darkmode-primary-color);
}
.darkMode .CalendarDay__default {
    color: var(--darkmode-text-color);
    background: var(--darkmode-primary-color);
}
.darkMode .DayPicker__horizontal {
    background: var(--darkmode-primary-color);
}
.darkMode .SingleDatePicker_picker {
    background-color: var(--darkmode-primary-color);
}
.darkMode .CalendarMonthGrid {
    background: var(--darkmode-primary-color);
}
.darkMode .CalendarMonth_caption {
    color: var(--darkmode-text-color);
}
.darkMode .DayPicker_weekHeader {
    color: var(--darkmode-text-color);
}
.darkMode .DayPickerNavigation_button__default {
    background-color: var(--darkmode-secondary-color);
}
.darkMode .DayPickerNavigation_svg__horizontal {
    fill: var(--darkmode-text-color);
}
.darkMode .CalendarDay__default:hover {
    background: var(--darkmode-secondary-color);
}
.darkMode .ql-container {
    background: var(--darkmode-secondary-color) !important;
}
.darkMode .ql-editor p {
    color: var(--darkmode-text-color);
}
.darkMode .ql-snow .ql-fill, .darkMode .ql-snow .ql-stroke.ql-fill {
    fill: var(--darkmode-text-color);
}
.darkMode .ql-snow .ql-picker{
    color: var(--darkmode-text-color);
}
.darkMode .ql-snow .ql-stroke {
    stroke: var(--darkmode-text-color);
}
.darkMode .customRatioButton input[type=radio]:checked:before {
    background: url('../Icons/dotOnlyDark.svg');
}
.darkMode .customRatioButton input[type=checkbox], .darkMode .customRatioButton input[type=radio] {
    background: url('../Icons/circleOnlyDark.svg') no-repeat;
}
.darkMode select option {
    color: #000000 !important;
}
.darkMode .adminThemeHeader .dropdown-menu {
    background: var(--darkmode-secondary-color);
}
.darkMode .dropdown-item{
    color: var(--darkmode-text-color);
}
.darkMode .adminThemeHeader a{
    background: transparent !important;
    color: var(--darkmode-text-color);
}
.darkMode .adminThemeHeader a:hover, .darkMode .adminThemeHeader a:focus{
    color: var(--darkmode-text-color);
}
.darkMode .adminThemeHeader .dropdown-item:active {
    background-color: transparent !important;
    color: var(--darkmode-text-color);
}
.darkMode .themeIconDropDown .dropdown-menu {
    background: var(--darkmode-secondary-color);
}
.darkMode .mainMenu .navbar-nav .themeIconDropDown .dropdown-menu a:hover {
    background-color: transparent !important;
}
.darkMode .DayPickerNavigation_button__default:active {
    background: var(--darkmode-secondary-color);
}
.darkMode .whiteDropdown select option{
   color: var(--darkmode-text-color) !important;
}
.darkMode .customFlatpickr .flatpickr-input {
    background: var(--darkmode-primary-color);
    color: var(--darkmode-text-color);
    padding-top: 0;
}
.darkMode .flatpickr-weekdays{
    background: var(--darkmode-secondary-color);
    color: var(--darkmode-text-color);
}
.darkMode .flatpickr-months .flatpickr-month{
    background: var(--darkmode-secondary-color);
    color: var(--darkmode-text-color);
}
.darkMode span.flatpickr-weekday {
    background: var(--darkmode-secondary-color);
    color: var(--darkmode-text-color);
}
.darkMode .flatpickr-current-month .flatpickr-monthDropdown-months{
    background: var(--darkmode-secondary-color);
    background-image: inherit !important;
}
.darkMode .flatpickr-months .flatpickr-prev-month svg, .darkMode .flatpickr-months .flatpickr-next-month svg {
    fill: var(--darkmode-text-color);
}
.darkMode .dayContainer{
    background: var(--darkmode-primary-color);
}
.darkMode .flatpickr-day {
    color: var(--darkmode-text-color);
}
.darkMode .flatpickr-day.flatpickr-disabled, .darkMode .flatpickr-day.flatpickr-disabled:hover {
    color: #888;
}
.darkMode .flatpickr-time {
 background: var(--darkmode-secondary-color);

}
.darkMode .flatpickr-time input {
 color: var(--darkmode-text-color);
}
.darkMode .flatpickr-time .flatpickr-time-separator, .darkMode .flatpickr-time .flatpickr-am-pm {
    color: var(--darkmode-text-color);
}
.darkMode .flatpickr-time input:hover, .darkMode .flatpickr-time .flatpickr-am-pm:hover, .darkMode .flatpickr-time input:focus, .darkMode .flatpickr-time .flatpickr-am-pm:focus {
    background: var(--darkmode-secondary-color);
}
.darkMode .flatpickr-time .numInputWrapper span.arrowDown:after {
    border-top-color: var(--darkmode-text-color);
}
.darkMode .flatpickr-time .numInputWrapper span.arrowUp:after {
    border-bottom-color: var(--darkmode-text-color);
}
.darkMode .flatpickr-calendar.arrowTop:before {
    border-bottom-color: var(--darkmode-primary-color);
}
.darkMode .flatpickr-day.inRange, .darkMode .flatpickr-day.prevMonthDay.inRange, .darkMode .flatpickr-day.nextMonthDay.inRange, .darkMode .flatpickr-day.today.inRange, .darkMode .flatpickr-day.prevMonthDay.today.inRange, .darkMode .flatpickr-day.nextMonthDay.today.inRange, .darkMode .flatpickr-day:hover, .darkMode .flatpickr-day.prevMonthDay:hover, .darkMode .flatpickr-day.nextMonthDay:hover, .darkMode .flatpickr-day:focus, .darkMode .flatpickr-day.prevMonthDay:focus, .darkMode .flatpickr-day.nextMonthDay:focus {
    background: var(--darkmode-secondary-color);
}
.darkMode .flatpickr-months .flatpickr-prev-month:hover svg, .darkMode .flatpickr-months .flatpickr-next-month:hover svg {
    fill: var(--darkmode-text-color) !important;
}
.darkMode ::placeholder {
    color: #f6f6f699;
    opacity: 1; /* Firefox */
  }
  
.darkMode  :-ms-input-placeholder { /* Internet Explorer 10-11 */
   color: #f6f6f699;
  }
  
.darkMode  ::-ms-input-placeholder { /* Microsoft Edge */
   color: #f6f6f699;
  }
.darkMode .rc-pagination-item{
    background: transparent;
}  
.darkMode .rc-pagination-prev a:after {
   color: var(--darkmode-text-color);
}
.darkMode .rc-pagination-next a:after {
    color: var(--darkmode-text-color);
}
.darkMode .phoneColor input{
    background: var(--darkmode-primary-color) !important;
    border: 1px solid #ced4da !important;
}
.darkMode .table td, .darkMode .table th {
    color: var(--darkmode-text-color);
}
.darkMode .manualBookingSlider .swiper-button-next {
    filter: invert(100%) sepia(8%) saturate(20%) hue-rotate(248deg) brightness(110%) contrast(93%);
}
.darkMode .manualBookingSlider .swiper-button-prev {
    filter: invert(100%) sepia(8%) saturate(20%) hue-rotate(248deg) brightness(110%) contrast(93%);
}
.darkMode .carBgDark{
    position: relative;
}
.darkMode .carBgDark::after{
    content: '';
    position: absolute;
    top:0;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
    background: linear-gradient(90deg, #171d37 0%, #171d3784 100%);
}
.darkMode .form-control:disabled {
    background-color: #6d6f71 !important;
}
.darkMode .inputFormAddon .input-group-text {
    border: 1px solid #ced4da !important;
}
.darkMode .Loader__background{
    background-color: rgb(23 29 55 / 74%) !important;
}
.darkMode .react-tel-input .flag-dropdown.open .selected-flag {
    background: var(--darkmode-secondary-color);
}
.darkMode .sideMenu{
    background-color: var(--darkmode-secondary-color);
}
.darkMode .rc-pagination-item-active {
    background-color: var(--darkmode-primary-color) !important;
    border-color: var(--darkmode-primary-color) !important;
    font-weight: 700 !important;
}
.darkMode .rc-pagination-item:hover {
    border-color: var(--darkmode-primary-color) !important;
    background-color: var(--darkmode-primary-color) !important;
}
.darkMode a {
    color: var(--darkmode-link-color);
}
.darkMode a:hover, .darkMode a:focus  {
    color: var(--darkmode-link-color);
}
.darkMode .navbar a{
    color: var(--darkmode-text-color) !important;
}
.darkMode .aboutBgOneDark{
    background-image: url('../static/staticImageDark.svg') !important;
}
.darkMode::-webkit-scrollbar-thumb {
    background: var(--darkmode-link-color) !important;
    border-radius: 10px;
}
.darkMode .sideMenuScroll a:hover, .darkMode .sideMenuScroll a:focus{
background-color: #0c0623;
}
.darkMode .darkBtnHover:hover, .darkMode .darkBtnHover:focus{
    background-color: #0c0623;
}
.darkMode .closeBookingModalTabs .nav-tabs .nav-link.active{
    color: var(--darkmode-text-color);
    background: transparent;
}
.darkMode .closeBookingModalTabs .nav-tabs .nav-link.active::after {
    background-color: var(--darkmode-link-color);
}
.darkMode .cancelBtn{
    color: var(--darkmode-link-color) !important;
}
.darkMode .inputFormAddon .input-group-text{
    background-color: #0c0623 !important;
}
.darkMode .sideMenuScroll::-webkit-scrollbar-thumb {
    background: var(--darkmode-link-color) !important;
}
.darkMode .tableCss::-webkit-scrollbar-thumb {
    background: var(--darkmode-link-color) !important;
}
.darkMode .exportDark{
    filter: invert(58%) sepia(11%) saturate(2157%) hue-rotate(186deg) brightness(103%) contrast(102%);
}
.darkMode .hoverHideDark::after{
    border-color: var(--darkmode-text-color) transparent transparent transparent;
}
.darkMode .hoverHideDark{
    background: var(--darkmode-text-color) !important;
    color: var(--darkmode-secondary-color);
}
.darkMode button, .darkMode button:hover, .darkMode button:focus{
    background-color: var(--btn-text-color) !important;
    border-color: var(--btn-text-color) !important;
    color: var(--btn-primary-bg) !important;
   padding: 12px 20px;
}
.darkMode .btnPrimaryDark, .darkMode .btnPrimaryDark:hover, .darkMode .btnPrimaryDark:focus{
    background-color: var(--btn-text-color) !important;
    border-color: var(--btn-text-color) !important;
    color: var(--btn-primary-bg) !important;
}
.darkMode .btnPrimaryDarkMenu, .darkMode .btnPrimaryDarkMenu:hover, .darkMode .btnPrimaryDarkMenu:focus{
    background: transparent !important;
    color: var(--darkmode-text-color) !important;
}
.darkMode .modal-content button.close{
    background-color: transparent !important;
    padding: 16px;
}
.darkMode .btnPrimaryDeleteDark, .darkMode .btnPrimaryDeleteDark:hover, .darkMode .btnPrimaryDeleteDark:focus{
    background: transparent !important;
    color: var(--darkmode-link-color) !important;
    text-decoration: none !important;
}
.darkMode .ql-snow.ql-toolbar button{
    background: transparent !important;
    text-decoration: none !important;
}
.darkMode .ql-snow.ql-toolbar button:hover, .darkMode .ql-snow.ql-toolbar button:focus{
    background: transparent !important;
    color: var(--darkmode-link-color) !important;
    text-decoration: none !important;
}
.darkMode .pageUrlInput .input-group-text{
    background-color: var(--btn-text-color) !important;
    border-color: var(--btn-text-color) !important;
    color: var(--btn-primary-bg) !important;
}
.darkMode .flatpickr-current-month input.cur-year[disabled], .darkMode  .flatpickr-current-month input.cur-year[disabled]:hover{
color: var(--darkmode-text-color);
}
.darkMode .SingleDatePickerInput_clearDate, .darkMode .SingleDatePickerInput_clearDate:focus, .darkMode .SingleDatePickerInput_clearDate:hover{
    background-color: transparent !important;
    border-color: transparent !important;

}
.darkMode .boxShadowDark{
    box-shadow: 0 0px 16px -5px #749eff;
}
.darkMode .CalendarDay__blocked_out_of_range{
    color: #cacccdc2 !important;
}
.darkMode .form-control:focus {
    border-color: var(--darkmode-link-color) !important;
    background: transparent;
 }
.darkMode textarea.form-control:focus  {
    border-color: var(--darkmode-link-color) !important;
 }
 .darkMode select:focus{
    border-color: var(--darkmode-link-color) !important;
 } 
 .darkMode .react-tel-input .form-control{
    background-color: transparent;
 }
 .darkMode .bookingCollapse .Collapsible__trigger:after{
    filter: invert(99%) sepia(0%) saturate(0%) hue-rotate(61deg) brightness(115%) contrast(100%);
 }
 .darkMode .manageSearchLocation .form-control{
    background: transparent;
 }
 .darkMode .btnDarktransparent, .darkMode .btnDarktransparent:hover, .darkMode .btnDarktransparent:focus{
    background: transparent !important;
    color: var(--darkmode-text-color) !important;
 }
 .darkMode .mapSection .link, .darkMode .mapSection .link:hover {
    color: var(--common-text-color) !important;
    padding: 6px 12px;
}
.darkMode .bookingCollapse .Collapsible__trigger{
    border-top: 1px solid #dee2e6;
}
.darkMode .faqDarkMode{
    filter: invert(100%) sepia(1%) saturate(0%) hue-rotate(160deg) brightness(102%) contrast(101%);
}
.darkMode .popover {
	background: var(--darkmode-secondary-color) 0% 0% no-repeat padding-box !important;
    text-align: center !important;
}
.darkMode .bs-popover-top>.arrow::after {
    border-top-color: var(--darkmode-secondary-color) !important;
}
@media screen and (max-width:1200px){
.darkMode .textWhiteMob{
    color: var(--darkmode-text-color);
}
}