/* Tonic Trails booking modal shim
   Replaces Elementor Pro's popup module (popup.*.bundle.min.js + dialog.min.js),
   which the static clone never loads. Popups 628 (Book Massage) and 629
   (Book Health Coaching) are otherwise rendered inline at the foot of the page.
   Bound at runtime from each popup's data-elementor-settings open_selector. */

.elementor-location-popup {
  display: none;
}

/* The shim renames popups to .tt-popup-content once they are re-parented,
   so Elementor's own cleanup pass cannot strip them out of the panel. */
.tt-popup-content {
  display: none;
}

.tt-modal {
  position: fixed;
  inset: 0;
  z-index: 100000;
  display: none;
  align-items: center;
  justify-content: center;
  padding: 24px 16px;
  overflow-y: auto;
  overscroll-behavior: contain;
}

.tt-modal[data-tt-open="true"] {
  display: flex;
}

.tt-modal .tt-modal__backdrop {
  position: fixed;
  inset: 0;
  background: rgba(6, 7, 14, 0.62) !important;
  border: 0;
  padding: 0;
  margin: 0;
  cursor: pointer;
  -webkit-backdrop-filter: blur(2px);
  backdrop-filter: blur(2px);
  animation: tt-modal-fade 0.22s ease both;
}

.tt-modal .tt-modal__panel {
  position: relative;
  z-index: 1;
  width: 100%;
  max-width: 640px;
  margin: auto;
  background: #fff !important;
  border-radius: 10px;
  box-shadow: 0 24px 64px rgba(6, 7, 14, 0.32);
  animation: tt-modal-rise 0.24s cubic-bezier(0.16, 1, 0.3, 1) both;
  /* The Practice Better booking iframe is taller than a laptop viewport.
     Scroll inside the panel so the close control stays reachable. */
  max-height: calc(100vh - 48px);
  overflow-y: auto;
  overscroll-behavior: contain;
}

@supports (max-height: 100dvh) {
  .tt-modal .tt-modal__panel {
    max-height: calc(100dvh - 48px);
  }
}

/* The Practice Better embed needs room to breathe. */
.tt-modal--wide .tt-modal__panel {
  max-width: 860px;
}

.tt-modal__panel > .tt-popup-content {
  display: block;
  padding: 8px 0 4px;
}

.tt-modal .tt-modal__close {
  position: sticky;
  top: 10px;
  float: right;
  margin: 10px 10px -40px auto;
  z-index: 2;
  width: 40px;
  height: 40px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: #E4EDEF !important;
  color: #005B74 !important;
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.15s ease, color 0.15s ease;
}

.tt-modal .tt-modal__close:hover,
.tt-modal .tt-modal__close:focus-visible {
  background: #4FC5E5 !important;
  color: #fff !important;
  outline: none;
}

.tt-modal .tt-modal__close:focus-visible {
  box-shadow: 0 0 0 3px rgba(79, 197, 229, 0.45);
}

body.tt-modal-locked {
  overflow: hidden;
}

@keyframes tt-modal-fade {
  from { opacity: 0; }
  to   { opacity: 1; }
}

@keyframes tt-modal-rise {
  from { opacity: 0; transform: translateY(14px) scale(0.985); }
  to   { opacity: 1; transform: none; }
}

@media (prefers-reduced-motion: reduce) {
  .tt-modal .tt-modal__backdrop,
  .tt-modal .tt-modal__panel {
    animation: none;
  }
}

@media (max-width: 600px) {
  .tt-modal {
    padding: 12px;
  }
  .tt-modal__panel {
    border-radius: 8px;
  }
}

/* ---------------------------------------------------------------
   Direct-contact block. Replaces the two Gravity Forms, removed at
   the client's request (the contact form was running ~78% spam).
   Phone first, booking links second, email last and assembled by JS
   so the address is not sitting in the page source for scrapers.
   --------------------------------------------------------------- */

.tt-contact-direct {
  max-width: 520px;
  margin: 0 auto;
  text-align: center;
  font-family: inherit;
}

.tt-contact-direct__lead,
.tt-contact-direct__note {
  margin: 0 0 18px;
  font-size: 17px;
  line-height: 1.6;
  color: #06070E;
}

.tt-contact-direct__note {
  margin-top: 28px;
  font-size: 15px;
  opacity: 0.85;
}

.tt-contact-direct__phone {
  display: inline-block;
  margin: 4px 0 8px;
  font-size: clamp(28px, 5vw, 38px);
  font-weight: 700;
  line-height: 1.2;
  color: #005B74 !important;
  text-decoration: none;
  letter-spacing: 0.01em;
}

.tt-contact-direct__phone:hover,
.tt-contact-direct__phone:focus-visible {
  color: #4FC5E5 !important;
  text-decoration: underline;
}

.tt-contact-direct__email {
  display: inline-block;
  margin-top: 2px;
  font-size: 17px;
  font-weight: 600;
  color: #005B74 !important;
  text-decoration: underline;
  text-underline-offset: 3px;
}

.tt-contact-direct__email:hover,
.tt-contact-direct__email:focus-visible {
  color: #4FC5E5 !important;
}

.tt-contact-direct__book {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin: 26px 0 4px;
}

.tt-contact-direct__btn {
  display: block;
  padding: 15px 22px;
  border-radius: 4px;
  background: #FFDE59 !important;
  color: #06070E !important;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  text-decoration: none;
  transition: background 0.15s ease, transform 0.15s ease;
}

.tt-contact-direct__btn:hover,
.tt-contact-direct__btn:focus-visible {
  background: #4FC5E5 !important;
  transform: translateY(-1px);
}

.tt-404-links {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 22px;
  margin-top: 14px;
}

.tt-404-links a {
  color: #005B74;
  font-weight: 600;
  text-decoration: underline;
  text-underline-offset: 3px;
}

@media (prefers-reduced-motion: reduce) {
  .tt-contact-direct__btn {
    transition: none;
  }
  .tt-contact-direct__btn:hover {
    transform: none;
  }
}