/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/

#main-buttons,
#main-buttons .wrapper {
  height: 300px !important;
  min-height: 300px !important;
}

#sb_main {
  background: url("https://book.themobilecarwash.club/blurred-bg-image.jpg") !important;
  background-size: cover !important;
  background-position: center !important;
  background-attachment: fixed !important;
}

section,
#sb-timeline,
#steps-nav,
.step_info_item,
.page-pd,
#sb-timeline #steps-nav #menu-active-bg,
#sb-main-container {
  background: none !important;
}

body {
  font-family: "Poppins", RobotoCondensed, sans-serif !important;
  background: #1d2426 !important;
}

body.hasModal:before {
  backdrop-filter: blur(8px);
}

.pwa-app--main {
  background: #1f2629 !important;
  color: white !important;
}

.pwa-app--install-page {
  font-family: "Poppins", RobotoCondensed, sans-serif !important;
}

.pwa-app--btn {
  background: #efb071 !important;
  color: #1f2629 !important;
}

.pwa-app--description {
  font-weight: 200;
}

.__default-svg-icon {
  display: none !important;
}

.item__connected-services.membership-service__list {
  display: none;
}

.start-date-btn {
  display: none !important;
}

.company-name {
  font-family: "Poppins", RobotoCondensed, sans-serif !important;
  font-weight: 500 !important;
  text-transform: capitalize !important;
  text-align: center !important;
  max-width: 100% !important;
  font-size: 0px !important;
  background: url("https://book.themobilecarwash.club/Full Logo.png") !important;
  background-position: center !important;
  background-size: contain !important;
  background-repeat: no-repeat !important;
}

@media only screen and (max-width: 600px) {
  .company-name {
    font-size: 0px !important;
    line-height: 50px !important;
  }
}

.bar {
  text-align: center !important;
  padding-top: 0px !important;
}

.btn.book {
  width: fit-content !important;
}

.alert-info {
  color: #e0e2ed !important;
}

.btn {
  border-radius: 300px !important;
}

.btn.select {
  border-color: #efb071 !important;
  border-width: 1px !important;
  background-color: #efb071 !important;
}

.btn.select:hover {
  border-width: 1px !important;
  border-color: #efb071 !important;
  background: none !important;
}

.btn.select a {
  color: #313d41 !important;
}

.btn.select a:hover {
  color: #efb071 !important;
}

.btn:first-of-type {
  animation-delay: 1s !important;
}

.title-main {
  font-weight: 300 !important;
}

.logged-out {
  border-radius: 300px !important;
  background-color: #e0e2ed !important;
  color: #ffffff !important;
}

.logged-in {
  border-radius: 300px !important;
  background-color: #e0e2ed !important;
  color: #ffffff !important;
}

.nav-trigger {
  background-color: #1d2426 !important;
  color: #efb071 !important;
}

.section {
  border-radius: 24px !important;
}

.location-item .tab,
.service-item .tab,
.category-item .tab {
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0) !important;
  overflow: hidden !important;
  position: relative !important;
  color: white !important;
  box-shadow: 3px 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.location-item .tab::before,
.service-item .tab::before,
.category-item .tab::before {
  content: "" !important;
  position: absolute !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0.2) !important;
  backdrop-filter: blur(24px) !important;
  box-shadow: inset 0px 1px 5px rgba(255, 255, 255, 0.2) !important;
}

.paid-attr__item {
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0) !important;
  position: relative !important;
  box-shadow: 3px 4px 12px rgba(0, 0, 0, 0.15) !important;
}

.paid-attr__item::before {
  content: "" !important;
  position: absolute !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0.2) !important;
  backdrop-filter: blur(24px) !important;
  box-shadow: inset 0px 1px 5px rgba(255, 255, 255, 0.2) !important;
  margin: -18px !important;
}

.provider-item .tab {
  padding: 10px !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0.2) !important;
  backdrop-filter: blur(40px) !important;
}

#sb_dateview_container {
  background: rgba(255, 255, 255, 0.2) !important;
  backdrop-filter: blur(40px) !important;
  box-shadow: 3px 4px 12px rgba(0, 0, 0, 0.15),
    inset 0px 1px 5px rgba(255, 255, 255, 0.2) !important;
}

.membership-item .tab {
  border-radius: 24px !important;
  background: #404647 !important;
}

.excerpt-info {
  background: none !important;
}

.promotion-item .tab.tab-col .excerpt-info .tab-pd .content .read-more,
#membership-view
  #sb_membership_list_container
  > div
  .membership-item
  .read-more {
  background-color: #404647 !important;
}

#membership-view
  #sb_membership_list_container
  > div
  .membership-item
  .read-more:before {
  background: linear-gradient(
    to right,
    rgba(49, 61, 65, 0),
    #404647 68%,
    #404647 100%
  ) !important;
}

.membership-filter--wrapper {
  display: none !important;
}

@media (max-width: 1024px) {
  #header .nav-wrapper {
    max-height: 92% !important;
    margin-top: 30px !important;
    border-radius: 16px !important;
    overflow: hidden !important;
    background: rgba(255, 255, 255, 0.2);
    backdrop-filter: blur(80px);
  }
}

.start-date-btn {
  border-radius: 8px !important;
  overflow: hidden !important;
}

/* .modal-backdrop {
  backdrop-filter: blur(40px) !important;
} */

.attributes-checkbox .product-label::before {
  border-radius: 4px !important;
}

#sb_booking_content .detail-step-wrap {
  background: rgba(255, 255, 255, 0.15) !important;
  backdrop-filter: blur(40px) !important;
  box-shadow: 3px 4px 12px rgba(0, 0, 0, 0.15),
    inset 0px 1px 5px rgba(255, 255, 255, 0.2) !important;
}

.pwa-app #sb_booking_content .detail-step-wrap {
  background: rgba(255, 255, 255, 0) !important;
  backdrop-filter: blur(0px) !important;
}

.modal-dialog #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 */
}

#start_date-block-container .zend_form dt,
start_date-block-container .zend_form dt b,
start_date-block-container .zend_form dd label {
  /* add your css rule here */
}

/* PWA APP STYLING */

.pwa__body {
  color: white !important;
}

.pwa-app .index__item-main-banner {
  padding-left: 30px !important;
  padding-right: 30px !important;
  background: url("https://book.themobilecarwash.club/Full Logo.png") !important;
  background-position: center !important;
  background-size: 80% auto !important;
  background-repeat: no-repeat !important;
}

.mdc-text-field,
.mdc-text-field__input {
  padding: 4px !important;
  border-radius: 8px !important;
  border-width: 0px;
  background: rgba(255, 255, 255, 1) !important;
}

.input-container--label-top .mdc-text-field {
  background: none !important;
  color: white !important;
}

.page-content--clients-reg .remind-pass {
  color: #dddddd !important;
}

.mdc-checkbox__background {
  border-color: #efb071 !important;
}

.pwa-app .mdc-button {
  color: white !important;
}

.modal .mdc-button {
  color: black !important;
}

.pwa-app .mdc-button--raised,
.pwa-app #sb_book_btn {
  background: #efb071 !important;
  color: black !important;
  border-radius: 999px !important;
}

.control-label a:-webkit-any-link {
  color: #efb071 !important;
}

.mdc-floating-label {
  color: #555555 !important;
  z-index: 100 !important;
}

.pwa-app__push-notifications .push-notifications--body {
  background: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(24px) !important;
}

.pwa-app i {
  color: white !important;
}

.dashboard__suggest-booking {
  margin: 10px !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(24px) !important;
}

.dashboard__suggest-booking .step-content--dashboard .item {
  background: rgba(255, 255, 255, 0.1) !important;
  backdrop-filter: blur(24px) !important;
}

.dashboard__suggest-booking .step-content--dashboard .item__subtitle {
  color: rgba(255, 255, 255, 0.7) !important;
}

.mdc-list {
  color: white !important;
}

.step-content .item__picture svg {
  color: rgba(255, 255, 255, 0.7) !important;
}

.mdc-drawer {
  background: rgba(255, 255, 255, 0.3) !important;
  backdrop-filter: blur(24px) !important;
  color: white !important;
}

.mdc-drawer .mdc-drawer__title,
.mdc-drawer .mdc-list-item {
  color: white !important;
}

.mdc-drawer .mdc-drawer__subtitle,
.mdc-drawer .mdc-list-group__subheader,
.mdc-drawer .mdc-list-item__graphic {
  color: rgba(255, 255, 255, 0.8) !important;
}

.pwa-app__sidebar .material-icons {
  filter: brightness(0) saturate(100%) invert(100%) sepia(7%) saturate(0%)
    hue-rotate(152deg) brightness(108%) contrast(109%) !important;
}

.client-profile__form-avatar {
  background-color: #efb071 !important;
}

.step-content .item .item-data--item .badge,
.step-content .item .info-bar--item .badge {
  color: #efb071 !important;
}

.pwa-app .paid-attribute-totals__duration,
.pwa-app .paid-attribute-totals__subtotal {
  background: rgba(255, 255, 255, 0.3) !important;
  backdrop-filter: blur(24px) !important;
  color: white !important;
}

.pwa-app .paid-attribute-totals__duration b,
.pwa-app .paid-attribute-totals__subtotal b {
  color: #efb071 !important;
}

#sb-timeline #steps #steps-content #sb_booking_content .paid-attribute-wrapper {
  background-color: rgba(255, 255, 255, 0.1) !important;
  /* backdrop-filter: blur(24px) !important; */
  border-radius: 0px !important;
  box-shadow: 0px 0px 20px rgba(0, 0, 0, 0.5);
}

.step-content .item .item-data .item-price,
.step-content .item .info-bar .item-price {
  color: #efb071 !important;
}

.top-date-select {
  background: none !important;
  box-shadow: none !important;
  margin: 0px !important;
}

.top-date-select__calendar .date.selected .mdc-button {
  background: #efb071 !important;
  color: black !important;
}

#sb_timeview_container {
  margin-top: 15px !important;
  border-radius: 24px !important;
  overflow: hidden !important;
}

#sb_time_slots_container .slot .sb-cell {
  background-color: #efb071 !important;
  border-radius: 6px !important;
}

/*
.detail-step__item.right-side {
    background: rgba(255,255,255,0.3) !important;
    backdrop-filter: blur(40px) !important;
    color: white !important;
    margin: 10px !important;
    border-radius: 24px !important;
}
*/

.modal {
  pointer-events: none !important;
  backdrop-filter: blur(24px) !important;
  /*
  display: flex !important;
  justify-content: center !important;
  align-items: center !important; */
}

.modal.in {
  pointer-events: all !important;
}

.modal-dialog .full-info {
  position: fixed;
  top: 40vh !important;
  transform: translateY(-50%);
  color: white !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0.2) !important;
  box-shadow: 3px 4px 12px rgba(0, 0, 0, 0.15),
    inset 0px 1px 5px rgba(255, 255, 255, 0.2) !important;
}

.modal-dialog .full-info .close-full-info,
.modal-dialog .full-info .content {
  background: none !important;
  color: white !important;
}

.modal-dialog .full-info i {
  display: inline-block !important;
  margin-top: 10px !important;
}

.product-item h3,
.product-item .item-price {
  z-index: 1 !important;
}

.membership-item .item__info-bar .info-container {
  color: #efb071 !important;
}

.detail-step__item.right-side {
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0) !important;
  position: relative !important;
  margin-left: 0px !important;
  margin-right: 0px !important;
}

.detail-step__item.right-side::before {
  content: "" !important;
  position: absolute !important;
  width: 100% !important;
  height: 100% !important;
  border-radius: 24px !important;
  background: rgba(255, 255, 255, 0.15) !important;
  backdrop-filter: blur(40px) !important;
  margin: -20px !important;
}

.custom-checkbox-label {
  color: white !important;
}

.page-invoice-pay .invoice-total-prices__list-item.total {
  color: white !important;
}