@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;500;600;700&display=swap');

/* ===== Typography =====
   <i> elements are intentionally excluded — icon fonts (Font Awesome)
   sit on <i> tags and manage their own font-family declarations. */
p, span, label, a, button, input, textarea, select,
h1, h2, h3, h4, h5, h6,
#client-login button.btn,
.cap.short {
  font-family: "Open Sans", Arial, sans-serif;
}

/* ===== Text transform ===== */
#header .nav-wrapper #sb_menu .nav li a,
#sb-timeline #steps-nav li:first-child .content .title-small,
#sb-timeline #steps-nav li.passed + li:not(.passed) .content .title-small {
  text-transform: capitalize;
}

/* ===== Login ===== */
#client-login input.iti__tel-input::placeholder {
  opacity: 0;
}

@media (max-width: 767px) {
  #client-login .section_top #cs_register_or_login_tabs ul li.cs_nav_item a {
    padding: 18px 24px;
  }
  #client-login .section_top #cs_register_or_login_tabs ul li.cs_nav_item {
    margin: 18px 0;
  }
}

/* ===== Hidden elements ===== */
.filter,
.pwa_install__banner-ios .pwa_install__content-ios,
.company-location--caption,
#sb_address_container,
#main #main-buttons .btn.map,
.booking-info--item_invoice,
.invoice-notification,
.invoice-pay-page-grid_item.right-block .right-block--header .invoice-info {
  display: none;
}

/* Override inline/JS-set styles */
#pwa_install_banner,
a.btn[href="#invoice/list"] {
  display: none !important;
}

/* ===== Service list ===== */
#events h3 {
  color: #7d5a58;
  font-weight: 600;
}

#events p.duration,
#events div.duration {
  font-size: 0.85em;
  color: #7d5a58;
  opacity: 0.8;
}

#events p.description,
#events div.description {
  color: #211f1c;
  font-size: 0.9em;
  line-height: 1.5;
}

#events .selectedEvent {
  border-left: 3px solid #7d5a58;
  background: rgba(125, 90, 88, 0.05);
}

#events input.reserve_time_btn {
  background: #7d5a58;
  color: #f7f6f3;
  border: none;
  padding: 10px 24px;
  border-radius: 4px;
  cursor: pointer;
}

#events input.select_another_btn {
  background: transparent;
  color: #7d5a58;
  border: 1px solid #7d5a58;
  padding: 10px 24px;
  border-radius: 4px;
  cursor: pointer;
}

/* ===== Booking form ===== */
#eventForm #start_date-block-container h3,
#eventForm #timeline-container h3 {
  color: #7d5a58;
  font-weight: 600;
}

#eventForm #save_button {
  background: #7d5a58;
  color: #f7f6f3;
  border: none;
  padding: 12px 28px;
  border-radius: 4px;
  cursor: pointer;
}

/* ===== Calendar ===== */
div.ui-widget-header {
  background: #7d5a58;
  color: #f7f6f3;
  border: none;
}

div.ui-widget-content {
  border-color: rgba(125, 90, 88, 0.2);
}

/* ===== Time slots ===== */
.timeline td.not_worked_time {
  background: #f7f6f3;
}

.timeline td.free_time {
  background: rgba(125, 90, 88, 0.12);
  cursor: pointer;
}

.timeline td.selected_time {
  background: #7d5a58;
  color: #f7f6f3;
}

.timeline td.reserved_time {
  background: #ebe8e1;
  color: #a0a0a0;
  cursor: not-allowed;
}

/* ===== Date form labels ===== */
/* Bug fix: original was missing # on 2nd and 3rd selectors */
#start_date-block-container .zend_form dt,
#start_date-block-container .zend_form dt b,
#start_date-block-container .zend_form dd label {
  color: #7d5a58;
  font-weight: 500;
}
/* ===== Additional Fields ===== */

#sb_additional_fields .form-control {
  border: 1px solid rgba(125, 90, 88, 0.4);
  border-radius: 4px;
  background: #fff;
  padding: 8px 12px;
  outline: none;
}

#sb_additional_fields .form-control:focus {
  border-color: #7d5a58;
  box-shadow: 0 0 0 3px rgba(125, 90, 88, 0.15);
}
/* ===== Checkout login buttons ===== */
#sb_sign_in_btn {
  background: #7d5a58 !important;
  color: #f7f6f3 !important;
  border: 1px solid #7d5a58 !important;
  padding: 10px 28px !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
  display: inline-block !important;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

#sign_up_btn {
  background: #6e4f4d !important;
  color: #f7f6f3 !important;
  border: 1px solid #6e4f4d !important;
  padding: 10px 28px !important;
  border-radius: 4px !important;
  font-weight: 600 !important;
  display: inline-block !important;
  transition: background 0.2s ease, box-shadow 0.2s ease;
}

#sb_sign_in_btn:hover,
#sign_up_btn:hover {
  background: #5e4240 !important;
  border-color: #5e4240 !important;
  box-shadow: 0 0 10px 0 rgba(125, 90, 88, 0.5);
}