/* ==========================================================
   HBook in Slide-in Drawer — Spacing Only (Search + Details)
   Targets: #tmts-hbook-drawer … hb-booking-search-form/details-form
   ========================================================== */



/* Drawer inner padding (keeps content off the edges) */
#tmts-hbook-drawer .tmts-hb-drawer-content {
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box !important;
}

/* Normalize container width & inner padding for both steps */
#tmts-hbook-drawer .hb-booking-search-form,
#tmts-hbook-drawer .hb-booking-details-form {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding-left: 4px !important;   /* small, so controls don't hug the edge */
  padding-right: 4px !important;
  box-sizing: border-box !important;
}

/* Section spacing within the forms */
#tmts-hbook-drawer .hb-searched-summary,
#tmts-hbook-drawer .hb-search-fields-and-submit,
#tmts-hbook-drawer .hb-summary-wrapper,
#tmts-hbook-drawer .hb-details,
#tmts-hbook-drawer .hb-customer-details,
#tmts-hbook-drawer .hb-payment-info-wrapper {
  margin-top: 10px !important;
  margin-bottom: 16px !important;
}

/* Field rows: consistent gaps without changing styles */
#tmts-hbook-drawer .hb-search-fields {
  display: flex !important;
  flex-wrap: wrap !important;
  column-gap: 16px !important;
  row-gap: 14px !important;
}

/* Each field block */
#tmts-hbook-drawer .hb-search-fields > p,
#tmts-hbook-drawer .hb-search-fields > div {
  margin: 0 !important;
  padding: 0 !important;
  flex: 1 1 260px !important; /* lets two fit side-by-side when there’s room */
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Submit wrapper: keep it tight to fields */
#tmts-hbook-drawer .hb-submit-wrapper { margin-top: 0; }

/* ==========================================================
   TMTS HBook Drawer — Mobile fit + no left cut-off
   (layout only; no colors/typography changed)
   ========================================================== */
@media (max-width: 767px) {
  /* 1) Make the drawer a full-viewport overlay on phones */
  #tmts-hbook-drawer {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;      /* modern mobile units */
    /* height: 100vh !important; */  /* ← optional fallback */
    z-index: 99999 !important;
    margin: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;

    /* Ensure slide-in works from the right without overshooting left */
    transform: translate3d(100%, 0, 0);
    transition: transform .35s ease;
    will-change: transform;
  }

  /* 2) Open states your JS might toggle */
  #tmts-hbook-drawer.is-open,
  #tmts-hbook-drawer.open,
  #tmts-hbook-drawer.tmts-open,
  body.tmts-hbd-open #tmts-hbook-drawer {
    transform: translate3d(0, 0, 0) !important;
  }

  /* 3) Inner content should scroll, not the page */
  #tmts-hbook-drawer .tmts-hb-drawer-content {
    height: 100%;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box !important;

    /* safe-area aware side padding */
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
  }

  /* 4) Prevent inherited widths/margins from pushing content left */
  #tmts-hbook-drawer .tmts-hb-drawer-content,
  #tmts-hbook-drawer .hb-booking-search-form,
  #tmts-hbook-drawer .hb-booking-details-form {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  /* 5) Stop horizontal scrolling while drawer is open (if your JS sets a flag) */
  body.tmts-hbd-open,
  html.tmts-hbd-open {
    overflow-x: hidden !important;
  }
}


/* ============================
   TMTS HBook Drawer — Mobile fix
   Force full-width + on-screen
   ============================ */
@media (max-width: 767px) {
  /* Target by id substring to catch any variant */
  [id*="tmts-hbook-drawer"] {
    position: fixed !important;
    inset: 0 !important;              /* top/right/bottom/left: 0 */
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    margin: 0 !important;
    overflow: hidden !important;
    z-index: 99999 !important;

    /* If script uses translate to hide it, default to hidden off-screen (right) */
    transform: translate3d(100%, 0, 0) !important;
    transition: transform .35s ease !important;
    will-change: transform;
  }

  /* Consider it "open" if any of these flags are present */
  body[class*="hbd-open"] [id*="tmts-hbook-drawer"],
  [id*="tmts-hbook-drawer"].open,
  [id*="tmts-hbook-drawer"].is-open,
  [id*="tmts-hbook-drawer"][aria-hidden="false"],
  /* If inline style sets translate3d(0...), force-visible too */
  [id*="tmts-hbook-drawer"][style*="translate3d(0"] {
    transform: translate3d(0, 0, 0) !important;
    left: 0 !important;               /* kill any negative left from inline styles */
    right: 0 !important;
  }

  /* Nuke any stray inline offsets that might push it off screen */
  [id*="tmts-hbook-drawer"][style*="left"],
  [id*="tmts-hbook-drawer"][style*="margin"] {
    left: 0 !important;
    margin: 0 !important;
  }

  /* Inner content scrolls; safe-area padding so it never hugs edges */
  [id*="tmts-hbook-drawer"] .tmts-hb-drawer-content {
    height: 100%;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box !important;
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
  }

  /* Forms inside must not carry fixed widths/margins from desktop */
  [id*="tmts-hbook-drawer"] .hb-booking-search-form,
  [id*="tmts-hbook-drawer"] .hb-booking-details-form {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  /* Optional: lock page from horiz scroll while open if your JS adds a flag */
  body[class*="hbd-open"], html[class*="hbd-open"] { overflow-x: hidden !important; }
}

/* ============================
   TMTS HBook Drawer — Mobile fix
   Fill screen, no left cut-off
   ============================ */
@media (max-width: 767px) {
  /* 1) Force the drawer to be a full-viewport layer */
  [id*="tmts-hbook-drawer"] {
    position: fixed !important;
    inset: 0 !important;                 /* top/right/bottom/left: 0 */
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    z-index: 99999 !important;
    margin: 0 !important;
    overflow: hidden !important;

    /* Default hidden state (offscreen to the right) */
    transform: translate3d(100%, 0, 0) !important;
    transition: transform .35s ease !important;
    will-change: transform;
    box-sizing: border-box !important;
  }

  /* 2) Visible state — add your “open” flag here if different */
  [id*="tmts-hbook-drawer"].open,
  [id*="tmts-hbook-drawer"].is-open,
  body.tmts-hbd-open [id*="tmts-hbook-drawer"],
  [id*="tmts-hbook-drawer"][aria-hidden="false"],
  [id*="tmts-hbook-drawer"][style*="translate3d(0"] {
    transform: translate3d(0, 0, 0) !important;
    left: 0 !important;
    right: 0 !important;
  }

  /* 3) Neutralize any inline offsets that push it left/right */
  [id*="tmts-hbook-drawer"][style*="left"],
  [id*="tmts-hbook-drawer"][style*="margin"] {
    left: 0 !important;
    margin: 0 !important;
  }

  /* 4) Content scrolls inside the drawer; add safe-area padding */
  [id*="tmts-hbook-drawer"] .tmts-hb-drawer-content {
    height: 100%;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
    box-sizing: border-box !important;
  }

  /* 5) Forms inside: no centering offsets, full width */
  [id*="tmts-hbook-drawer"] .hb-booking-search-form,
  [id*="tmts-hbook-drawer"] .hb-booking-details-form {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;               /* prevents “cramped-left” centering */
  }
}

/* ==========================================================
   HBook Buttons — Stockholm Style (primary + secondary)
   Scope: HBook forms (search + details) and the slide-in drawer
   ========================================================== */

/* -------- Shared button base (font + uppercase + spacing) -------- */
#tmts-hbook-drawer .hb-booking-search-form input[type="submit"],
#tmts-hbook-drawer .hb-booking-details-form input[type="submit"],
#tmts-hbook-drawer a.hb-select-accom,
#tmts-hbook-drawer .hb-select-accom,
.hb-booking-search-form input[type="submit"],
.hb-booking-details-form input[type="submit"],
a.hb-select-accom,
.hb-select-accom {
  font-family: "Yantramanav", "Raleway", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important; /* Stockholm stack */
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  font-size: 13px !important;          /* matches Qode small button scale */
  line-height: 1 !important;

  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  padding: 12px 22px !important;        /* compact Stockholm padding */
  border-radius: 9999px !important;     /* pill - common on Stockholm demos */
  border: 1px solid currentColor !important;

  text-decoration: none !important;
  transition: transform .2s ease, opacity .2s ease, color .2s ease, background-color .2s ease, border-color .2s ease !important;

  /* Reset any HBook inline widths */
  width: auto !important;
  max-width: 100%;
  box-sizing: border-box;
}

/* -------- Primary buttons (solid) -------- */
/* Select Accommodation + primary submits */
#tmts-hbook-drawer a.hb-select-accom,
#tmts-hbook-drawer .hb-select-accom,
#tmts-hbook-drawer .hb-booking-details-form input[type="submit"],
a.hb-select-accom,
.hb-select-accom,
.hb-booking-details-form input[type="submit"] {
  background-color: #000 !important;
  color: #fff !important;
  border-color: #000 !important;
}

/* Primary hover */
#tmts-hbook-drawer a.hb-select-accom:hover,
#tmts-hbook-drawer .hb-select-accom:hover,
#tmts-hbook-drawer .hb-booking-details-form input[type="submit"]:hover,
a.hb-select-accom:hover,
.hb-select-accom:hover,
.hb-booking-details-form input[type="submit"]:hover {
  /****** transform: translateY(-1px);  ******/
  opacity: .92;
}

/* -------- Secondary actions (underlined style) -------- */
/* Back, Cancel, Apply coupon, etc. treat as “underlined” text button per Stockholm */
#tmts-hbook-drawer .hb-back-button,
#tmts-hbook-drawer .hb-apply-coupon,
#tmts-hbook-drawer .hb-cancel,
.hb-back-button,
.hb-apply-coupon,
.hb-cancel {
  background: transparent !important;
  color: #000 !important;
  border-color: transparent !important;
  padding: 0 0 2px 0 !important;
  border-radius: 0 !important;
  position: relative;
}

/* Animated underline on hover (mirrors Qode underlined behavior) */
#tmts-hbook-drawer .hb-back-button::after,
#tmts-hbook-drawer .hb-apply-coupon::after,
#tmts-hbook-drawer .hb-cancel::after,
.hb-back-button::after,
.hb-apply-coupon::after,
.hb-cancel::after {
  content: "";
  position: absolute;
  left: 0; bottom: -2px;
  height: 2px;
  width: 100%;
  background-color: currentColor;
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform .35s cubic-bezier(.28,.38,0,.81);
}
#tmts-hbook-drawer .hb-back-button:hover::after,
#tmts-hbook-drawer .hb-apply-coupon:hover::after,
#tmts-hbook-drawer .hb-cancel:hover::after,
.hb-back-button:hover::after,
.hb-apply-coupon:hover::after,
.hb-cancel:hover::after {
  transform: scaleX(1);
}

/* Normalize element types (some are <input>, some <a>) */
.hb-booking-search-form input[type="submit"],
.hb-booking-details-form input[type="submit"] {
  cursor: pointer !important;
}

/* -------- Spacing niceties in forms (buttons only) -------- */
#tmts-hbook-drawer .hb-booking-details-form .hb-button-wrapper,
.hb-booking-details-form .hb-button-wrapper {
  margin-top: 16px !important;
}
#tmts-hbook-drawer .hb-booking-details-form input[type="submit"],
.hb-booking-details-form input[type="submit"] {
  margin-top: 6px !important;
}

/* -------- Mobile: make primary buttons easy to tap -------- */
@media (max-width: 767px) {
  #tmts-hbook-drawer .hb-booking-details-form input[type="submit"],
  #tmts-hbook-drawer a.hb-select-accom,
  #tmts-hbook-drawer .hb-select-accom,
  .hb-booking-details-form input[type="submit"],
  a.hb-select-accom,
  .hb-select-accom {
    width: 100% !important;            /* full-width inside the drawer */
  }
}


/* ==========================================================
   HBOOK + TMTS Drawer — Stockholm-style buttons (square)
   Scope: HBook forms (page + drawer) and drawer close button
   ========================================================== */

/* --- Shared base for ALL HBook primary actions (square) --- */
#tmts-hbook-drawer .hb-booking-search-form input[type="submit"],
#tmts-hbook-drawer .hb-booking-details-form input[type="submit"],
#tmts-hbook-drawer a.hb-select-accom,
#tmts-hbook-drawer .hb-select-accom,
#tmts-hbook-drawer .hb-button,
#tmts-hbook-drawer .hb-next,
#tmts-hbook-drawer .hb-next-step,
#tmts-hbook-drawer button.hb-next,
#tmts-hbook-drawer [value*="Next"],
.hb-booking-search-form input[type="submit"],
.hb-booking-details-form input[type="submit"],
a.hb-select-accom,
.hb-select-accom,
.hb-button,
.hb-next,
.hb-next-step,
button.hb-next,
input[value*="Next"] {
  font-family: "Yantramanav", "Raleway", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  font-size: 13px !important;
  line-height: 1 !important;

  display: inline-flex !important;
  align-items: center;
  justify-content: center;

  padding: 12px 20px !important;
  border-radius: 0 !important;                 /* square corners */
  border: 1px solid currentColor !important;
  width: auto !important;                      /* let content size it */
  max-width: 100% !important;
  box-sizing: border-box;

  background: #000 !important;                 /* Stockholm primary */
  color: #fff !important;
  border-color: #000 !important;
  text-decoration: none !important;
  cursor: pointer !important;

  /****  transition: transform .2s ease, opacity .2s ease, background-color .2s ease, color .2s ease, border-color .2s ease !important;  *****/
}
#tmts-hbook-drawer .hb-booking-search-form input[type="submit"]:hover,
#tmts-hbook-drawer .hb-booking-details-form input[type="submit"]:hover,
#tmts-hbook-drawer a.hb-select-accom:hover,
#tmts-hbook-drawer .hb-select-accom:hover,
#tmts-hbook-drawer .hb-button:hover,
#tmts-hbook-drawer .hb-next:hover,
#tmts-hbook-drawer .hb-next-step:hover,
#tmts-hbook-drawer button.hb-next:hover,
#tmts-hbook-drawer [value*="Next"]:hover,
.hb-booking-search-form input[type="submit"]:hover,
.hb-booking-details-form input[type="submit"]:hover,
a.hb-select-accom:hover,
.hb-select-accom:hover,
.hb-button:hover,
.hb-next:hover,
.hb-next-step:hover,
button.hb-next:hover,
input[value*="Next"]:hover {
  /**** transform: translateY(-1px);  ******/
  opacity: .92;
}

/* --- Secondary actions (Back, Cancel, Apply coupon) — underlined text button --- */
#tmts-hbook-drawer .hb-back-button,
#tmts-hbook-drawer .hb-cancel,
#tmts-hbook-drawer .hb-apply-coupon,
.hb-back-button,
.hb-cancel,
.hb-apply-coupon {
  background: transparent !important;
  color: #000 !important;
  border: 0 !important;
  padding: 0 0 2px 0 !important;
  border-radius: 0 !important;
  font-family: "Yantramanav", "Raleway", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  font-size: 12px !important;
  position: relative;
}
#tmts-hbook-drawer .hb-back-button::after,
#tmts-hbook-drawer .hb-cancel::after,
#tmts-hbook-drawer .hb-apply-coupon::after,
.hb-back-button::after,
.hb-cancel::after,
.hb-apply-coupon::after {
  content: "";
  position: absolute; left: 0; bottom: -2px;
  height: 2px; width: 100%;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform .35s cubic-bezier(.28,.38,0,.81);
}
#tmts-hbook-drawer .hb-back-button:hover::after,
#tmts-hbook-drawer .hb-cancel:hover::after,
#tmts-hbook-drawer .hb-apply-coupon:hover::after,
.hb-back-button:hover::after,
.hb-cancel:hover::after,
.hb-apply-coupon:hover::after {
  transform: scaleX(1);
}

/* --- Drawer CLOSE button (top-right) — square, matches style --- */
#tmts-hbook-drawer .tmts-hbd-close,
#tmts-hbook-drawer .tmts-hb-close,
#tmts-hbook-drawer .hb-close,
#tmts-hbook-drawer .drawer-close {
  position: absolute !important;
  top: 10px; right: 10px;
  width: 36px; height: 36px;
  display: grid; place-items: center;
  background: transparent !important;
  color: #000 !important;
  border: 1px solid #000 !important;
  border-radius: 0 !important;                 /* square */
  cursor: pointer !important;
  z-index: 100000;
  line-height: 1 !important;
  text-transform: none !important;             /* keep icon/text clean */
  font-family: "Yantramanav", "Raleway", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Arial, sans-serif !important;
  font-weight: 600 !important;
  letter-spacing: 0.02em !important;
}
#tmts-hbook-drawer .tmts-hbd-close:hover,
#tmts-hbook-drawer .tmts-hb-close:hover,
#tmts-hbook-drawer .hb-close:hover,
#tmts-hbook-drawer .drawer-close:hover {
  background: #000 !important;
  color: #fff !important;
}

/* --- Mobile: make primary actions full-width inside the drawer --- */
@media (max-width: 767px) {
  #tmts-hbook-drawer .hb-booking-details-form input[type="submit"],
  #tmts-hbook-drawer a.hb-select-accom,
  #tmts-hbook-drawer .hb-select-accom,
  #tmts-hbook-drawer .hb-next,
  #tmts-hbook-drawer .hb-next-step,
  #tmts-hbook-drawer button.hb-next,
  #tmts-hbook-drawer [value*="Next"] {
    width: 100% !important;
  }
}

/* ==========================================================
   HBOOK + TMTS Drawer — Stockholm-style buttons (outlined → solid on hover)
   Also styles the drawer CLOSE button (square)
   ========================================================== */

/* ---------- PRIMARY ACTIONS (outlined default) ---------- */
/* Scope to HBook on page + inside the drawer; cover Next/Continue variants */
.hb-booking-search-form input[type="submit"],
.hb-booking-details-form input[type="submit"],
.hb-booking-search-form .hb-button,
.hb-booking-details-form .hb-button,
a.hb-select-accom,
.hb-select-accom,
.hb-next,
.hb-next-step,
button.hb-next,
input[type="button"][value*="Next"],
input[type="submit"][value*="Next"],
#tmts-hbook-drawer .hb-booking-search-form input[type="submit"],
#tmts-hbook-drawer .hb-booking-details-form input[type="submit"],
#tmts-hbook-drawer .hb-button,
#tmts-hbook-drawer a.hb-select-accom,
#tmts-hbook-drawer .hb-select-accom,
#tmts-hbook-drawer .hb-next,
#tmts-hbook-drawer .hb-next-step,
#tmts-hbook-drawer button.hb-next,
#tmts-hbook-drawer input[type="button"][value*="Next"],
#tmts-hbook-drawer input[type="submit"][value*="Next"] {
  font-family: "Yantramanav","Raleway",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  font-size: 13px !important;
  line-height: 1 !important;

  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  padding: 12px 20px !important;

  border-radius: 0 !important;                 /* square corners */
  background: transparent !important;          /* OUTLINED default */
  color: #000 !important;
  border: 1px solid #000 !important;
  text-decoration: none !important;
  width: auto !important;
  max-width: 100% !important;
  box-sizing: border-box;

  transition: background-color .2s ease, color .2s ease, border-color .2s ease, transform .2s ease !important;
  cursor: pointer !important;
}

/* Hover → solid black; keep square */
.hb-booking-search-form input[type="submit"]:hover,
.hb-booking-details-form input[type="submit"]:hover,
.hb-booking-search-form .hb-button:hover,
.hb-booking-details-form .hb-button:hover,
a.hb-select-accom:hover,
.hb-select-accom:hover,
.hb-next:hover,
.hb-next-step:hover,
button.hb-next:hover,
input[type="button"][value*="Next"]:hover,
input[type="submit"][value*="Next"]:hover,
#tmts-hbook-drawer .hb-booking-search-form input[type="submit"]:hover,
#tmts-hbook-drawer .hb-booking-details-form input[type="submit"]:hover,
#tmts-hbook-drawer .hb-button:hover,
#tmts-hbook-drawer a.hb-select-accom:hover,
#tmts-hbook-drawer .hb-select-accom:hover,
#tmts-hbook-drawer .hb-next:hover,
#tmts-hbook-drawer .hb-next-step:hover,
#tmts-hbook-drawer button.hb-next:hover,
#tmts-hbook-drawer input[type="button"][value*="Next"]:hover,
#tmts-hbook-drawer input[type="submit"][value*="Next"]:hover {
  background: #000 !important;
  color: #fff !important;
  border-color: #000 !important;
  /**** transform: translateY(-1px);   *****/
}

/* Disabled state stays outlined but muted */
.hb-booking-search-form input[type="submit"][disabled],
.hb-booking-details-form input[type="submit"][disabled],
#tmts-hbook-drawer .hb-booking-details-form input[type="submit"][disabled] {
  opacity: .5 !important;
  cursor: not-allowed !important;
  transform: none !important;
}

/* ---------- SECONDARY ACTIONS (underlined text button) ---------- */
.hb-back-button,
.hb-cancel,
.hb-apply-coupon,
#tmts-hbook-drawer .hb-back-button,
#tmts-hbook-drawer .hb-cancel,
#tmts-hbook-drawer .hb-apply-coupon {
  background: transparent !important;
  color: #000 !important;
  border: 0 !important;
  padding: 0 0 2px 0 !important;
  border-radius: 0 !important;
  font-family: "Yantramanav","Raleway",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-weight: 600 !important;
  text-transform: uppercase !important;
  letter-spacing: 0.12em !important;
  font-size: 12px !important;
  position: relative;
}
.hb-back-button::after,
.hb-cancel::after,
.hb-apply-coupon::after,
#tmts-hbook-drawer .hb-back-button::after,
#tmts-hbook-drawer .hb-cancel::after,
#tmts-hbook-drawer .hb-apply-coupon::after {
  content: "";
  position: absolute; left: 0; bottom: -2px;
  height: 2px; width: 100%;
  background: currentColor;
  transform: scaleX(0);
  transform-origin: 0 50%;
  transition: transform .35s cubic-bezier(.28,.38,0,.81);
}
.hb-back-button:hover::after,
.hb-cancel:hover::after,
.hb-apply-coupon:hover::after,
#tmts-hbook-drawer .hb-back-button:hover::after,
#tmts-hbook-drawer .hb-cancel:hover::after,
#tmts-hbook-drawer .hb-apply-coupon:hover::after {
  transform: scaleX(1);
}

/* ---------- DRAWER CLOSE BUTTON (square outlined) ---------- */
/* Cover common classnames + aria-label, and override inline styles */
#tmts-hbook-drawer .tmts-hbd-close,
#tmts-hbook-drawer .tmts-hb-close,
#tmts-hbook-drawer .hb-close,
#tmts-hbook-drawer .drawer-close,
#tmts-hbook-drawer [aria-label="Close"],
#tmts-hbook-drawer [class*="close"] {
  position: absolute !important;
  top: 10px; right: 10px;
  width: 36px; height: 36px;
  display: grid; place-items: center;
  background: transparent !important;
  color: #000 !important;
  border: 1px solid #000 !important;
  border-radius: 0 !important;                 /* square */
  cursor: pointer !important;
  z-index: 100000;
  line-height: 1 !important;
  text-transform: none !important;
  padding: 0 !important;
}

/* Hover → solid black */
#tmts-hbook-drawer .tmts-hbd-close:hover,
#tmts-hbook-drawer .tmts-hb-close:hover,
#tmts-hbook-drawer .hb-close:hover,
#tmts-hbook-drawer .drawer-close:hover,
#tmts-hbook-drawer [aria-label="Close"]:hover,
#tmts-hbook-drawer [class*="close"]:hover {
  background: #000 !important;
  color: #fff !important;
  border-color: #000 !important;
}

/* If the close is an SVG icon, ensure it inverts on hover */
#tmts-hbook-drawer [class*="close"] svg,
#tmts-hbook-drawer [aria-label="Close"] svg {
  width: 18px; height: 18px;
  stroke: currentColor;
  fill: none;
  stroke-width: 2;
}

/* ==========================================================
   1) Drawer CLOSE button — restore original (left) position
   ========================================================== */
#tmts-hbook-drawer .tmts-hbd-close,
#tmts-hbook-drawer .tmts-hb-close,
#tmts-hbook-drawer .hb-close,
#tmts-hbook-drawer .drawer-close,
#tmts-hbook-drawer [aria-label="Close"],
#tmts-hbook-drawer [class*="close"] {
  left: 10px !important;      /* back to original side */
  right: auto !important;     /* undo previous right pin */
  top: 10px !important;
}

/* ==========================================================
   2) “Next” button — remove double outline (keep 1px border)
   ========================================================== */
.hb-next,
.hb-next-step,
button.hb-next,
input[type="button"][value*="Next"],
input[type="submit"][value*="Next"],
#tmts-hbook-drawer .hb-next,
#tmts-hbook-drawer .hb-next-step,
#tmts-hbook-drawer button.hb-next,
#tmts-hbook-drawer input[type="button"][value*="Next"],
#tmts-hbook-drawer input[type="submit"][value*="Next"] {
  outline: none !important;         /* kill browser outline */
  box-shadow: none !important;      /* kill theme focus halo */
  -webkit-appearance: none;         /* avoid iOS extra ring */
  border-width: 1px !important;     /* keep single 1px border */
}

.hb-next:focus,
.hb-next-step:focus,
button.hb-next:focus,
input[type="button"][value*="Next"]:focus,
input[type="submit"][value*="Next"]:focus,
#tmts-hbook-drawer .hb-next:focus,
#tmts-hbook-drawer .hb-next-step:focus,
#tmts-hbook-drawer button.hb-next:focus,
#tmts-hbook-drawer input[type="button"][value*="Next"]:focus,
#tmts-hbook-drawer input[type="submit"][value*="Next"]:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* ==========================================================
   3) Guest field text — force black
   (adults/children selects in search/details forms + drawer)
   ========================================================== */
.hb-booking-search-form .hb-people-wrapper-adults select,
.hb-booking-search-form .hb-people-wrapper-children select,
.hb-booking-details-form .hb-people-wrapper-adults select,
.hb-booking-details-form .hb-people-wrapper-children select,
#tmts-hbook-drawer .hb-people-wrapper-adults select,
#tmts-hbook-drawer .hb-people-wrapper-children select,
#tmts-hbook-drawer select[name*="adults"],
#tmts-hbook-drawer select[name*="children"] {
  color: #000 !important;
}

/* If your guest field is an <input> rather than <select>, cover it too */
.hb-booking-search-form [name*="adults"],
.hb-booking-search-form [name*="children"],
.hb-booking-details-form [name*="adults"],
.hb-booking-details-form [name*="children"],
#tmts-hbook-drawer [name*="adults"],
#tmts-hbook-drawer [name*="children"] {
  color: #000 !important;
}


/* ================================================
   1) NEXT button — remove the OUTER outline/halo
   ================================================ */

/* Kill outlines/halos on Next across input/button/anchor variants */
.hb-next,
.hb-next-step,
button.hb-next,
input[type="button"][value*="Next"],
input[type="submit"][value*="Next"],
#tmts-hbook-drawer .hb-next,
#tmts-hbook-drawer .hb-next-step,
#tmts-hbook-drawer button.hb-next,
#tmts-hbook-drawer input[type="button"][value*="Next"],
#tmts-hbook-drawer input[type="submit"][value*="Next"] {
  outline: none !important;
  box-shadow: none !important;
  -webkit-appearance: none;
}

/* Some themes add focus rings via :focus / :focus-visible */
.hb-next:focus,
.hb-next:focus-visible,
.hb-next-step:focus,
button.hb-next:focus,
button.hb-next:focus-visible,
input[type="button"][value*="Next"]:focus,
input[type="submit"][value*="Next"]:focus,
#tmts-hbook-drawer .hb-next:focus,
#tmts-hbook-drawer .hb-next:focus-visible,
#tmts-hbook-drawer .hb-next-step:focus,
#tmts-hbook-drawer button.hb-next:focus,
#tmts-hbook-drawer button.hb-next:focus-visible,
#tmts-hbook-drawer input[type="button"][value*="Next"]:focus,
#tmts-hbook-drawer input[type="submit"][value*="Next"]:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* If the wrapper around Next had its own border/outline, nuke it */
.hb-booking-details-form .hb-button-wrapper,
#tmts-hbook-drawer .hb-booking-details-form .hb-button-wrapper,
.hb-booking-details-form .hb-form-buttons,
#tmts-hbook-drawer .hb-booking-details-form .hb-form-buttons {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* Keep a single 1px border on the button itself (outlined style) */
.hb-next,
.hb-next-step,
button.hb-next,
input[type="button"][value*="Next"],
input[type="submit"][value*="Next"],
#tmts-hbook-drawer .hb-next,
#tmts-hbook-drawer .hb-next-step,
#tmts-hbook-drawer button.hb-next,
#tmts-hbook-drawer input[type="button"][value*="Next"],
#tmts-hbook-drawer input[type="submit"][value*="Next"] {
  border-width: 1px !important;
}

/* ================================================
   2) Give SEARCH FORM 10px space below close button
   3) Align CLOSE button with form’s inner padding
   ================================================ */

/* Align close button with drawer content padding (desktop) */
#tmts-hbook-drawer .tmts-hbd-close,
#tmts-hbook-drawer .tmts-hb-close,
#tmts-hbook-drawer .hb-close,
#tmts-hbook-drawer .drawer-close,
#tmts-hbook-drawer [aria-label="Close"],
#tmts-hbook-drawer [class*="close"] {
  top: 10px !important;
  left: 16px !important;   /* match content padding on desktop */
  right: auto !important;
}

/* Drawer content: add top padding = close(36px) + 10px gap */
#tmts-hbook-drawer .tmts-hb-drawer-content {
  padding-top: 46px !important;  /* 36px button + 10px space */
}

/* Mobile: align to mobile padding used in drawer and keep 10px gap */
@media (max-width: 767px) {
  #tmts-hbook-drawer .tmts-hbd-close,
  #tmts-hbook-drawer .tmts-hb-close,
  #tmts-hbook-drawer .hb-close,
  #tmts-hbook-drawer .drawer-close,
  #tmts-hbook-drawer [aria-label="Close"],
  #tmts-hbook-drawer [class*="close"] {
    left: 12px !important;   /* match mobile content padding */
    right: auto !important;
  }
  #tmts-hbook-drawer .tmts-hb-drawer-content {
    padding-top: 46px !important; /* keep close(36) + 10 gap on phones */
  }
}

/* ================================================
   Make NEXT match PREVIOUS (square, outlined)
   and remove double outline/halo
   ================================================ */

/* 0) Remove any wrapper borders/halos that add a second outline */
.hb-booking-details-form .hb-button-wrapper,
.hb-booking-details-form .hb-form-buttons,
#tmts-hbook-drawer .hb-booking-details-form .hb-button-wrapper,
#tmts-hbook-drawer .hb-booking-details-form .hb-form-buttons {
  border: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* 1) Normalize PREVIOUS (so we can match it) */
.hb-previous,
.hb-prev,
button.hb-previous,
button.hb-prev,
input[type="button"][value*="Previous"],
input[type="submit"][value*="Previous"] {
  border-radius: 0 !important;
  background: transparent !important;
  color: #000 !important;
  border: 1px solid #000 !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  font-family: "Yantramanav","Raleway",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  padding: 12px 20px !important;
  display: inline-flex !important;
  align-items: center; justify-content: center;
  text-decoration: none !important;
  outline: none !important;
  box-shadow: none !important;
}

/* 2) Make NEXT identical to PREVIOUS (same base styles) */
.hb-next,
.hb-next-step,
button.hb-next,
input[type="button"][value*="Next"],
input[type="submit"][value*="Next"],
#tmts-hbook-drawer .hb-next,
#tmts-hbook-drawer .hb-next-step,
#tmts-hbook-drawer button.hb-next,
#tmts-hbook-drawer input[type="button"][value*="Next"],
#tmts-hbook-drawer input[type="submit"][value*="Next"] {
  border-radius: 0 !important;
  background: transparent !important;     /* outlined by default */
  color: #000 !important;
  border: 1px solid #000 !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  font-family: "Yantramanav","Raleway",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
  font-weight: 600 !important;
  font-size: 13px !important;
  line-height: 1 !important;
  padding: 12px 20px !important;
  display: inline-flex !important;
  align-items: center; justify-content: center;
  text-decoration: none !important;

  /* kill the “outer” outline/halo */
  outline: none !important;
  box-shadow: none !important;
  -webkit-appearance: none;
}

/* 3) Hover state for both: turn solid black (Stockholm behavior) */
.hb-previous:hover,
.hb-prev:hover,
button.hb-previous:hover,
button.hb-prev:hover,
input[type="button"][value*="Previous"]:hover,
input[type="submit"][value*="Previous"]:hover,
.hb-next:hover,
.hb-next-step:hover,
button.hb-next:hover,
input[type="button"][value*="Next"]:hover,
input[type="submit"][value*="Next"]:hover,
#tmts-hbook-drawer .hb-next:hover,
#tmts-hbook-drawer .hb-next-step:hover,
#tmts-hbook-drawer button.hb-next:hover,
#tmts-hbook-drawer input[type="button"][value*="Next"]:hover,
#tmts-hbook-drawer input[type="submit"][value*="Next"]:hover {
  background: #000 !important;
  color: #fff !important;
  border-color: #000 !important;
  /***** transform: translateY(-1px);   *****/
}

/* 4) Focus states: keep clean (no double ring) */
.hb-previous:focus, .hb-prev:focus,
button.hb-previous:focus, button.hb-prev:focus,
input[type="button"][value*="Previous"]:focus,
input[type="submit"][value*="Previous"]:focus,
.hb-next:focus, .hb-next-step:focus,
button.hb-next:focus,
input[type="button"][value*="Next"]:focus,
input[type="submit"][value*="Next"]:focus,
#tmts-hbook-drawer .hb-next:focus,
#tmts-hbook-drawer .hb-next-step:focus,
#tmts-hbook-drawer button.hb-next:focus,
#tmts-hbook-drawer input[type="button"][value*="Next"]:focus,
#tmts-hbook-drawer input[type="submit"][value*="Next"]:focus {
  outline: none !important;
  box-shadow: none !important;
}

/* NEXT wrapper adds an extra border — remove it entirely */
.hb-step-button.hb-button-wrapper.hb-next-step,
.hb-step-button.hb-button-wrapper.hb-next-step-1 {
  border: 0 !important;
  outline: none !important;
  box-shadow: none !important;
  background: transparent !important;
  padding: 0 !important;
  margin: 0 !important;
  /* some themes draw pseudo-element lines on buttons */
  position: static !important;
}
.hb-step-button.hb-button-wrapper.hb-next-step::before,
.hb-step-button.hb-button-wrapper.hb-next-step::after,
.hb-step-button.hb-button-wrapper.hb-next-step-1::before,
.hb-step-button.hb-button-wrapper.hb-next-step-1::after {
  content: none !important;
}

/* Keep ONE outlined border on the actual NEXT input */
.hb-step-button.hb-next-step input[type="submit"],
.hb-step-button.hb-next-step-1 input[type="submit"] {
  border: 1px solid #000 !important;
  background: transparent !important;
  color: #000 !important;
  border-radius: 0 !important;
  padding: 12px 20px !important;
  text-transform: uppercase !important;
  letter-spacing: .12em !important;
  font-weight: 600 !important;
  font-family: "Yantramanav","Raleway",-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;

  outline: none !important;           /* kill browser focus halo */
  box-shadow: none !important;        /* kill theme focus halo */
  -webkit-appearance: none;           /* iOS */
}

/* Hover → solid (Stockholm behavior) */
.hb-step-button.hb-next-step input[type="submit"]:hover,
.hb-step-button.hb-next-step-1 input[type="submit"]:hover {
  background: #000 !important;
  color: #fff !important;
  border-color: #000 !important;
  /***** transform: translateY(-1px);   ******/
}

/* Firefox inner focus ring on button-like inputs */
.hb-step-button.hb-next-step input[type="submit"]::-moz-focus-inner,
.hb-step-button.hb-next-step-1 input[type="submit"]::-moz-focus-inner {
  border: 0 !important;
  padding: 0 !important;
}

/* ---- Scope: only inside HBook forms/lists (page + drawer) ---- */
.hb-booking-search-form, .hb-booking-details-form, .hb-accom-list,
#tmts-hbook-drawer .hb-booking-search-form,
#tmts-hbook-drawer .hb-booking-details-form {
  /* 1) Kill borders/halos on any *container* that could surround buttons */
}
.hb-booking-search-form p,
.hb-booking-search-form div,
.hb-booking-details-form p,
.hb-booking-details-form div,
.hb-accom-list p,
.hb-accom-list div,
#tmts-hbook-drawer .hb-booking-search-form p,
#tmts-hbook-drawer .hb-booking-search-form div,
#tmts-hbook-drawer .hb-booking-details-form p,
#tmts-hbook-drawer .hb-booking-details-form div {
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background-image: none !important; /* catches decorative gradients */
}

/* 2) Specifically target the known wrappers around Select / Next / Previous */
p.hb-button-wrapper,
p.hb-step-button,
p.hb-select-accom,
p.hb-view-accom,
#tmts-hbook-drawer p.hb-button-wrapper,
#tmts-hbook-drawer p.hb-step-button,
#tmts-hbook-drawer p.hb-select-accom,
#tmts-hbook-drawer p.hb-view-accom {
  margin: 0 !important;
  padding: 0 !important;
  border: 0 !important;
  outline: 0 !important;
  box-shadow: none !important;
  background: transparent !important;
}

/* 3) Some themes draw borders/lines via ::before/::after on wrappers */
.hb-booking-search-form p::before,
.hb-booking-search-form p::after,
.hb-booking-details-form p::before,
.hb-booking-details-form p::after,
.hb-accom-list p::before,
.hb-accom-list p::after,
#tmts-hbook-drawer .hb-booking-search-form p::before,
#tmts-hbook-drawer .hb-booking-search-form p::after,
#tmts-hbook-drawer .hb-booking-details-form p::before,
#tmts-hbook-drawer .hb-booking-details-form p::after {
  content: none !important;
}

/* 4) Ensure the actual buttons keep their single 1px outline */
.hb-booking-search-form input[type="submit"],
.hb-booking-details-form input[type="submit"],
a.hb-select-accom, .hb-select-accom,
.hb-next, .hb-next-step, .hb-prev, .hb-previous-step {
  border: 1px solid #000 !important;
  background: transparent !important;
  color: #000 !important;
  border-radius: 0 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Left-align ONLY the message + button inside its own container */
#tmts-hb-drawer-inner .hb-accom-desc {
  text-align: left !important;   /* beats parent text-align:center */
  align-self: flex-start;         /* if parent is flex */
  justify-self: start;            /* if parent is grid */
  margin: 0 !important;           /* kill any auto-centering margins */
}

/* Ensure the “Next →” wrapper + button also hug the left */
#tmts-hb-drawer-inner .hb-accom-desc .hb-step-button {
  text-align: left !important;
}
#tmts-hb-drawer-inner .hb-accom-desc .hb-step-button input[type="submit"] {
  display: inline-block;
  margin-left: 0 !important;
  margin-right: auto !important;
}

/* TMTS — Reservation Summary: one item per line + wrapping */
.hb-summary-wrapper .hb-resa-summary-content { 
  display: block !important;
  white-space: normal !important;
}

.hb-summary-wrapper .hb-resa-summary-details {
  display: block !important;        /* kill flex if applied */
  flex-wrap: wrap !important;
}

.hb-summary-wrapper .hb-resa-summary-details > div {
  display: block !important;         /* each detail on its own line */
  white-space: normal !important;    /* allow wrap */
  line-height: 1.6;
  margin-bottom: 6px;
  float: none !important;
  clear: both;
}

/* Accommodation block below details */
.hb-summary-wrapper .hb-summary-accom-wrapper {
  display: block !important;
  margin-top: 10px;
  padding-top: 8px;
  border-top: 1px solid rgba(0,0,0,0.1);
}
.hb-summary-wrapper .hb-summary-accom-wrapper > div,
.hb-summary-wrapper .hb-summary-price-details > div {
  display: block !important;
  white-space: normal !important;
  line-height: 1.6;
  margin-bottom: 4px;
}

/* Safety: don’t force spans inline-block/nowrap */
.hb-summary-wrapper .hb-resa-summary-content span {
  display: inline;
  white-space: normal !important;
  word-break: normal;
  overflow-wrap: anywhere;
}

/**************************************************************************************/
/* === BOOKNOW SEARCH FORM: Target first 3 fields + submit button === */

#booknow-search-form p.hb-check-dates-wrapper input.hb-input-datepicker {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  width: 100%;
  padding: 0 0 5px 0;
  font-family: 'Yantramanav', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  box-sizing: border-box;
}


#booknow-search-form p.hb-check-dates-wrapper input.hb-input-datepicker::placeholder {
  color: rgba(0, 0, 0, 0.6);
}

/* 2️⃣ Guests (Adults) select field */

#booknow-search-form p.hb-people-wrapper-adults select.hb-adults {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  width: 100%;
  padding: 0 0 5px 0;
  font-family: 'Yantramanav', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  -webkit-appearance: none !important;
}
#booknow-search-form p.hb-people-wrapper-adults select.hb-adults option {
  color: #000 !important;
}


/* ==========================================================
   BOOK NOW PAGE — Scoped to body.page-id-6552
   Prevents bleed into booking drawer
   ========================================================== */

body.page-id-6552 #booknow-search-form p.hb-check-dates-wrapper input.hb-input-datepicker {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  width: 100%;
  padding: 0 0 5px 0;
  font-family: 'Yantramanav', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  box-sizing: border-box;
}

body.page-id-6552 #booknow-search-form p.hb-check-dates-wrapper input.hb-input-datepicker::placeholder {
  color: rgba(0, 0, 0, 0.6);
}

/* Guests field */
body.page-id-6552 #booknow-search-form p.hb-people-wrapper-adults select.hb-adults {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  width: 100%;
  padding: 0 0 5px 0;
  font-family: 'Yantramanav', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  -webkit-appearance: none !important;
}

body.page-id-6552 #booknow-search-form p.hb-people-wrapper-adults select.hb-adults option {
  color: #000 !important;
}

/* Availability button */
body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"] {
  border: 1px solid #000 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #000 !important;
  padding: 10px 18px;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hover effect */
body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"]:hover {
  background-color: #000 !important;
  color: #fff !important;
}

/* Layout for form containers */
body.page-id-6552 #booknow-search-form .hb-search-fields,
body.page-id-6552 #booknow-search-form form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

/* Field width control */
body.page-id-6552 #booknow-search-form form > p {
  flex: 1 1 220px;
  min-width: 220px;
}

/* Responsive fix */
@media (max-width: 767px) {
  body.page-id-6552 #booknow-search-form .hb-search-fields,
  body.page-id-6552 #booknow-search-form form {
    flex-direction: column;
    align-items: stretch;
  }

  body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"] {
    width: 100%;
    max-width: 200px;
    margin: 0 auto;
  }
}
/* same as inputs */
}

/* Ensure dropdown items render in the same color */
body.page-id-6552 #booknow-search-form p.hb-people-wrapper-adults select.hb-adults option {
  color: #000 !important;
}

/* If you use a disabled/placeholder option (e.g., "Guests"), keep it readable */
body.page-id-6552 #booknow-search-form p.hb-people-wrapper-adults select.hb-adults:invalid {
  color: #000 !important;
}



/* 3️⃣ Submit (“Availability”) button */
/**** RP Uncomment to display single underline field

#booknow-search-form p.hb-search-submit-wrapper input[type="submit"] {
  background: transparent !important;
  color: #000 !important;
  border: none !important;
  font-size: 14px;
  font-weight: 500;
  letter-spacing: 2px;
  text-transform: uppercase;
  padding: 0 25px;
  cursor: pointer;
  position: relative;
}
*****/

/* Add a subtle underline animation */
/**** 
#booknow-search-form p.hb-search-submit-wrapper {
  position: relative;
  display: inline-flex;
  align-items: flex-end;
  justify-content: center;
}

#booknow-search-form p.hb-search-submit-wrapper::before,
#booknow-search-form p.hb-search-submit-wrapper::after {
  content: "";
  position: absolute;
  bottom: 0;
  height: 2px;
  background-color: #000;
  left: 50%;
  transform: translateX(-50%);
  width: calc(100% - 40px);
  transition: transform 0.4s cubic-bezier(.28,.38,0,.81);
}

#booknow-search-form p.hb-search-submit-wrapper::after {
  transform: translateX(-50%) scaleX(0);
  transform-origin: 0 50%;
  transition-delay: 0.25s;
}

#booknow-search-form p.hb-search-submit-wrapper:hover::after {
  transform: translateX(-50%) scaleX(1);
}

#booknow-search-form p.hb-search-submit-wrapper:hover::before {
  transform: translateX(-50%) scaleX(0);
}

*****/

/* ==========================================================
   BOOK NOW PAGE — Scoped to body.page-id-6552
   Prevents bleed into booking drawer
   ========================================================== */

body.page-id-6552 #booknow-search-form p.hb-check-dates-wrapper input.hb-input-datepicker {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  width: 100%;
  padding: 0 0 5px 0;
  font-family: 'Yantramanav', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  box-sizing: border-box;
}

body.page-id-6552 #booknow-search-form p.hb-check-dates-wrapper input.hb-input-datepicker::placeholder {
  color: rgba(0, 0, 0, 0.6);
}

/* Guests field */
body.page-id-6552 #booknow-search-form p.hb-people-wrapper-adults select.hb-adults {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  width: 100%;
  padding: 0 0 5px 0;
  font-family: 'Yantramanav', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  -webkit-appearance: none !important;
}

body.page-id-6552 #booknow-search-form p.hb-people-wrapper-adults select.hb-adults option {
  color: #000 !important;
}

/* Availability button */
body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"] {
  border: 1px solid #000 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #000 !important;
  padding: 10px 18px;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hover effect */
body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"]:hover {
  background-color: #000 !important;
  color: #fff !important;
}

/* Layout for form containers */
body.page-id-6552 #booknow-search-form .hb-search-fields,
body.page-id-6552 #booknow-search-form form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

/* Field width control */
body.page-id-6552 #booknow-search-form form > p {
  flex: 1 1 220px;
  min-width: 220px;
}

/* Responsive fix */
@media (max-width: 767px) {
  body.page-id-6552 #booknow-search-form .hb-search-fields,
  body.page-id-6552 #booknow-search-form form {
    flex-direction: column;
    align-items: stretch;
  }

  body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"] {
    width: 100%;
    max-width: 200px;
    margin: 0 auto;
  }
}

/* Book Now – Availability button (scoped) */
body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"] {
  border: 1px solid #000 !important;   /* thin black outline */
  border-radius: 0 !important;         /* square corners */
  background: transparent !important;  /* keeps current background */
  color: #000 !important;              /* text color stays black */
  padding: 10px 18px;                  /* consistent button spacing */
  transition: background-color 0.3s ease, color 0.3s ease;
}


/* === HBook Availability Grid — Standard Grid and Card Styles (FINAL STABLE VERSION) === */

/* === COLUMN LAYOUT CONTROL: FORCED COLUMNS === */

/* 1. GRID CONTAINER DEFINITION (Desktop: Always 3 Columns) */
.hb-accom-list .hb-multi-accom-choices {
  display: grid !important;
  /* FORCES 3 COLUMNS: Use 1fr to make them equal width. */
  grid-template-columns: repeat(3, 1fr) !important; 
  gap: 40px !important;
  align-items: start !important;
}

/* 2. Tablet Layout (Up to 1024px): Force 2 Columns */
@media (max-width: 1024px) {
  .hb-accom-list .hb-multi-accom-choices {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}

/* 3. Mobile Layout (Up to 767px): Force 1 Column */
@media (max-width: 767px) {
  .hb-accom-list .hb-multi-accom-choices {
    grid-template-columns: repeat(1, 1fr) !important;
  }
}


/* 2. INDIVIDUAL CARD CONTAINER (Styling & Context) */
.hb-accom-list .hb-multi-accom-choices .hb-accom {
  background: none !important;
  border: none !important;
  box-shadow: none !important;
  transition: transform 0.25s ease !important;
  padding: 0 !important;
  margin: 0 !important;
  height: auto !important;
  position: relative !important; 
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  text-align: center !important;
}

/* --- 3. IMAGE ASPECT RATIO & AGGRESSIVE CLEANUP --- */
.hb-image-ratio-wrapper {
    position: relative !important;
    width: 100% !important;
    /* 4:3 Aspect Ratio (100 / 75 = 133.33%) */
    padding-top: 133.33% !important; 
    height: 0 !important;
    overflow: hidden !important;
    z-index: 2 !important; /* Image sits highest */
    line-height: 0 !important; /* Kills browser's text baseline gap */
}

/* CRITICAL FIX: Aggressively eliminate ALL spacing on ALL image elements */
.hb-image-ratio-wrapper a, 
.hb-image-ratio-wrapper *, 
.hb-image-ratio-wrapper img,
.hb-accom-list .hb-accom img {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 0 !important;
    display: block !important; /* Fixes image baseline gap */
    margin-bottom: 0 !important; /* Guarantees margin is gone */
}

/* Positioning the image correctly inside the wrapper */
.hb-image-ratio-wrapper img {
    position: absolute !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 100% !important;
    object-fit: cover !important;
}

/* --- 4. CONTENT WRAPPER (STABLE OVERLAP) --- */
.hb-accom-list .hb-multi-accom-choices .hb-accom .hb-accom-content-wrapper {
  background: white !important; 
  /*  background: transparent !important; */
  padding: 20px !important;
  width: 100% !important;
  box-sizing: border-box !important;
  
  /* STABLE OVERLAP: -40px is sufficient to close the tiny remaining browser gap */
  margin-top: 0px !important; 
  z-index: 1 !important; /* Content is below the image */
  
  height: auto !important; 
  display: flex !important;
  flex-direction: column !important;
  justify-content: space-between !important;
}
/***************************************/



/*
.hb-accom-list .hb-multi-accom-choices .hb-accom:hover {
  transform: translateY(-3px) !important;
}

*/



/* RP Top Info - Targeting only row-1 */
.tms-card-topinfo.row-1 {
  font-size: 13px !important;
  color: #666 !important;
  margin-top: 4px !important;

  /* Set the container width and center the block itself */
  width: 90% !important;
  margin-left: auto !important;
  margin-right: auto !important;

  /* --- MODIFIED FLEX PROPERTY HERE --- */
  display: flex !important;
  flex-wrap: nowrap !important;
  justify-content: space-around !important; /* This will create space between the items */
  align-items: center !important; 
  text-align: center !important; 
}

/* Title & text */
.hb-accom-list .hb-accom-title a {
  /* Custom Font Properties to match Stockholm H6*/
  font-family: "Yantramanav", sans-serif !important;
  font-weight: 500 !important;
  font-style: normal !important;

  /* Text Size, Spacing, and Appearance */
  font-size: 12px !important;
  line-height: 20px !important;
  letter-spacing: 3.7px !important;
  text-transform: uppercase !important;

  /* Color */
  color: #000000 !important; /* Black text color */

  /* Block-level display and spacing resets (to behave like a heading) */
  text-decoration: none !important;
  display: block !important;
  margin: 1rem 0 0 0 !important;
  padding: 0 !important;
}

.hb-accom-list .hb-accom-desc {
  font-family: "Yantramanav", sans-serif !important;
  font-size: 14px !important;
  color: #666 !important;
  margin: 5px 0 10px !important;
}

/* Price area */
.hb-accom-list .hb-accom-price-total {
  font-family: "Yantramanav", sans-serif !important;
  font-size: 16px !important;
  color: #000 !important;
  margin-bottom: 8px !important;
  display: flex;
  align-items: center; /* ALIGNMENT CHANGE: This centers the price and caption vertically. */
  
  /* --- MODIFIED: Reduce the gap between the price and the nights message --- */
  gap: 0px !important; /* Forces a 2-pixel space between children */
}


/* 1. Target the outermost row containing the price and the breakdown */
.content-row.row-3 {
    /* Set to Flex to gain control over alignment */
    display: flex !important;
    
    /* Center all content (children) horizontally */
    justify-content: center !important; 
    
    /* Ensure content stacks vertically if needed (breakdown below the price) */
    flex-direction: column !important;
    
    /* Align individual items in the center (useful for centering the content block itself) */
    align-items: center !important;
}

/* 2. OPTIONAL CLEANUP for the price breakdown paragraph */
/* Ensure the horizontal margins don't interfere with the centering logic */
.hb-accom-list .hb-price-breakdown {
    /* Use 'auto' horizontal margins to help center the block if it has a defined width */
    margin-left: auto !important; 
    margin-right: auto !important;
}

.hb-accom-list .hb-accom-price-caption {
  font-size: 13px !important;
  color: #666 !important;
  margin-top: 4px !important;
  text-align: center !important;
}

/* "View price breakdown" link */
.hb-accom-list .hb-view-price-breakdown a,
.hb-accom-list .hb-view-price-breakdown {
  font-size: 13px !important;
  color: #000 !important;
  text-decoration: underline !important;
  cursor: pointer !important;
  transition: color 0.3s ease !important;
}

.hb-accom-list .hb-view-price-breakdown:hover {
  color: #666 !important;
}

/* Expanded breakdown */
.hb-accom-list .hb-price-breakdown {
  font-family: "Yantramanav", sans-serif !important;
  font-size: 13px !important;
  line-height: 1.4 !important;
  color: #444 !important;
  text-align: left !important;
  background: rgba(0, 0, 0, 0.03) !important;
  border-radius: 6px !important;
  padding: 8px 12px !important;
  margin: 10px 15px !important;
}



/* Apply shared font and color styles to the nights text and the toggle link */
.tms-nights-row .hb-nights-text,
.tms-nights-row .hb-view-price-breakdown {
  font-size: 13px !important; /* Matches row-1 font size */
  color: #666 !important;     /* Matches row-1 text color */
  text-decoration: none !important; /* Ensure the link is styled properly */
}

/* Ensure the chevrons/icons also adopt the same color */
.tms-nights-row .hb-view-price-breakdown i {
  color: #666 !important;
}

/* Cleanup: Remove any existing dedicated styling for the text that might conflict */
.hb-accom-list .hb-accom-price-caption {
  margin-top: 0 !important; /* Remove this from the old rule if it exists */
  /* Remove other conflicting text styles here if needed */
}


/* Buttons */
.hb-accom-list .hb-select-accom-wrapper {
  display: flex !important;
  justify-content: center !important;
  gap: 10px !important;
  margin-top: 15px !important;
}

.hb-accom-list .hb-select-accom-wrapper input[type="submit"] {
  background: transparent !important;
  color: #000 !important;
  border: 1px solid #000 !important;
  padding: 0 10 0px !important;
  border-radius: 0px !important;
  cursor: pointer !important;
  font-size: 14px !important;
  line-height: 54px;
  font-style: normal;
  letter-spacing: 3.7px !important;
  transition: all 0.3s ease !important;
  font-family: "Yantramanav", sans-serif !important;
  font-weight: 500;
  margin-bottom: 10px !important;
  text-transform: uppercase;
}





.hb-accom-list .hb-select-accom-wrapper input[type="submit"]:hover {
  background: #000 !important;
  color: #fff !important;
}

/* ==========================================================
   BOOK NOW (page-id-8016) — Unify Check-in / Check-out / Guests
   ========================================================== */
body.page-id-8016 .hb-booking-search-form input.hb-input-datepicker,
body.page-id-8016 .hb-booking-search-form p.hb-people-wrapper select,
body.page-id-8016 .hb-booking-search-form p.hb-accom-number-wrapper select {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;

  font-family: 'Yantramanav', sans-serif !important;
  font-size: 12px !important;
  letter-spacing: 4px !important;
  text-transform: uppercase !important;

  padding: 0 0 6px 0 !important;
  line-height: 1.2 !important;
  height: auto !important;
  min-height: 28px !important;
  box-shadow: none !important;

  -webkit-appearance: none !important;
  appearance: none !important;
}

/* Placeholder color for date fields */
body.page-id-8016 .hb-booking-search-form input.hb-input-datepicker::placeholder {
  color: rgba(0,0,0,0.7) !important;
}

/* Dropdown items (Guests/Children/Accom number) */
body.page-id-8016 .hb-booking-search-form select option {
  color: #000 !important;
  background: #fff !important;
  font-family: 'Yantramanav', sans-serif !important;
  font-size: 12px !important;
  letter-spacing: 4px !important;
  text-transform: uppercase !important;
}

/* Enhanced selects (HBook’s Selectize.js) */
body.page-id-8016 .hb-booking-search-form .selectize-control.single .selectize-input {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;

  font-family: 'Yantramanav', sans-serif !important;
  font-size: 12px !important;
  letter-spacing: 4px !important;
  text-transform: uppercase !important;

  padding: 0 0 6px 0 !important;
  line-height: 1.2 !important;
  min-height: 28px !important;
  box-shadow: none !important;
}
body.page-id-8016 .hb-booking-search-form .selectize-input input {
  color: #000 !important;
  -webkit-text-fill-color: #000 !important;
}
body.page-id-8016 .hb-booking-search-form .selectize-dropdown .option {
  color: #000 !important;
  background: #fff !important;
  font-family: 'Yantramanav', sans-serif !important;
  font-size: 12px !important;
  letter-spacing: 4px !important;
  text-transform: uppercase !important;
}
body.page-id-8016 .hb-booking-search-form .selectize-dropdown .option.active {
  background: #f1f2f3 !important;
  color: #000 !important;
}

/* ==========================================================
   BOOK NOW PAGE — Scoped to body.page-id-6552
   Prevents bleed into booking drawer
   ========================================================== */

body.page-id-6552 #booknow-search-form p.hb-check-dates-wrapper input.hb-input-datepicker {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  width: 100%;
  padding: 0 0 5px 0;
  font-family: 'Yantramanav', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  box-sizing: border-box;
}

body.page-id-6552 #booknow-search-form p.hb-check-dates-wrapper input.hb-input-datepicker::placeholder {
  color: rgba(0, 0, 0, 0.6);
}

/* Guests field */
body.page-id-6552 #booknow-search-form p.hb-people-wrapper-adults select.hb-adults {
  background: transparent !important;
  border: none !important;
  border-bottom: 1px solid #000 !important;
  color: #000 !important;
  width: 100%;
  padding: 0 0 5px 0;
  font-family: 'Yantramanav', sans-serif;
  font-size: 12px;
  font-weight: 400;
  letter-spacing: 4px;
  text-transform: uppercase;
  -webkit-appearance: none !important;
}

body.page-id-6552 #booknow-search-form p.hb-people-wrapper-adults select.hb-adults option {
  color: #000 !important;
}

/* Availability button */
body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"] {
  border: 1px solid #000 !important;
  border-radius: 0 !important;
  background: transparent !important;
  color: #000 !important;
  padding: 10px 18px;
  transition: background-color 0.3s ease, color 0.3s ease;
}

/* Hover effect */
body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"]:hover {
  background-color: #000 !important;
  color: #fff !important;
}

/* Layout for form containers */
body.page-id-6552 #booknow-search-form .hb-search-fields,
body.page-id-6552 #booknow-search-form form {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 20px;
}

/* Field width control */
body.page-id-6552 #booknow-search-form form > p {
  flex: 1 1 220px;
  min-width: 220px;
}

/* Responsive fix */
@media (max-width: 767px) {
  body.page-id-6552 #booknow-search-form .hb-search-fields,
  body.page-id-6552 #booknow-search-form form {
    flex-direction: column;
    align-items: stretch;
  }

  body.page-id-6552 #booknow-search-form p.hb-search-submit-wrapper input[type="submit"] {
    width: 100%;
    max-width: 200px;
    margin: 0 auto;
  }
}



/* ==========================================================
   HBook in Slide-in Drawer — Spacing Only (Search + Details)
   Targets: #tmts-hbook-drawer … hb-booking-search-form/details-form
   ========================================================== */



/* Drawer inner padding (keeps content off the edges) */
#tmts-hbook-drawer .tmts-hb-drawer-content {
  padding-left: 16px !important;
  padding-right: 16px !important;
  box-sizing: border-box !important;
}

/* Normalize container width & inner padding for both steps */
#tmts-hbook-drawer .hb-booking-search-form,
#tmts-hbook-drawer .hb-booking-details-form {
  width: 100% !important;
  max-width: none !important;
  margin: 0 auto !important;
  padding-left: 4px !important;   /* small, so controls don't hug the edge */
  padding-right: 4px !important;
  box-sizing: border-box !important;
}

/* Section spacing within the forms */
#tmts-hbook-drawer .hb-searched-summary,
#tmts-hbook-drawer .hb-search-fields-and-submit,
#tmts-hbook-drawer .hb-summary-wrapper,
#tmts-hbook-drawer .hb-details,
#tmts-hbook-drawer .hb-customer-details,
#tmts-hbook-drawer .hb-payment-info-wrapper {
  margin-top: 10px !important;
  margin-bottom: 16px !important;
}

/* Field rows: consistent gaps without changing styles */
#tmts-hbook-drawer .hb-search-fields {
  display: flex !important;
  flex-wrap: wrap !important;
  column-gap: 16px !important;
  row-gap: 14px !important;
}

/* Each field block */
#tmts-hbook-drawer .hb-search-fields > p,
#tmts-hbook-drawer .hb-search-fields > div {
  margin: 0 !important;
  padding: 0 !important;
  flex: 1 1 260px !important; /* lets two fit side-by-side when there’s room */
  max-width: 100% !important;
  box-sizing: border-box !important;
}

/* Submit wrapper: keep it tight to fields */
#tmts-hbook-drawer .hb-submit-wrapper { margin-top: 0; }

/* ==========================================================
   TMTS HBook Drawer — Mobile fit + no left cut-off
   (layout only; no colors/typography changed)
   ========================================================== */
@media (max-width: 767px) {
  /* 1) Make the drawer a full-viewport overlay on phones */
  #tmts-hbook-drawer {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    right: 0 !important;
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;      /* modern mobile units */
    /* height: 100vh !important; */  /* ← optional fallback */
    z-index: 99999 !important;
    margin: 0 !important;
    overflow: hidden !important;
    box-sizing: border-box !important;

    /* Ensure slide-in works from the right without overshooting left */
    transform: translate3d(100%, 0, 0);
    transition: transform .35s ease;
    will-change: transform;
  }

  /* 2) Open states your JS might toggle */
  #tmts-hbook-drawer.is-open,
  #tmts-hbook-drawer.open,
  #tmts-hbook-drawer.tmts-open,
  body.tmts-hbd-open #tmts-hbook-drawer {
    transform: translate3d(0, 0, 0) !important;
  }

  /* 3) Inner content should scroll, not the page */
  #tmts-hbook-drawer .tmts-hb-drawer-content {
    height: 100%;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box !important;

    /* safe-area aware side padding */
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
  }

  /* 4) Prevent inherited widths/margins from pushing content left */
  #tmts-hbook-drawer .tmts-hb-drawer-content,
  #tmts-hbook-drawer .hb-booking-search-form,
  #tmts-hbook-drawer .hb-booking-details-form {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  /* 5) Stop horizontal scrolling while drawer is open (if your JS sets a flag) */
  body.tmts-hbd-open,
  html.tmts-hbd-open {
    overflow-x: hidden !important;
  }
}


/* ============================
   TMTS HBook Drawer — Mobile fix
   Force full-width + on-screen
   ============================ */
@media (max-width: 767px) {
  /* Target by id substring to catch any variant */
  [id*="tmts-hbook-drawer"] {
    position: fixed !important;
    inset: 0 !important;              /* top/right/bottom/left: 0 */
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    margin: 0 !important;
    overflow: hidden !important;
    z-index: 99999 !important;

    /* If script uses translate to hide it, default to hidden off-screen (right) */
    transform: translate3d(100%, 0, 0) !important;
    transition: transform .35s ease !important;
    will-change: transform;
  }

  /* Consider it "open" if any of these flags are present */
  body[class*="hbd-open"] [id*="tmts-hbook-drawer"],
  [id*="tmts-hbook-drawer"].open,
  [id*="tmts-hbook-drawer"].is-open,
  [id*="tmts-hbook-drawer"][aria-hidden="false"],
  /* If inline style sets translate3d(0...), force-visible too */
  [id*="tmts-hbook-drawer"][style*="translate3d(0"] {
    transform: translate3d(0, 0, 0) !important;
    left: 0 !important;               /* kill any negative left from inline styles */
    right: 0 !important;
  }

  /* Nuke any stray inline offsets that might push it off screen */
  [id*="tmts-hbook-drawer"][style*="left"],
  [id*="tmts-hbook-drawer"][style*="margin"] {
    left: 0 !important;
    margin: 0 !important;
  }

  /* Inner content scrolls; safe-area padding so it never hugs edges */
  [id*="tmts-hbook-drawer"] .tmts-hb-drawer-content {
    height: 100%;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    box-sizing: border-box !important;
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
  }

  /* Forms inside must not carry fixed widths/margins from desktop */
  [id*="tmts-hbook-drawer"] .hb-booking-search-form,
  [id*="tmts-hbook-drawer"] .hb-booking-details-form {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
  }

  /* Optional: lock page from horiz scroll while open if your JS adds a flag */
  body[class*="hbd-open"], html[class*="hbd-open"] { overflow-x: hidden !important; }
}

/* ============================
   TMTS HBook Drawer — Mobile fix
   Fill screen, no left cut-off
   ============================ */
@media (max-width: 767px) {
  /* 1) Force the drawer to be a full-viewport layer */
  [id*="tmts-hbook-drawer"] {
    position: fixed !important;
    inset: 0 !important;                 /* top/right/bottom/left: 0 */
    width: 100vw !important;
    max-width: 100vw !important;
    height: 100dvh !important;
    z-index: 99999 !important;
    margin: 0 !important;
    overflow: hidden !important;

    /* Default hidden state (offscreen to the right) */
    transform: translate3d(100%, 0, 0) !important;
    transition: transform .35s ease !important;
    will-change: transform;
    box-sizing: border-box !important;
  }

  /* 2) Visible state — add your “open” flag here if different */
  [id*="tmts-hbook-drawer"].open,
  [id*="tmts-hbook-drawer"].is-open,
  body.tmts-hbd-open [id*="tmts-hbook-drawer"],
  [id*="tmts-hbook-drawer"][aria-hidden="false"],
  [id*="tmts-hbook-drawer"][style*="translate3d(0"] {
    transform: translate3d(0, 0, 0) !important;
    left: 0 !important;
    right: 0 !important;
  }

  /* 3) Neutralize any inline offsets that push it left/right */
  [id*="tmts-hbook-drawer"][style*="left"],
  [id*="tmts-hbook-drawer"][style*="margin"] {
    left: 0 !important;
    margin: 0 !important;
  }

  /* 4) Content scrolls inside the drawer; add safe-area padding */
  [id*="tmts-hbook-drawer"] .tmts-hb-drawer-content {
    height: 100%;
    overflow-y: auto !important;
    -webkit-overflow-scrolling: touch;
    padding-left: max(12px, env(safe-area-inset-left)) !important;
    padding-right: max(12px, env(safe-area-inset-right)) !important;
    box-sizing: border-box !important;
  }

  /* 5) Forms inside: no centering offsets, full width */
  [id*="tmts-hbook-drawer"] .hb-booking-search-form,
  [id*="tmts-hbook-drawer"] .hb-booking-details-form {
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;               /* prevents “cramped-left” centering */
  }
}