// Base colors. DO NOT IMPORT BASE-COLORS.LESS FILE HERE.
// If you want to add some new colors, add them directly to this file

@sb_active: @sb_base_color;
@border_slot_color: #e9e9e9;

@sb_active_font: contrast(@sb_active, @dark_font_color, @light_font_color);
@btn_color: if((iscolor(@btn_color_1)), @btn_color_1, @sb_base_color);

@formThemeColor: @sb_base_color;
@svg-base-color: fade(@formThemeColor, 99.9%);

//.product-item .preloader{
//  svg * {
//    fill: none;
//  }
//}
.product-item .paid-attr__picture svg,
.products-items-list .product-item .preloader svg{
  path[stroke] {stroke: @sb_base_color;}
  path[fill] {fill: @sb_base_color;}
  circle[stroke] {stroke: @sb_base_color;}
  circle[fill] {fill: @sb_base_color;}
}


.sb-cell {
  cursor: pointer;

  &.free {
    &.hovered,
    &:hover {
      background-color: @sb_active;
      color: @sb_active_font;
    }

    &.buffertime {
      background-image: url('/v2/images/admin/icons/pattern.png');
    }
  }

  &.breaktime,
  &.reserved,
  &.busy_time,
  &.busy {
    opacity: .4;
    cursor: not-allowed;
  }
}

.is-widget.line .min-content--line-widget #header.widget.line .nav-trigger,
#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper .flexible-weekly-inner .content-container #sb_time_flexible_weekly_container .data-col .time-container .time-slot.free.wl-slot{
  background: @sb_base_color;
  color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
  a{
    color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
  }

  &:hover{
    background: darken(@sb_base_color, 4%);
    color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
    a{
      color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
    }
  }
}

.pwa-app--btn,
.invoice-pay-page-grid form input[type='submit'],
.invoice-pay-page-grid form input[type='button'],
.invoice-pay-page .invoice-payment-systems .invoice-payment-systems-info.payment-modal .btn-primary,
.alert--no-slots-btn-bar .btn{
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);

  &:hover{
    background: darken(@btn_color, 4%);
    color: contrast(@btn_color, @dark_font_color, @light_font_color);
  }
}

#header .nav-wrapper .items-wrapper .nav-item#book-btn .book-btn-container .item-container {
  background-color: @sb_base_color;
}

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .slots-view.as-table .timeline-wrapper #sb_time_slots_container .slot {
  border-right: 1px solid fade(@sb_base_color, 70%);
  border-bottom: 1px solid fade(@sb_base_color, 70%);

  &:nth-of-type(5n) {
    border-right: none;
  }

  @media (max-width: 767px) {
    &:nth-of-type(3n) {
      border-right: none;
    }

    &:nth-of-type(5n) {
      border-right: 1px solid fade(@sb_base_color, 70%);
    }
  }
  @media (max-width: 575px) {
    border-right: none;
    &:nth-of-type(2n - 1) {
      border-right: 1px solid fade(@sb_base_color, 70%);
    }
  }

  a {
    background-color: @sb_base_color;
    color: @light_font_color;

    &:hover, &:focus {
      background-color: @sb_base_color !important;
    }
  }
}

.back-to-services {
  color: @dark_font_color;

  &:hover,
  &:focus {
    color: @dark_font_color;
  }
}

.classes-modal .tab .plugin-group-booking .ui-slider {
  background: @sb_base_color;
}

#header .nav-wrapper #sb_menu .nav #sb_appended_menu_item ul li.active a {
  color: @sb_base_color;
}

#header .nav-wrapper .items-wrapper .nav-item#sb_client_info .login-container .full-info #sb_login_form .not-logged .bar .btn-bar--row{
  .btn--sign-up{
    border: 2px solid @btn_color;
    color: @btn_color;
    background-color: #fff !important;

    &:hover {
      background-color: #fff !important;
      border: 2px solid darken(@btn_color, 10%);
      color: darken(@btn_color, 10%);
    }
  }
}


.btn--next-available-date{
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}
.btn--next-available-date:active,
.btn--next-available-date:focus,
.btn--next-available-date:hover{
  background: darken(@btn_color, 4%);
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}


#sb_terms_and_conditions a {
  color: @sb_base_color;
}

.remind-pass {
  color: @sb_base_color;
}

#news-index .news-list .article .bar .read-more a {
  color: @sb_base_color;
}

.page--line-liff .btn-bar .btn,
#reviews-view .add-review .form .send-btn-container button {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

.time-legend .unavailable .circle {
  opacity: .4;
}

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper .grid-weekly-inner table .btn {
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper .grid-weekly-inner table td .data-trigger {
  color: @sb_base_color;
}

.invoice-pay-page .promo-code-input .custom-form .promo-btn {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

.service-bar__icon .icon.icon-reccuring .fa {
  color: @dark_font_color;
}

.datepicker-button .btn-link {
  color: @sb_base_color;
}

.plugin-group-booking .ui-slider,
#membership-plugin .btn-with-icon,
#membership-plugin .mb.btn-bar .active-container .wrapper,
.plugin-group-booking .ui-slider {
  background: @btn_color;
}

#membership-view .sb_changed_filter_item {
  background-color: @sb_base_color;
  color: @light_font_color;
}

#membership-plugin .btn-with-icon a.wrapper,
#membership-plugin .mb.btn-bar .active-container .wrapper,
#membership-view .mb.btn-bar a.wrapper {
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

#membership-plugin .see-more a {
  color: #ffffff;
}

#membership-view .mb.btn-bar .active-container a.wrapper,
#membership-view .mb.btn-bar .info-container a.wrapper {
  background: @btn_color;
}

.custom-checkbox input:checked + .custom-label {
  border-color: @sb_base_color;
  background-color: @sb_base_color;
}

#sb_booking_content .tab .btn.select,
#sb_time_classes_service_container .btn.select,
.package-content .btn.select {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);

  a {
    color: contrast(@btn_color, @dark_font_color, @light_font_color);
  }
}

.item .read-more,
.membership-item .read-more {
  color: @sb_base_color;
}


#membership-view #sb_membership_list_container .membership-item .purchased,
.modal-dialog .modal-content .modal-header {
  background-color: @sb_base_color;
  color: contrast(@sb_base_color, @dark_font_color, @light_font_color);

  a {
    color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
  }
}

.custom-radio input:checked + label {
  border: 2px solid @sb_base_color;
}

.custom-radio input:checked + label:before {
  background-color: @sb_base_color;
}

.license-modal a {
  color: @sb_base_color;
}

.sb-widget-form .buttons .send-message-button {
  background: @sb_base_color;
}

#remind-password .bar #sb_remind_btn {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

#footer .cookies .wrapper {
  .text {
    color: @sb_text_color;
  }

  .btn {
    background-color: @btn_color;
  }

  a {
    color: @sb_base_color;

    &.link {
      color: @sb_cancellation_color;
    }
  }
}

#footer a {
  color: @sb_base_color;
}

.empty-week-time-part {
  .btn-next-week {
    background: @btn_color;
    color: contrast(@btn_color, @dark_font_color, @light_font_color);
  }
}

// Pagination
.pagination-wrapper a,
.pagination-wrapper span {
  color: @dark_font_color;

  &:hover {
    background-color: @sb_base_color;
    color: @light_font_color;
  }

  &.current {
    background-color: @sb_base_color;
    color: @light_font_color;
  }
}

#sb_gdpr_report_module_container #sb_gdpr_email_form .content .form-container .btn {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

#sb_gdpr_send_email_container .btn-send-code,
#sb_gdpr_send_code_container .btn-get-report {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

.tab.tab-col.get-gdpr-info-modal .full-info .close-full-info {
  background: @sb_base_color;
  color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
}

#footer #sb_scroll_top_btn {
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);

  &:hover {
    background-color: fade(@btn_color, 70%);
  }
}

.error-card .redirect-block .block .btn {
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);

  &:hover {
    background-color: darken(@btn_color, 10%);
  }
}

.invoice-pay-page .custom-title {
  background-color: @sb_base_color;
  color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
}

.invoice-payment-systems #sb_pay_btn {
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

.invoice-deposit-info .btn {
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

.invoice-pay-page .invoice-btn-bar .btn {
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

.invoice-pay-page .promo-code-input .custom-form .btn {
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

.invoice-pay-page #sb_invoice_pager_container .pagination-wrapper .arrow,
.invoice-pay-page #sb_invoice_pager_container .pagination-wrapper a {
  &:hover {
    background-color: @sb_base_color;
    color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
  }

  &.current {
    background-color: @sb_base_color;
    color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
  }
}

.invoice-pay-page .to-invoices-list:hover {
  color: @sb_base_color;
}

.invoice-pay-page .accordion .accordion-header .title {
  color: @dark_font_color;
}

.pdf-invoice .invoice-top {
  border-bottom: 2px solid @sb_base_color;
}

.pdf-invoice .invoice-top .name {
  color: @sb_base_color;
}

.pdf-invoice .general-table thead {
  background: @sb_base_color !important;
  color: contrast(@sb_base_color, @dark_font_color, @light_font_color) !important;
}

.pdf-invoice .general-table .table thead > tr > th {
  border: 1px solid @sb_base_color;
}

.btn-invoice {
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);

  &:hover,
  &:focus,
  &:active,
  &:visited {
    color: contrast(@btn_color, @dark_font_color, @light_font_color);
  }
}

.invoice-table a {
  color: @sb_base_color;
}

.accordion a {
  color: @sb_base_color;
}

.current-booking-info .info a {
  color: @sb_base_color;
}

.wrap-client-info-view .back-button {
  color: @dark_font_color;
}

.wrap-client-info-view .client-info-view .btn-bar .btn {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
  border-color: @btn_color;
}

.btn.start-date-btn,
.start-date-btn {
  a,
  .sb_start_date {
    color: @sb_base_color;
  }
}

#reviews-view .add-review .info .name {
  color: @sb_base_color;
}

#sb-timeline #steps #steps-content #sb_booking_content .location-item .address a {
  color: @sb_base_color;
}

.sb-widget-form .buttons .open-booking-widget-button {
  color: @sb_base_color;
}

.btn-classes {
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);

  &:hover,
  &:focus,
  &:active,
  &:visited {
    text-decoration: none;
    color: contrast(@btn_color, @dark_font_color, @light_font_color);
  }
}

@media print {
  .pdf-invoice .general-table thead th {
    background: @sb_base_color !important;
    color: contrast(@sb_base_color, @dark_font_color, @light_font_color) !important;
  }
}

/* Grid weekly timeline */
#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper .grid-weekly-inner .top-inline-steps .parts-of-day .btn,
#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper .grid-weekly-inner .top-inline-steps .days-of-week .btn {
  background: transparent;
  color: contrast(@light_font_color, @dark_font_color, @light_font_color);
  border-color: @border_slot_color !important;
}

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper .grid-weekly-inner .top-inline-steps .parts-of-day .btn.active,
#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper .grid-weekly-inner .top-inline-steps .days-of-week .btn.active {
  background: @sb_base_color;
  color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
}

#sb_timeview_container .timeline-wrapper .grid-weekly-header .grid-weekly-header-item {
  background-color: @sb_base_color;
  color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
}

.grid-weekly-item .data-trigger {
  color: @sb_base_color;
}

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper .grid-weekly-table .grid-weekly-body .grid-weekly-row .grid-weekly-item.grid-weekly-button .btn {
  background: @sb_base_color;
  color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
}

.invoice-pay-page #sb_invoice_pager_container .pagination-wrapper a {
  color: @sb_base_color;
}

//#sb_simplybook_terms_link:hover {
//  border-bottom-color: @sb_base_color;
//}

.membership-item.panel .btn-bar .btn.price-formatter,
.item.panel .btn-bar .btn {
  background: @btn_color;
  color: contrast(@btn_color, @light_font_color, @dark_font_color);
}

.content-mode-list .title,
.content-mode-list .title a,
item.panel .title,
.item.panel .title a {
  color: @dark_font_color;
}

.bar-flex-item.price:not(.service-deposit) .txt {
  color: @sb_base_color;
}

.panel .plugin-group-booking .active-count .plus,
.panel .plugin-group-booking .active-count .minus {
  color: @dark_font_color;

  &:hover {
    background: @sb_base_color;
    color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
  }
}

.panel > .wrap-collapse-content .collapse-content .btn-bar-full-info .btn-hide,
.panel > .wrap-collapse-content .collapse-content .btn-bar-full-info .btn-hide span,
.panel .btn-bar .wrap-read-more .read-more .part,
#sb-timeline #steps #steps-content #sb_booking_content .location-item.panel .address a {
  color: #337ab7;

  &:hover, &:active, &:focus {
    color: #23527c;
  }
}

.payment-modal .payment-system-container .payment-system, .payment-modal #sb_payment_systems_container .payment-system {
  &:hover,
  &.active {
    border-color: @sb_base_color;
  }
}

#membership-plugin #sb_membership_module_list_container.content-mode-list .membership-item .one-line > .btn-bar .btn.sb_cancel_recurring, #membership-view #sb_membership_list_container.content-mode-list .membership-item .one-line > .btn-bar .btn.sb_cancel_recurring {
  background: #F44336;
  color: #fff;
}

.phone b,
.phone .txt-wrap,
#content-view #contacts li .phone,
.phone-number {
  direction: ltr !important;
}

.confirm-details {
  .btn {
    color: contrast(@btn_color, @light_font_color, @dark_font_color);
  }
}

@formThemeColor: @dark_font_color;
@svg-group-booking: fade(@formThemeColor, 99.9%);

@svgContrastColor: contrast(@sb_base_color, @dark_font_color, @light_font_color);
@svg-contrast-color: fade(@svgContrastColor, 99.9%);

body {
  background: @body_bg_color;
  color: @dark_font_color;
}

html {
  &::-webkit-scrollbar {
    _background-color: @body_bg_color;
  }
}

.modal-backdrop, body.hasModal:before {
  background-color: fade(@dark_font_color, 45%);
  background: fade(@dark_font_color, 45%);
}

// Buttons
#main #main-buttons .wrapper .inner .bar {
  .btn {
    &.book {
      background: @btn_color;
      color: contrast(@btn_color, @light_font_color, @dark_font_color);

      a {
        color: contrast(@btn_color, @light_font_color, @dark_font_color);
      }
    }
  }
}

.is-widget {
  .btn {
    &.book {
      background: @btn_color;
      color: contrast(@btn_color, @light_font_color, @dark_font_color);
    }
  }
}

#sb_booking_content .tab .btn.select {
  background: @btn_color;
  color: contrast(@btn_color, @light_font_color, @dark_font_color);

  a {
    color: contrast(@btn_color, @light_font_color, @dark_font_color);
  }
}

#sb-main-container #main #client-login .custom-form .sign_button_wrap .btn {
  background: @btn_color;
  color: contrast(@btn_color, @light_font_color, @dark_font_color);

  a {
    color: contrast(@btn_color, @light_font_color, @dark_font_color);
  }
}

#main .btn-danger {
  background: @sb_cancellation_color;
}

#main #steps #steps-content #sb_booking_content .detail-step .right-side #sb_multiple_booking_btn {
  color: @btn_color;
}

#main #sb-timeline #steps #steps-content #sb_booking_content .detail-step .right-side #sb_book_btn {
  color: contrast(@btn_color, @light_font_color, @dark_font_color);
}

#sb_main {
  #sb-main-container {
    .return-btn, #sb_back_button {
      a {
        color: @sb_base_color;

        &:hover {
          color: @sb_base_color;
        }
      }

      .txt {
        color: @sb_base_color;
      }
    }
  }
}

#sb_main .invoice-deposit-info .btn {
  color: contrast(@btn_color, @light_font_color, @dark_font_color);
}

.error-card .redirect-block .block .btn {
  color: contrast(@btn_color, @light_font_color, @dark_font_color);

  &:hover {
    background: @sb_base_color;
  }
}

.invoice-buttons-container {
  > div {
    .btn, .btn .txt {
      color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
    }
  }
}

.timezone-modal.modal-dialog .modal-content .modal-footer .btn {
  background: @btn_color;
  color: contrast(@btn_color, @light_font_color, @dark_font_color);

  a {
    color: contrast(@btn_color, @light_font_color, @dark_font_color);
  }
}

.empty-week-time-part .btn-next-week {
  .txt {
    color: contrast(@btn_color, @light_font_color, @dark_font_color);
  }
}

.back-to-site {
  .btn-primary {
    background: @btn_color;
    color: contrast(@btn_color, @light_font_color, @dark_font_color);
  }
}

.btn.show-all {
  background: @btn_color;
  color: contrast(@btn_color, @light_font_color, @dark_font_color);
}

#sb_confirm_license {
  background: @btn_color;
  color: contrast(@btn_color, @light_font_color, @dark_font_color);
}

.paym-container {
  .btn-primary {
    background: @btn_color;
    color: contrast(@btn_color, @light_font_color, @dark_font_color);
  }
}


// Company name
.company-name {
  color: @sb_company_label_color;
}

// Titles
.title-main, .title-section {
  color: @sb_base_color;
}

.txt {
  color: @sb_text_color;
}

// Links
a {
  color: @sb_base_color;

  &:hover {
    color: @sb_base_color;
  }
}

// Social icons
#sb_main #sb-main-container {
  .brand {
    a {
      &:after {
        background: @sb_base_color !important;
        color: contrast(@sb_base_color, @light_font_color, @dark_font_color) !important;
      }
    }
  }
}

.telegram-notifications--card,
.alert-info, .alert-warning, .alert-success {
  background: fade(@sb_base_color, 30%);
  color: @dark_font_color;
  border-color: @sb_base_color;
}

.alert-danger {
  background: fade(@sb_cancellation_color, 30%);
  color: @dark_font_color;
  border-color: @sb_cancellation_color;
}

// Available slot
#main {
  .sb-cell.free {
    &:hover {
      background: @sb_base_color;
      color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
    }
  }
}

// Homepage changes
#schedule {
  .overview {
    tr {
      .day, .time {
        color: @sb_text_color;

        &.day-off {
          color: @sb_cancellation_color;
        }
      }
    }
  }
}

#contacts {
  .info {
    ul {
      li {
        .links {
          color: @sb_text_color;
        }
      }
    }
  }
}

#header #sb_menu {
  background: @body_bg_color;

  li {
    a {
      color: @dark_font_color;
    }

    &.active {
      background: fade(@sb_base_color, 10%);

      a {
        color: @sb_base_color;
      }
    }

    &:hover {
      a {
        color: @sb_base_color;
        background: fade(@sb_base_color, 10%);
      }
    }

    a:focus {
      color: @sb_base_color;
      background: fade(@sb_base_color, 10%);
    }
  }
}

#header .nav-wrapper {
  .items-wrapper {
    #sb_cart .cart-container .cart {
      background: rgba(@sb_base_color, 0.1) !important;

      .counter {
        background: @dark_font_color;
        color: contrast(@dark_font_color, @light_font_color, @dark_font_color);
      }
    }

    .login-container {
      .avatar {
        background: rgba(@sb_base_color, 0.1) !important;
      }
      .full-info {
        #sb_login_form {
          .not-logged {
            .bar {
              .txt {
                .btn {
                  background: @btn_color !important;
                }
              }
            }
          }

          .is-logged {
            .cap {
              b {
                color: @sb_base_color;
              }
            }

            .bar-with-btn {
              .sb-client-info-popup {
                background: @btn_color;
              }

              #sb_sign_out_btn {
                color: @sb_cancellation_color;
              }
            }
          }
        }
      }
    }

    .item-container {
      background: @secondary_color;
    }

    .nav-trigger {
      background: @sb_base_color;

      &.opened {
        span {
          background: @sb_base_color;
        }
      }

      span {
        background: contrast(@sb_base_color, @light_font_color, @dark_font_color);

        &:before, &:after {
          background: contrast(@sb_base_color, @light_font_color, @dark_font_color);
        }
      }
    }
  }
}


// Item (Services)

#sb-timeline {

  // Reschedule layout
  .reschedule-layout {
    .reschedule--row {
      .reschedule--selected-list {
        .sb-details {
          .reschedule--selected-item {
            .reschedule--selected-title, .reschedule--selected-name {
              .txt {
                color: @dark_font_color;
              }
            }
          }
        }
      }
    }
  }

  #steps {

    // Timezone settings
    #time-settings {
      #sb_booking_company_time {
        .btn {
          background: @btn_color;
        }
      }
    }

    #steps-content {
      .step-content {
        .item {
          &.panel {
            border-color: @sb_base_color !important;

            .preloader {
              background: @secondary_color;
            }

            .info-bar {
              .ico {
                color: @sb_text_color;
              }

              a {
                color: @sb_base_color;

                .txt {
                  color: @sb_base_color;
                }
              }

              .price {
                color: @dark_font_color;

                .txt {
                  color: @dark_font_color;
                }
              }
            }

            .read-more, .btn-hide {
              color: @sb_base_color;

              span {
                color: @sb_base_color;
              }
            }

            @media (max-width: 480px) {
              .read-more {
                border-color: fade(@sb_base_color, 30%) !important;
              }
            }

            > .wrap-collapse-content {
              .collapse-content {
                color: @sb_text_color;
              }
            }
          }

          .tab {
            border-color: @sb_base_color !important;

            .provider-link, .preloader {
              background: @secondary_color;
            }

            .cap {
              color: @dark_font_color;
            }

            .txt {
              color: @sb_text_color;
            }

            .badge {
              color: @dark_font_color;
            }

            .service-bar__text, .service-bar__text a {
              color: @dark_font_color;
            }

            .service-bar__text a:hover {
              color: @sb_base_color;
            }
          }
        }
      }

      .datetime-step {
        #sb_dateview_container {
          .top-date-select {
            .header {
              .row > div[class*="col"] {
                .txt-right, .txt-left {
                  .fa {
                    color: @dark_font_color;
                  }
                }
              }
            }

            .calendar {
              .inner.selected {
                background: @sb_base_color !important;
              }

              .weeks-date {
                .date.selected {
                  background: @sb_base_color !important;
                  color: contrast(@sb_base_color, @light_font_color, @dark_font_color);

                  .day-off {
                    color: contrast(@sb_base_color, @light_font_color, @dark_font_color) !important;
                  }

                  a {
                    color: contrast(@sb_base_color, @light_font_color, @dark_font_color) !important;
                  }
                }
              }

              .weeks-name {
                .col-md-4 {
                  .name {
                    &.is-holiday {
                      color: @sb_cancellation_color !important;
                    }
                  }
                }
              }
            }
          }
        }
      }


      #sb_timeview_container {

        // Modern timeline as table view
        .as-table {
          .timeline-wrapper {
            #sb_time_slots_container {
              .slot {
                a {
                  background: @secondary_color !important;
                  color: @dark_font_color !important;

                  &:hover, &:focus {
                    color: contrast(@sb_base_color, @light_font_color, @dark_font_color) !important;
                  }
                }
              }
            }
          }
        }


        .timeline-wrapper {

          .container-caption {
            color: @sb_base_color;
          }

          // Slots weekly
          #sb_time_slots_weekly_container {
            .data-col {
              .day-container {
                &.is-holiday {
                  .date, .day {
                    color: @sb_cancellation_color;
                  }
                }

                .date, .day {
                  color: @dark_font_color;
                }

                .border {
                  background: @secondary_color;
                }
              }

              .time-container {
                .time-slot {
                  .cell {
                    &.free {
                      color: @dark_font_color;

                      &:hover {
                        background: @sb_base_color !important;
                        color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
                      }
                    }
                  }
                }
              }
            }
          }

          // Modern
          #sb_time_slots_container .slot a {
            color: @dark_font_color;

            &:hover {
              color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
            }
          }

          // Flexible
          #sb_time_flexible_container {
            .hour-line {
              .hour-head {
                color: @sb_text_color;
              }
            }

            .sb_time_flexible_hour_container {
              .time-slot {

                .cell {
                  color: @dark_font_color;

                  &.hovered, &:hover {
                    background: @sb_base_color;
                    color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
                  }
                }
              }
            }
          }

          // Modern Provider
          #sb-time-classes-container {
            &.classes-plugin {
              .provider-container {
                .provider-col {
                  .provider-item {
                    .cell {
                      background: @secondary_color;
                      border-color: fade(@dark_font_color, 15%) !important;
                      color: @dark_font_color;

                      &:hover {
                        background: @sb_base_color;
                        color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
                      }
                    }

                    .full-info {
                      .close-full-info {
                        background: @sb_cancellation_color !important;
                      }

                      .badge {
                        color: @dark_font_color;
                      }
                    }
                  }
                }
              }
            }

            .inner {
              .hour-container .hour-row {
                .time {
                  color: @sb_text_color;
                }
              }

              .provider-container {
                .provider-col {
                  .provider-item {
                    .sb-cell {
                      border-color: @dark_font_color;
                    }
                  }
                }
              }
            }
          }

          // Weekly classes
          .grid-weekly-inner {
            .top-inline-steps {
              > .row > div[class*="col"] {
                .parts-of-day, .days-of-week {
                  .btn {
                    &.active {
                      color: contrast(@btn_color, @light_font_color, @dark_font_color);
                    }
                  }
                }
              }
            }

            #sb_time_grid_weekly_container {
              .grid-weekly-table {
                .grid-weekly-header {
                  .grid-weekly-header-item {
                    color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
                  }
                }

                .grid-weekly-body {
                  .grid-weekly-row:nth-child(odd) .grid-weekly-item {
                    background: fade(@sb_base_color, 10%);
                  }

                  .grid-weekly-available-slots {
                    .slot--available-slot {
                      color: @dark_font_color;
                    }
                  }

                  .grid-weekly-serice {
                    .tab-pd {
                      .badge {
                        color: @dark_font_color;
                      }
                    }
                  }

                  @media (max-width: 767px) {
                    .grid-weekly-row {
                      border-color: fade(@sb_base_color, 20%);
                    }
                  }
                }
              }
            }
          }

          // Flexible Provider
          #sb-flexible-provider {
            .inner {
              .inner-sidebar {
                .hour-line {
                  .hour-head {
                    color: @sb_text_color;
                  }
                }
              }
            }

            #sb_time_flexible_provider_container .provider-col .provider-item .time-slot .time-cell:not(.breaktime) {
              color: @dark_font_color;

              &.hovered {
                color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
                &:before {
                  background: @sb_base_color;
                }
              }

              &:hover {
                color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
                &:before {
                  background: @sb_base_color;
                }
              }
            }
          }

          // Flexible weekly
          .flexible-weekly-inner {
            .hour-container {
              .time {
                color: @sb_text_color;
              }
            }


            #sb_time_flexible_weekly_container {
              .day-container {
                .date, .day {
                  color: @dark_font_color !important;
                  &.is-holiday {
                    color: @sb_cancellation_color !important;
                  }
                }

                .date {
                  &.is-holiday {
                    color: @sb_cancellation_color;
                  }
                }
              }

              .time-container {
                .time-slot {
                  border-color: @dark_font_color;

                  &.hovered {
                    background: @sb_base_color;
                  }
                }
              }
            }
          }
        }
      }

      .time-legend {
        color: @dark_font_color;

        .available {
          .circle {
            border-color: @dark_font_color;
          }
        }

        .unavailable {
          .circle {
            background: @sb_text_color;
          }
        }

        .day-offset-warning {
          color: @sb_text_color;
        }
      }
    }
  }
}

// Group booking input / Product item counter
#main, #sb_main {
  .active-count {
    .plus, .minus {
      background: @sb_base_color;

      &:before, &:after {
        color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
      }
    }
  }
}


// Back button
#sb_main #sb-main-container {
  #steps {
    #sb_back_button {
      a {
        color: @sb_base_color;
      }
    }
  }
}

// Navigation steps
#sb-timeline {
  #steps-nav {
    ul {
      .step_info_item {
        &:before, &.passed + li:not(.passed):before {
          background: @sb_base_color;
        }

        &:not(.passed):before {
          background: @secondary_color;
        }

        &.passed + li:not(.passed) .content .title-small {
          color: @sb_base_color !important;
        }

        &:not(.passed) .content .title-small {
          color: @sb_text_color;
        }

        .content {
          .title-small, .title-sub {
            color: @dark_font_color;
          }
        }
      }
    }
  }
}

// Client login step
#main {
  #client-login {
    #cs_register_or_login_tabs {
      ul {
        li {
          &.active {
            a {
              color: @sb_base_color;
              border-color: @sb_base_color !important;
            }
          }

          a {
            color: @dark_font_color;
          }
        }
      }

    }

    .to-sign-up {
      &__link {
        color: @sb_base_color;
      }
    }
  }
}

// Slot available
#sb-timeline #steps #steps-content #sb_booking_content .datetime-step #sb_timeview_container .timeline-wrapper .slot--available-slot,
#time_classes_time_container .sb-cell .slot--available-slot {
  background: @dark_font_color !important;
  color: contrast(@dark_font_color, @light_font_color, @sb_base_color);
}

// Form

// Inputs
.form-group, .timezone-modal, #sb_login_form {
  .control-label {
    color: @sb_text_color;
  }

  &.has-error {
    .form-control,
    .file-upload__wrapper{
      border-color: @sb_cancellation_color;
    }
  }

  .form-control, input, textarea {
    border-color: @secondary_color;
    color: @dark_font_color;

    &::placeholder {
      color: @sb_text_color;
    }

    &:focus, &.not-empty {
      border-color: @sb_base_color;
    }
  }
}

.file-upload{
  &__wrapper{
    border-color: #e4ebf5;
    &.selected {
      border-left: 3px solid #4caf50;
    }
  }
}

#sb_additional_fields .form-group .control-label.required:after {
  color: @sb_cancellation_color;
}

.has-error {
  .help-block {
    color: @sb_cancellation_color;
  }
}

// Misc
.has-error {
  .custom-checkbox .custom-label {
    border-color: @sb_cancellation_color !important;
  }
}

// Checkboxes
#main .custom-checkbox, #sb_main .custom-checkbox {
  .custom-label {
    border-color: @secondary_color;
  }

  input:checked + .custom-label {
    border-color: @sb_base_color;

    &:before {
      color: @sb_base_color;
    }
  }
}

#main .has-error .custom-checkbox, #sb_main .has-error .custom-checkbox {
  input:checked + .custom-label {
    border-color: @sb_cancellation_color;

    &:before {
      color: @sb_cancellation_color;
    }
  }
}

#sb-main-container #main {
  #steps-content #sb_booking_content #details .product-attribute-section .product-list-view-wrapper #sb_attribute_list_container,
  #steps-content #sb_booking_content #details .products-items-list,
  #sb-timeline #steps #steps-content #sb_booking_content .paid-attribute-wrapper .paid-attribute-step #sb_attribute_list_container  {
  .product-item .product-label:before {
      border-color: @secondary_color !important;
    }

    .item {
      .preloader {
        background: @secondary_color;
      }

      &.panel {
        .preloader {
          background: @secondary_color;
        }

        .info-bar {
          .bar-flex-item {

            &.price {
              .txt {
                color: @dark_font_color;
              }
            }

            .ico {
              color: @sb_text_color;
            }
          }
        }

        .read-more, .btn-hide {
          color: @sb_base_color;

          span {
            color: @sb_base_color;
          }
        }

        > .wrap-collapse-content {
          .collapse-content {
            color: @sb_text_color;
          }
        }
      }

      .badge {
        color: @dark_font_color;
      }
    }

    .product-item .product-label:after {
      color: @sb_base_color;
    }

    .product-item input.check:checked + .product-label:before {
      border-color: @sb_base_color !important;
    }
  }

  #steps-content #sb_booking_content #details .product-attribute-section .product-list-view-wrapper #sb_attribute_list_container .paid-attr__item.panel .bar-service {
    &__item {
      .ico {
        color: @sb_text_color;
      }

      .txt {
        color: @dark_font_color;
      }
    }
  }
}

#sb-main-container #main #client-login .client-login-bar {
  .txt {
    color: @dark_font_color;
  }
}

#sb_main .current-booking-info {

  .preloader {
    background: @secondary_color;
  }

  .cap {
    color: @sb_base_color;
  }

  .accordion {
    .title {
      color: @dark_font_color;

      &:after {
        color: @dark_font_color;
      }
    }
  }

  .booking-btns {
    .col-sm-12 {
      .sb_cancel_btn {
        background: @sb_cancellation_color;
      }
    }
  }
}

.subscribe-component--btn-bar .btn-bar--row .btn.btn-danger{
  background: @sb_cancellation_color;
}
.subscribe-component--btn-bar .btn-bar--row .btn.btn-primary{
  background: @btn_color;
  color: contrast(@btn_color, @light_font_color, @dark_font_color);
}

// Invoice payment page
#main {
  .invoice-pay-page {
    .tab {
      .invoice-pay-page-grid {
        .left-block {

          // Promotions instances
          .promotion-instances-list {
            > div {
              .promo-list-item {
                border-color: @sb_base_color !important;
                color: @dark_font_color;
              }
            }
          }

          .promo-code-input {
            .custom-form {
              .control-label {
                color: @sb_base_color;
              }

              .form-control {
                border-color: @secondary_color !important;
                color: @dark_font_color;

                &::placeholder {
                  color: @sb_text_color;
                }

                &:focus, &.not-empty {
                  border-color: @sb_base_color !important;
                }
              }

              .promo-btn {
                color: contrast(@btn_color, @light_font_color, @dark_font_color);
              }
            }
          }
        }

        .right-block {
          .section-pd {
            .info {
              background: @sb_base_color;

              .total, p {
                color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
              }
            }
          }
        }
      }
    }

    // Invoices list
    .invoice-table {
      thead {
        background: @sb_base_color;

        th {
          color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
        }
      }

      tbody {
        tr:nth-child(odd) {
          background: fade(@sb_base_color, 5%);
        }
      }
    }

    // Invoice pager
    #sb_invoice_pager_container {
      .pagination-wrapper {
        .arrow:hover, a:hover {
          color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
        }
      }
    }
  }
}

// News page
#news-index {
  .news-list {
    #sb_news_list_container {
      .article {
        border-color: @sb_base_color !important;

        .cap {
          a {
            color: @dark_font_color;
          }
        }
      }
    }
  }
}

#news-single {
  .article {
    .cap, .date {
      color: @dark_font_color;
    }
  }
}

#sb-main-container #main {
  #booking-result-tabs {
    .tabs-container {
      .tab-link {
        &.active {
          a {
            color: @sb_base_color;
          }
        }
      }
    }
  }

  // Memberships
  .filter {
    .title-main {
      color: @dark_font_color;
    }

    .filter-list {
      .form-control {
        border-color: @secondary_color;
        color: @dark_font_color;

        &::placeholder {
          color: @sb_text_color;
        }

        &:focus, &.not-empty {
          border-color: @sb_base_color !important;
        }
      }

      .sb_changed_filter_item {
        border-color: @sb_base_color;
        color: @dark_font_color;

        //.sb_remove_item:before, .sb_remove_item:after {
        //  background-color: @dark_font_color;
        //}
      }
    }
  }

  #sb_membership_list_container, #sb_membership_module_list_container {
    .membership-item {
      &.panel {
        border-color: @sb_base_color !important;

        .preloader {
          background: @secondary_color;
        }

        .info-bar {
          .purchased {
            background: @sb_base_color;
            color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
          }

          .ico {
            color: @sb_text_color;
          }

          .value {
            color: @sb_text_color;
          }
        }


        .read-more, .btn-hide {
          color: @sb_base_color;

          span {
            color: @sb_base_color;
          }
        }

        > .wrap-collapse-content {
          .collapse-content {
            color: @sb_text_color;
          }
        }
      }

      .tab {
        border-color: @sb_base_color;

        .purchased {
          background: @sb_base_color;
          color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
        }

        .preloader {
          background: @secondary_color;
        }

        .active-container, .info-container {
          .btn {
            color: contrast(@btn_color, @light_font_color, @dark_font_color);
          }
        }

        a.price-formatter {
          background: @btn_color;
          color: contrast(@btn_color, @light_font_color, @dark_font_color);
        }
      }
    }
  }


}

// Reviews
#reviews-view {
  .reviews-toggle {
    .reviews-toggle__link {
      color: @dark_font_color;

      &.active {
        color: @sb_base_color;
        border-color: @sb_base_color !important;
      }
    }
  }

  // Add review
  #sb_reviews_add_container {
    .add-review {
      .form {
        .form-group {
          input, textarea {
            color: @dark_font_color;
            border-color: @secondary_color !important;

            &::placeholder {
              color: @sb_text_color;
            }

            &:focus, &.not-empty {
              border-color: @sb_base_color !important;
            }
          }
        }
      }

      .avatar {
        .info {
          .name {
            color: @dark_font_color;
          }
        }

        .logout {
          color: @sb_cancellation_color;
        }
      }

      .send-btn-container {
        .btn {
          color: contrast(@btn_color, @light_font_color, @dark_font_color);
        }
      }
    }
  }

  // Reviews list
  #sb_reviews_list_container {
    #sb_reviews_list_items_container {
      .review-item {
        .review-tab {
          .cap, .comment {
            color: @sb_text_color;
          }

          .delete-button {
            background: @sb_cancellation_color;
            color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
          }
        }

        .review-likes {
          .like-count {
            color: @dark_font_color;
          }
          .vote-tooltip {
            background-color: @dark_font_color;
            color: contrast(@dark_font_color, @light_font_color, @dark_font_color);
            &:before {
              border-bottom-color: @dark_font_color;
            }
          }
        }
      }
    }
  }
}

// Packages
.package-content-page {
  .page-pd-package-content {
    #sb_package_list_container, #sb_package_client_instance_list_container {
      > div {
        .package-item {
          &.panel {
            border-color: @sb_base_color !important;

            .preloader {
              background: @secondary_color;
            }

            .info-bar {
              .ico {
                color: @sb_text_color;
              }

              .value {
                color: @sb_text_color;
              }
            }

            .bar-flex-item {
              &.package-list-short-pd {
                background: fade(@sb_base_color, 5%);
              }
            }

            .read-more, .btn-hide {
              color: @sb_base_color;

              span {
                color: @sb_base_color;
              }
            }

            > .wrap-collapse-content {
              .collapse-content {
                color: @sb_text_color;
              }

              .selected-package-list {
                background: fade(@sb_base_color, 5%);

                .package-list-item {
                  color: @dark_font_color;
                }
              }
            }
          }

          .is-used {
            background: @sb_cancellation_color;
            color: contrast(@sb_cancellation_color, @dark_font_color, @light_font_color);
            .txt {
              color: contrast(@sb_cancellation_color, @dark_font_color, @light_font_color);
            }
          }

          .tab {
            border-color: @sb_base_color !important;

            .preloader {
              background: @secondary_color;
            }

            .btn.select {
              color: contrast(@btn_color, @light_font_color, @dark_font_color);
            }
          }
        }
      }
    }
  }
}

// Gift cards
.promotion-list {
  .promotion-step {
    .promotion-item {

      &.panel {
        border-color: @sb_base_color !important;

        .preloader {
          background: @secondary_color;
        }

        .promo-label {
          color: contrast(@sb_base_color, @light_font_color, @dark_font_color);

          .txt {
            color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
          }

          &.discount {
            background: @sb_cancellation_color !important;
            color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);

            .txt {
              color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
            }
          }

          &.amount {
            background: @sb_base_color !important;
          }
        }

        .info-bar {
          .ico {
            color: @sb_text_color;
          }

          a {
            color: @sb_base_color;

            .txt {
              color: @sb_base_color;
            }
          }

          .price {
            color: @dark_font_color;

            .txt {
              color: @dark_font_color;
            }
          }
        }

        .read-more, .btn-hide {
          color: @sb_base_color;

          span {
            color: @sb_base_color;
          }
        }

        @media (max-width: 480px) {
          .read-more {
            border-color: fade(@sb_base_color, 30%) !important;
          }
        }

        > .wrap-collapse-content {
          .collapse-content {
            color: @sb_text_color;
          }
        }
      }

      .used-overlay {
        .text {
          //background: @sb_cancellation_color;
          //color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
        }
      }

      .promo-label {
        color: contrast(@sb_base_color, @light_font_color, @dark_font_color);

        &.discount {
          background: @sb_cancellation_color;
          color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
        }

        &.amount {
          background: @sb_base_color;
        }
      }

      .tab {
        border-color: @sb_base_color !important;

        .preloader {
          background: @secondary_color;
        }

        .badge {
          color: @dark_font_color;
        }

        .btn-bar {
          .btn.select {
            background: @btn_color;
            color: contrast(@btn_color, @light_font_color, @dark_font_color);
          }
          .btn.select-by-bonus{
            background: #fff;
            color: @btn_color;
            &.disabled{
              color: @dark_font_color;
            }
          }
        }
      }
    }
  }
}

// Bookings result
#booking-result-view {
  #sb_bookings_list {
    > div {
      .booking-item {
        .tab {
          border-color: @sb_base_color !important;

          .cap {
            color: @dark_font_color;
          }

          .booking-btns {
            .sb-book {
              background: @btn_color;
              color: contrast(@btn_color, @light_font_color, @dark_font_color);

              a {
                color: contrast(@btn_color, @light_font_color, @dark_font_color);
              }
            }

            .sb-reschedule {
              background: @btn_color;
              color: contrast(@btn_color, @light_font_color, @dark_font_color);

              a {
                color: contrast(@btn_color, @light_font_color, @dark_font_color);
              }
            }
            .sb-medical-test-download,
            .sb_add_to_cal {
              color: @sb_base_color;

              a {
                color: @sb_base_color;
              }
            }

            .sb_cancel_btn {
              background: @sb_cancellation_color;

              &:before {
                color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
              }
            }
          }
        }
      }
    }
  }
}

// Inline datepicker
.datepicker.datepicker-dropdown {
  table {
    th {
      color: @dark_font_color;
    }

    tr td {
      color: @dark_font_color;

      &.day {
        &:not(.disabled):hover, &:not(.day-off):hover, &.active:hover {
          background: @sb_base_color !important;
          color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
        }

        &.active {
          background: @sb_base_color;
          color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
        }

        &.today {
          background: fade(@sb_base_color, 30%);
          color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
        }
      }
    }

    .month, .year {
      &.active, &:not(.disabled):hover, &.active:hover {
        background: @sb_base_color;
        color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
      }
    }
  }
}

.modal {
  .modal-dialog, .timezone-modal.modal-dialog {
    // Other misc modals
    .modal-content {
      .modal-header {
        .close {
          background: @sb_cancellation_color;

          span {
            color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
          }
        }

        .modal-title {
          color: @sb_base_color;
        }
      }

      .modal-body {
        .calendar-popup {
          ul {
            li {
              .btn {
                a {
                  color: @dark_font_color;
                }
              }
            }
          }
        }
      }

      .modal-footer {
        .tab-pd {
          #sb_cancellation_cancel {
            color: @sb_base_color;
          }

          #sb_cancellation_confirm {
            background: @sb_base_color;
          }

          //Cancel timezone modal
          #sb_cancel_button {
            color: @sb_cancellation_color;
          }

        }

        #sb_review_delete_confirm {
          background: @sb_base_color;
          color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
        }

        #sb_review_delete_cancel {
          color: @sb_cancellation_color;
        }
      }
    }

    .get-gdpr-info-modal {
      .full-info {
        .close-full-info {
          background: @sb_cancellation_color !important;
          color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
        }

        .content {
          color: @sb_text_color;
        }

        .btn-get-report {
          color: contrast(@btn_color, @light_font_color, @dark_font_color) !important;
        }
      }
    }

    // Modals for booking steps
    .full-info {
      .close-full-info {
        background: @sb_cancellation_color;
        color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
      }

      .preloader {
        background: @secondary_color;
      }
    }

    // Remind password modal, Client profile modal, Client profile edit modal
    #remind-password, #client-profile-preview, #client-profile-edit {
      .cap {
        color: @sb_base_color;
      }

      .close-modal {
        background: @sb_cancellation_color;
        color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
      }

      .bar {
        #sb_remind_btn {
          color: contrast(@btn_color, @light_font_color, @dark_font_color);
        }
      }

      .overview {
        .label {
          color: @sb_text_color;
        }

        .txt {
          color: @dark_font_color;
        }
      }

      .bar-with-btn {
        .btn-edit {
          color: @sb_base_color;
        }

        .btn-invoices, .btn-bookings, .btn-bonuses, .btn-primary {
          background: @btn_color;
          color: contrast(@btn_color, @light_font_color, @dark_font_color);
        }
      }
    }
  }
}

.current-booking-info {
  .booking-btns {
    .modal-footer {
      .btn {
        background: @sb_cancellation_color !important;
      }
    }
  }
}

.modal-dialog {
  #sb_time_classes_service_container {
    .item {
      .preloader {
        background: @secondary_color;
      }

      .txt {
        color: @sb_text_color;
      }

      .badge {
        color: @dark_font_color;
      }
    }
  }

  #time_classes_time_container {
    .sb-cell {
      color: @dark_font_color;

      &:hover {
        color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
      }
    }
  }
}

// GDPR report page
#gdpr-report-view {
  .page-pd {
    #sb_gdpr_control_panel_container {
      .btn-primary {
        background: @btn_color;
        color: contrast(@btn_color, @light_font_color, @dark_font_color);
      }

      .btn-gdpr-report-logout {
        .txt {
          color: @sb_cancellation_color;
        }
      }
    }

    .main-gdpr-report {
      .btn-default {
        background: @btn_color;
        color: contrast(@btn_color, @light_font_color, @dark_font_color);
      }
    }
  }
}

// GDPR popup form
#sb_gdpr_email_form {
  .title {
    color: @sb_base_color;
  }

  .sb_gdpr_close_form_btn {
    color: contrast(@btn_color, @light_font_color, @dark_font_color);
  }

  .sb_gdpr_close_form_btn {
    background: @sb_cancellation_color;
    color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
  }

  .content {
    color: @sb_text_color;
  }

  .btn {
    color: contrast(@btn_color, @light_font_color, @dark_font_color) !important;
  }
}

// Client profile modal
#client-profile-preview {
  .section-pd {
    .bar-with-btn {
      .btn {
        &.btn-logout {
          color: @sb_cancellation_color;
          border: 1px solid @sb_cancellation_color;
        }
      }
    }
  }
}

// Edit profile modal
#client-profile-edit {
  .bar-with-btn {
    .btn {
      &.btn-danger {
        color: @sb_cancellation_color;
      }
    }
  }
}

#footer {
  #sb_scroll_top_btn {
    color: contrast(@btn_color, @light_font_color, @dark_font_color);
  }
}

// Addons step
#sb-timeline #steps #steps-content #sb_booking_content .paid-attribute-wrapper {
  width: calc(100% + 15px);
  margin: 40px -15px 0;

  .paid-attribute-step {
    .product-item {
      border-color: @border_slot_color !important;
      &.selected {
        background: fade(@sb_base_color, 10%) !important;
        border-color: @sb_base_color !important;
      }

      .item-price {
        color: @sb_base_color;
      }
    }
  }
  .paid-attribute-footer {
    background: fade(@sb_base_color, 5%) !important;
    .btn.next {
      background: @btn_color;
      color: contrast(@btn_color, @light_font_color, @dark_font_color);
    }
  }
}

.sb-client-fields {
  border-bottom-color: @secondary_color !important;
}

///

#sb_multiple_book_cart {
  .counter {
    background: @sb_base_color;
    color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
    //color: #ffffff;
    a {
      //color: #fffffe;
      color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
    }
  }
}

.promotion-list .promotion-item .badge {
  color: @sb_base_color;
}

.promotion-item .select a {
  background-color: @sb_base_color;
  color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
}

#sb_menu a {
  color: contrast(@body_bg_color, @dark_font_color, @light_font_color);
  @media only screen and (max-width: 1024px) {
    color: #464646;
  }
}

.btn.book-btn {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
  //color: #ffffff;
  a {
    color: contrast(@btn_color, @dark_font_color, @light_font_color);
    //color: #fffffe;
  }
}

#footer .copyright {
  color: contrast(@body_bg_color, @dark_font_color, @light_font_color);
}


#header .nav-wrapper .items-wrapper .nav-item#book-btn .book-btn-container .item-container {
  background: @sb_base_color;;
}

.modal-dialog .modal-content .modal-header {
  background: @sb_base_color;

  .modal-title {
    color: contrast(@sb_base_color, @dark_font_color, @light_font_color);
  }
}

#booking-result-view #booking-result-tabs .tabs-container .tab-link {
  a {
    color: contrast(@body_bg_color, @dark_font_color, @light_font_color);
  }

  &.active {
    a {
      border-bottom-color: @sb_base_color;
    }
  }
}

#sb-timeline #steps-nav li:not(.passed) {
  .title-small {
    color: contrast(@body_bg_color, @dark_font_color, @light_font_color);
  }
}

#sb-timeline #steps #steps-content #sb_booking_content .detail-step .right-side #sb_book_btn {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
  //color: #ffffff;
  a {
    //color: #fffffe;
    color: contrast(@btn_color, @dark_font_color, @light_font_color);
  }
}

.payment-modal #sb_pay_btn {
  color: @light_font_color;
}

#news-index .news-list .article .cap a {
  color: @sb_base_color;
}


//timeline colors

.badge {
  background: @sb_base_color;
  color: contrast(@sb_base_color, @dark_font_color, @light_font_color);

  &:before {
    border-top: 40px solid @sb_base_color;
  }

  &:after {
    border-top: 5px solid @sb_base_color;
  }
}

#main #main-content #sb_content #sb_product_container .sb-list-type.simple-list .product-item .item-data .badge {
  color: @dark_font_color;
}

#sb-timeline #steps #steps-content #sb_booking_content .datetime-step .header span {
  color: @sb_base_color;
}

.plugin-group-booking:before {
  background: url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="iso-8859-1"?><svg xmlns="http://www.w3.org/2000/svg" width="24.61" height="25" viewBox="0 0 19.688 20"><path data-name="user copy" d="M9.844 10a5 5 0 1 0-4.922-5 4.975 4.975 0 0 0 4.922 5zm0 2.5C6.521 12.5 0 14.12 0 17.5V20h19.687v-2.5c0-3.38-6.521-5-9.843-5z" fill="@{svg-group-booking}" fill-rule="evenodd"/></svg>');
  background-size: 18px;
  background-repeat: no-repeat;
  background-position: left center;
}

.service-item .bar-service .badge {
  color: @sb_base_color;
}

.service-item .bar-service .service-deposit .text {
  color: @dark_font_color;
}

.active-count .plus:before:hover {
  border-bottom-color: @sb_base_color;
}

.active-count .minus:after:hover {
  border-top-color: @sb_base_color;
}

.service-bar__icon .icon.icon-reccuring .fa.fa-refresh:before {
  background: url('data:image/svg+xml;utf8,<?xml version="1.0" encoding="iso-8859-1"?><svg xmlns="http://www.w3.org/2000/svg" width="18.938" height="18"><path d="M18.423 1.562a.69.69 0 0 0-.819.53l-.5 2.34A8.966 8.966 0 0 0 .404 8.97a.69.69 0 1 0 1.379 0 7.587 7.587 0 0 1 14.148-3.812l-2.3-.493a.69.69 0 0 0-.289 1.349l3.947.847a.687.687 0 0 0 .2.012.675.675 0 0 0 .317-.108.684.684 0 0 0 .3-.435l.846-3.949a.69.69 0 0 0-.529-.819zm-.694 6.5a.69.69 0 0 0-.667.712 7.587 7.587 0 0 1-7.331 7.837h-.253a7.585 7.585 0 0 1-6.452-3.6l2.4.643a.69.69 0 0 0 .358-1.333l-3.9-1.046a.689.689 0 0 0-.845.488l-1.045 3.9a.69.69 0 1 0 1.332.357l.588-2.192a8.96 8.96 0 0 0 7.566 4.16h.3a8.967 8.967 0 0 0 8.665-9.262.689.689 0 0 0-.716-.66z" fill="@{svg-group-booking}" fill-rule="evenodd"/></svg>');
  background-size: 24px;
  background-repeat: no-repeat;
  background-position: right center;
}

.tab.tab-col .read-more,
.provider-item .read-more,
.membership-item .read-more {
  color: @sb_base_color;
}

#sb-main-container .custom-checkbox input:checked + .custom-label {
  border-color: @sb_base_color;
  background-color: @sb_base_color;
}

#sb_membership_container .alert-info a {
  color: @sb_base_color;
}

.current-booking-info .btn.sb-ticket-download {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}
.current-booking-info .btn.sb-ticket-download .txt {
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

.page-content--online-meeting .online-meeting{
  border-color: @sb_base_color;
}

//RTL
html[dir="rtl"] #sb-timeline #steps #steps-content #sb_booking_content .datetime-step .timeline-wrapper #sb_time_flexible_weekly_container .data-col .time-container .time-slot {
  border-right: inherit;
  border-left: 1px solid @border_slot_color;
}

// Theme main icons color
.preloader,
.photo,
.provider-item .default,
.empty-step__image,
//.invoice-pay-page,
.invoice-notifications,
.error-card ,
.page-content--online-meeting .online-meeting__picture {
  svg {
    path[stroke] {stroke: @sb_base_color;}
    path[fill] {fill: @sb_base_color;}
    circle[stroke] {stroke: @sb_base_color;}
    circle[fill] {fill: @sb_base_color;}
  }
}

// Samesite cookies popup
.samesite-cookies {
  background: fade(@body_bg_color, 70%);
  &__popup {
    background: @body_bg_color;

    &-btn {
      background: @btn_color;
      color: contrast(@btn_color, @dark_font_color, @light_font_color);

      &:hover {
        color: contrast(@btn_color, @dark_font_color, @light_font_color);
      }
    }

    &-link {
      color: @sb_base_color;
    }
  }
}

#sb-main-container #header .nav-wrapper #sb_menu .nav {
  &::-webkit-scrollbar {
    -webkit-appearance: none;
    width: 5px;
    border-radius: 4px;
  }
  &::-webkit-scrollbar-track {
    background-color: fade(@sb_base_color, 20%);
    -webkit-box-shadow: inset 0 0 4px rgba(0,0,0,0.2);
    border-radius: 4px;
  }
  &::-webkit-scrollbar-thumb {
    background-color: @sb_base_color;
    border-radius: 4px;
    border: none;
  }
  &::-webkit-overflow-scrolling:touch {
    width: 5px;
  }
}


.paid-attr__item .preloader svg {
  path[stroke] {stroke: @sb_base_color;}
  path[fill] {fill: @sb_base_color;}
  circle[stroke] {stroke: @sb_base_color;}
  circle[fill] {fill: @sb_base_color;}
}

.telegram-notifications{
  &--modal {
    .modal-dialog .modal-content {
      .modal-header {
        .modal-title {
          color: @sb_base_color;
        }
      }
    }
    .close-full-info{
      background: @sb_cancellation_color !important;
      color: contrast(@sb_cancellation_color, @light_font_color, @dark_font_color);
    }

  }
  &--card{
    .btn{
      background: @btn_color;
      color: contrast(@btn_color, @light_font_color, @dark_font_color);
    }
  }
  &__btn-bar{
    .btn{
      background: @btn_color;
      color: contrast(@btn_color, @light_font_color, @dark_font_color);
    }
  }
}

.login-container__remember-check {
  background: @dark_font_color;

  svg path {
    stroke: contrast(@dark_font_color, @light_font_color, @dark_font_color);
  }
}

.bonus{
  &__count-row{
    .icon{
      color: @sb_base_color;
    }
  }
  &__count {
    color: @sb_base_color;
  }
  &__amount{
    color: @sb_base_color;
    &.no-income{
      color: #FF7993;
    }
  }
  &__table{
    thead{
      background: @sb_base_color;
      color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
      th{
        color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
        border-bottom: none !important;
      }
    }
    tbody{
      tr{
        background: transparent;
        &:nth-child(odd) {
          background: fade(@sb_base_color, 10%);
        }
        &:nth-child(even) {
          background: #fff;
        }
      }
    }
  }
  &__btn-bar--wrapper{
    .btn{
      background: @btn_color;
      color: contrast(@btn_color, @light_font_color, @dark_font_color);
    }
  }
}

.tab.tab-col .excerpt-info .btn-bar ,
.tab.tab-col .excerpt-info .btn-bar {
  button.btn.select-by-bonus,
  a.btn.select-by-bonus{
    background-color: #fff !important;
    color: @sb_base_color;
    &.disabled{
      color: @dark_font_color;
      background: transparent !important;
      box-shadow: none;
    }
  }
}

.service-bonus,
.info.bonus,
#sb-timeline #steps #steps-content #sb_booking_content .service-item .service-bonus{
  color: @sb_base_color;
}

.promotion-list .promotion-step .promotion-item .modal-dialog .preloader.img-full .default.img{
  background: @secondary_color;
}
.promotion-list .promotion-item .modal-dialog .item__additional-info-action .promo-label__text,
.promotion-list .promotion-item .modal-dialog .item__additional-info-action .promo-label__value,
.promotion-list .promotion-item .modal-dialog .item__additional-info-action .used-label__text{
  color: @dark_font_color;
}

.invoice-pay-page .promo-code-input .control-label .dropdown-menu{
  color: @dark_font_color;
}

.payment-modal .payment-system-container .payment-system,
.payment-modal #sb_payment_systems_container .payment-systemm,
#sb-main-container #main .invoice-pay-page .tab .invoice-pay-page-grid .left-block .section-pd #sb_package_instance_container .accordion .accordion-header{
  background: rgba(@sb_base_color, 0.10);
}

// Date field icon
.calendar-toggle {
  &__icon path {
    fill: @sb_base_color;

    &:last-child {
      fill: none;
      stroke: @sb_base_color;
    }
  }
}

.sb-layout .promotion-list .promotion-item__tag .promo-label.amount {
  background-color: #64b5f6;
  color: #fff;
}
.pwa-app--btn:hover,
.pwa-app--btn:focus,
.pwa-app--btn:active{
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}
.pwa_install__button-link{
  color: @sb_base_color;
}
.pwa-app--install-page .loader:before{
  border-color: @sb_base_color;
}

// invoice-notification buttons
.invoice-notification--pay,
.invoice-notification.closed .invoice-notification--open{
  background-color: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
  &:hover{
    color: contrast(@btn_color, @dark_font_color, @light_font_color);
    background-color: darken(@btn_color, 8%);
  }
}

.invoice-notification--close{
  color: @sb_base_color;

  &:hover{
    color: darken(@sb_base_color, 8%);
    background-color: rgba(@sb_base_color, 0.1);
  }
}

.invoice-notification--close-tooltip {
  color: contrast(@body_bg_color, @dark_font_color, @light_font_color);
  background: @body_bg_color;

  &:after {
    border-top-color: @body_bg_color;
  }
}

// product shop catalog
.step-content--product .item .badge{
  color: @sb_base_color;
  background: unset;
}

.product-view--history_list{
  border-color: rgba(@dark_font_color, 0.2);
}

.product-view--history_item{
  color: @dark_font_color;
}

.product-view--history_item.passed:hover{
  color: @sb_base_color;
}

.invoice-pay-page-grid_item.right-block .right-block--section-pd,
.full-info.full-info--cart{
  background: @body_bg_color;
  color: @dark_font_color;
  box-shadow: 2px 0px 20px rgba(@dark_font_color, 0.25);
}

.invoice-pay-page .invoice-pay-page-grid_item.right-block .right-block--section-pd{
  border-color: rgba(darken(@dark_font_color, 100%), 0.15);
  box-shadow: 2px 0px 18px rgba(@dark_font_color, 0.15);
}

.product-delivery-container > div,
.invoice-tips .tips-view,
.invoice-pay-page.invoice-pay-page--select-pm .promo-code-input,
.invoice-used-packages-list .accordion-wrapper,
.full-info--cart_module .full-info--cart_footer,
.btn-group .full-info--cart_item-count,
.full-info--cart_item,
.full-info--cart_item-product .btn-group{
  border-color: rgba(darken(@dark_font_color, 100%), 0.2) !important;
}

.full-info--cart_module .package-use-credits-msg{
  border-color: @sb_base_color !important;
}

.full-info--cart_close-btn,
.full-info--cart_item-delete {
  background: rgba(#fff3f3, 0.1);
  color: #ff3259;
}
.full-info--cart_close-btn,
.full-info--cart_item-delete:active,
.full-info--cart_item-delete:hover {
  background: rgba(#fff3f3, 0.8);
  color: darken(#ff3259, 6%);
}
.full-info--cart_close-btn,
.full-info--cart_item-delete:focus {
  background: rgba(#fff3f3, 0.8);
  color: darken(#ff3259, 6%);
}

.full-info--cart_item-product .btn-group .full-info--cart_item-action:hover,
.full-info--cart_item-product .btn-group .full-info--cart_item-action:focus,
.full-info--cart_item-product .btn-group .full-info--cart_item-action:active{
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  background: rgba(@sb_base_color, 0.2);
  color: darken(@sb_base_color, 8%);
}

.full-info--cart_item-product .btn-group .full-info--cart_item-action:disabled{
  cursor: not-allowed;
  color: #222 !important;
  background: #f8fafc !important;
  border-color: darken(#f8fafc, 6%) !important;
  text-shadow: none !important;
  opacity: 0.5;

  *{
    color: #222 !important;
  }
}

.invoice-pay-page-grid_item.right-block .right-block--body table thead{
  background: darken(@body_bg_color, 10%);
  color: contrast(@body_bg_color, @dark_font_color, @light_font_color);
}

.full-info--cart_header .title svg path{
  fill: @sb_base_color;
}


.products-view--wrapper .step-content--product .item .preloader {
  background: @secondary_color;
}
.products-view--wrapper .step-content--product .item .btn-bar .btn{
  background: @sb_base_color;
  color: contrast(@sb_base_color, @light_font_color, @dark_font_color);
}

.product-item.panel .btn-bar .wrap-read-more .read-more .part{
  color: @sb_base_color;
}
.products-view--wrapper .step-content--product > div .item.panel,
.products-view--wrapper .step-content--product > div .item > .tab{
  border-color: @sb_base_color;
}

.duotone .fill,
.product-item .preloader .duotone .fill {
  fill: @sb_base_color;
}
.duotone .fill-darker,
.product-item .preloader .duotone .fill-darker {
  fill: darken(@sb_base_color, 8%);
}
.duotone .fill-darker-stroke,
.product-item .preloader .duotone .fill-darker-stroke {
  stroke: darken(@sb_base_color, 8%);
  fill: none;
}
.duotone .fill-stroke,
.product-item .preloader .duotone .fill-stroke {
  stroke: @sb_base_color;
  fill: none;
}

.full-info--cart_bookings .full-info--cart_list .full-info--cart_item-service .full-info--cart_item-image .default.img svg {
  path[stroke] {stroke: @sb_base_color;}
  path[fill] {fill: @sb_base_color;}
  circle[stroke] {stroke: @sb_base_color;}
  circle[fill] {fill: @sb_base_color;}
}

// time different informer on booking step
.current-booking-info .info .date-line .dropdown-toggle{
  color: @sb_base_color;
}

.filter--list-header{
  color: @sb_base_color;
  border-color: @sb_base_color;
  background: rgba(@sb_base_color, 0.1);
}


.subscribe-component--popup .modal-content #booking-result-popup .modal-header .close-modal{
  color: @dark_font_color;
  background: transparent;
}
.subscribe-component--popup .modal-content #booking-result-popup .modal-header .close-modal:hover{
  color: #f44336;
  background: transparent;
}
.subscribe-component--status-icon{color: #f44336;}
.subscribe-component--status-icon.status-pending{color: #e6eaef;}
.subscribe-component--status-icon.status-pending{color: #e6eaef;}
.subscribe-component--status-icon.status-reschedule_success,
.subscribe-component--status-icon.status-paid,
.subscribe-component--status-icon.status-delay,
.subscribe-component--status-icon.status-success{color: #00D38B;}

.go-to-admin__button {
  background: @btn_color;
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}
.go-to-admin__button:hover,
.go-to-admin__button:active,
.go-to-admin__button:focus{
  background: darken(@btn_color, 5%);
  color: contrast(@btn_color, @dark_font_color, @light_font_color);
}

.company-location .company-name{
  color: @sb_base_color ;
}