/* WATERS EDGE RETREAT — CLEAN SPA BOOKING STYLE */

/* Overall page */
body,
#sb_main {
  background: #f5f2eb !important;
  color: #26343a !important;
  font-family: Arial, Helvetica, sans-serif !important;
}

/* Brand name */
.company-name,
#company-name,
[data-qa="company-name"] {
  color: #26343a !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 400 !important;
  letter-spacing: 1.5px !important;
}

/* Service/package cards */
.service-item,
.service-item-block,
[class*="service-item"] {
  border: 1px solid #e3ddd1 !important;
  border-radius: 14px !important;
  overflow: hidden !important;
  background: #ffffff !important;
  box-shadow: 0 8px 22px rgba(25, 43, 48, 0.08) !important;
}

/* Images in package cards */
.service-item img,
.service-item-block img,
[class*="service-item"] img {
  width: 100% !important;
  height: 210px !important;
  object-fit: cover !important;
}

/* Service title */
.service-name,
[class*="service-name"] {
  color: #26343a !important;
  font-family: Georgia, "Times New Roman", serif !important;
  font-weight: 600 !important;
}

/* Price */
.service-price,
[class*="service-price"],
[class*="price"] {
  color: #b38b22 !important;
  font-weight: 700 !important;
}

/* Select, next, back and booking buttons */
button,
.btn,
[class*="button"],
[class*="btn"] {
  border-radius: 6px !important;
}

/* Primary action buttons only */
.btn-primary,
.button-primary,
[class*="primary"] button,
[class*="primary-btn"] {
  border: 0 !important;
  background: #26343a !important;
  color: #ffffff !important;
  font-weight: 700 !important;
  letter-spacing: 0.6px !important;
  text-transform: uppercase !important;
}

.btn-primary:hover,
.button-primary:hover,
[class*="primary"] button:hover,
[class*="primary-btn"]:hover {
  background: #b38b22 !important;
  color: #ffffff !important;
}

/* Booking step bar */
[class*="steps"],
[class*="progress"] {
  border-radius: 10px !important;
}

/* Mobile */
@media (max-width: 700px) {
  .service-item img,
  .service-item-block img,
  [class*="service-item"] img {
    height: 180px !important;
  }
}