/* GX booking modal — shared across the /book-test/ pages (NYH pattern).
   One modal per page; every .js-book opens the GX embed iframe in it. */
.book-modal{position:fixed;inset:0;z-index:10000;display:none;align-items:center;justify-content:center;
  background:rgba(0,0,0,.6);-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);padding:20px;}
.book-modal.open{display:flex;}
.book-dialog{position:relative;width:100%;max-width:560px;height:min(86vh,780px);height:min(86svh,780px);
  max-height:100svh;background:#fff;border-radius:14px;
  overflow:hidden;box-shadow:0 30px 80px -20px rgba(0,0,0,.85);display:flex;flex-direction:column;}
.book-bar{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 16px;background:#16181c;color:#fff;
  font-family:"Open Sans",Arial,sans-serif;}
.book-bar b{font-size:14px;font-weight:700;letter-spacing:.3px;}
.book-close{background:none;border:0;color:#fff;font-size:26px;line-height:1;cursor:pointer;padding:0 2px;}
.book-close:hover{opacity:.75;}
.book-frame{flex:1;min-height:0;width:100%;border:0;background:#fff;overflow-y:auto;overflow-x:hidden;
  -webkit-overflow-scrolling:touch;overscroll-behavior:contain;}
.book-frame iframe{display:block;width:100%;border:0;background:#fff;min-height:540px;}
.book-call{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;gap:10px;
  padding:28px;text-align:center;font-family:"Open Sans",Arial,sans-serif;color:#1a1814;}
.book-call p{margin:0;font-size:15px;line-height:1.6;color:#484848;max-width:360px;}
.book-call a{display:inline-block;margin-top:6px;padding:12px 26px;border-radius:999px;background:#16181c;color:#fff;
  font-weight:700;font-size:15px;text-decoration:none;letter-spacing:.04em;}
@media(max-width:560px){
  .book-modal{padding:0;}
  .book-dialog{max-width:none;width:100%;height:100%;height:100svh;max-height:100svh;border-radius:0;border:0;}
}

/* Chrome-gloss (glass-dark) modal skin — active when gx-book.js runs with data-theme="glass-*" */
.book-modal.glass .book-dialog{background:linear-gradient(160deg,#07080b,#14161c 50%,#060709);border:1px solid rgba(255,255,255,.12);max-width:640px;}
.book-modal.glass .book-bar{background:transparent;border-bottom:0;padding:16px 20px 4px;}
.book-modal.glass .book-frame{background:transparent;}
.book-modal.glass .book-frame iframe{background:transparent;}
.book-modal.glass .book-call{color:#f2f3f5;}
.book-modal.glass .book-call p{color:#b9bcc4;}
.book-modal.glass .book-call a{background:linear-gradient(180deg,#ffffff,#c9ccd4);color:#131418;}

/* ── Docked order summary ("Order details" + total) ─────────────────────────
   Rendered by gx-book.js from the embed's {type:"gx-booking-summary"} message,
   appended as the LAST FLEX CHILD of .book-dialog so it pins to the dialog
   bottom while .book-frame keeps the scroll (same pattern as the retouch
   panel's .order-summary). Card payments only — hidden for "Invoice our
   company" and gift-card redemptions. */
.gx-os{flex:0 0 auto;position:relative;z-index:9;background:#0f1114;color:#fff;
  border-top:1px solid rgba(255,255,255,.12);box-shadow:0 -20px 44px -26px rgba(0,0,0,.92);
  font-family:"Open Sans",Arial,sans-serif;}
.gx-os[hidden]{display:none;}
.gx-os-bar{display:flex;align-items:center;justify-content:space-between;gap:14px;width:100%;
  background:none;border:0;cursor:pointer;color:#fff;padding:12px 18px;text-align:left;transition:background .2s;}
.gx-os-bar:hover{background:rgba(255,255,255,.05);}
.gx-os-toggle{display:flex;align-items:center;gap:11px;min-width:0;font-size:13px;letter-spacing:.4px;color:rgba(255,255,255,.78);}
.gx-os-label{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.gx-os-chev{flex:0 0 auto;width:8px;height:8px;border-right:2px solid rgba(255,255,255,.65);
  border-bottom:2px solid rgba(255,255,255,.65);transform:rotate(-45deg);transition:transform .3s ease;}
.gx-os.open .gx-os-chev{transform:rotate(45deg);}
.gx-os-total-wrap{display:flex;align-items:baseline;gap:8px;white-space:nowrap;font-size:12.5px;
  letter-spacing:.5px;text-transform:uppercase;color:rgba(255,255,255,.55);}
.gx-os-total{display:inline-block;font-size:22px;font-weight:700;letter-spacing:.3px;color:#fff;text-transform:none;}
.gx-os-total.roll-up{animation:gxOsRollUp .52s ease;}
.gx-os-total.roll-down{animation:gxOsRollDown .52s ease;}
@keyframes gxOsRollUp{0%{transform:translateY(5px)}55%{transform:translateY(-2px)}100%{transform:translateY(0)}}
@keyframes gxOsRollDown{0%{transform:translateY(-5px)}55%{transform:translateY(2px)}100%{transform:translateY(0)}}
.gx-os-detail{max-height:0;overflow:hidden;transition:max-height .34s ease;}
.gx-os.open .gx-os-detail{max-height:42vh;overflow-y:auto;}
.gx-os-list{list-style:none;margin:0;padding:2px 18px 14px;}
.gx-os-row{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:9px 0;
  border-top:1px solid rgba(255,255,255,.08);font-size:13px;line-height:1.35;color:#e6e6e6;}
.gx-os-row span:last-child{white-space:nowrap;color:#cfcfcf;}
/* amount + × remove button (add-on rows only — the session can't be removed) */
.gx-os-amt{display:inline-flex;align-items:center;gap:9px;}
.gx-os-x{display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto;width:22px;height:22px;
  padding:0;border:0;border-radius:999px;cursor:pointer;font-size:15px;line-height:1;
  background:rgba(255,255,255,.09);color:rgba(255,255,255,.7);transition:background .15s,color .15s;}
.gx-os-x:hover,.gx-os-x:focus-visible{background:rgba(255,118,118,.2);color:#ff7676;}
@media(max-width:560px){
  .gx-os-bar{padding:11px 16px;}
  .gx-os-total{font-size:19px;}
  .gx-os-list{padding:2px 16px 12px;}
  .gx-os.open .gx-os-detail{max-height:36vh;}
}
@media(prefers-reduced-motion:reduce){
  .gx-os-chev,.gx-os-detail{transition:none;}
  .gx-os-total.roll-up,.gx-os-total.roll-down{animation:none;}
}
/* glass skin: the dialog is already dark chrome-gloss — sit on it, don't slab it */
.book-modal.glass .gx-os{background:rgba(10,11,14,.72);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);}

/* Note bar under the modal title (data-note on the .js-book cell) */
.book-note{display:none;padding:8px 18px 10px;background:#16181c;color:#b9bcc4;
  font-family:"Open Sans",Arial,sans-serif;font-size:12px;line-height:1.5;}
.book-modal.glass .book-note{background:transparent;color:#b9bcc4;padding:0 20px 8px;}
/* NYH pages wrap the frame in an extra .book-body — keep it transparent in glass mode */
.book-modal.glass .book-body{background:transparent;}
.book-body{flex:1;min-height:0;display:flex;flex-direction:column;}
