/* Mandala Guide: bubble + panel (Wren, 2026-09-28; ported from North Light).
   Self-contained: it also loads on admin pages, where the theme's tokens do not
   exist, so it carries its own. Olive ink on cream and white; sage and copper
   are never text here (copper is the focus ring's outer band only).
   Corner: the 52px launcher sits bottom right; nothing else of ours is fixed
   there. The header's Book pill is at the top, so the launcher never covers it. */
.mm-chat-launch,.mm-chat-panel{--mc-olive:#383D31;--mc-olive-2:#2F3329;--mc-cream:#F9F6EE;--mc-paper:#F1ECE0;--mc-muted:#666B57;
  --mc-line:rgba(56,61,49,.16);--mc-line-strong:rgba(56,61,49,.32);--mc-copper:#C58C51;
  --mc-display:"Newsreader",Georgia,serif;--mc-ui:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif}

/* launcher */
/* a stable bottom: env(safe-area-inset-bottom) is re-reported as iOS Safari's toolbar
   collapses, so a calc() on it made the bubble ride up and down mid-scroll (memory:
   ios-safe-area-inset-toolbar-trap). 20px clears the home indicator in every state.
   --mm-chat-gap is the same number for the probe watchdog in chat.js. */
.mm-chat-launch{--mm-chat-gap:20px;position:fixed;right:max(16px,env(safe-area-inset-right,0px));bottom:var(--mm-chat-gap);z-index:47;
  width:52px;height:52px;padding:0;margin:0;border:1px solid rgba(249,246,238,.18);border-radius:50%;display:grid;place-items:center;
  background:var(--mc-olive);color:var(--mc-cream);cursor:pointer;box-shadow:0 10px 24px -12px rgba(47,51,41,.7);
  -webkit-tap-highlight-color:transparent;touch-action:manipulation}
.mm-chat-launch svg{display:block}
.mm-chat-launch:focus-visible{outline:2px solid transparent;box-shadow:0 0 0 2px var(--mc-cream),0 0 0 4px var(--mc-olive)}
.mm-chat-launch[aria-expanded="true"]{background:var(--mc-olive-2)}
@media (hover:hover){.mm-chat-launch:hover{background:var(--mc-olive-2)}}
@media (min-width:921px){.mm-chat-launch{--mm-chat-gap:24px;right:24px}}
/* watchdog fallback (chat.js): absolute, top set from scrollY + innerHeight */
.mm-chat-launch.mm-chat-pinned{position:absolute;bottom:auto}
.mm-chat-probe{position:fixed;left:0;bottom:0;width:1px;height:1px;margin:0;padding:0;border:0;visibility:hidden;pointer-events:none}
body.menu-open .mm-chat-launch,body.rre-active .mm-chat-launch{opacity:0;visibility:hidden;pointer-events:none}

/* panel: phone first, a bottom sheet. It opens at its natural height and
   grows with the transcript: chat.js writes the natural height to
   --mm-chat-h, CSS clamps it to 80svh (svh never moves with Safari's toolbar)
   and transitions it. The home-indicator inset is added OUTSIDE that clamp,
   as the sheet's own bottom padding, so when iOS toggles
   env(safe-area-inset-bottom) only the pad under the form changes; the
   transcript, pills and input never shift. */
.mm-chat-panel{position:fixed;top:auto;right:0;bottom:0;left:0;inset:auto 0 0 0;z-index:60;display:flex;flex-direction:column;box-sizing:border-box;
  height:calc(max(300px,min(var(--mm-chat-h,520px),80vh)) + env(safe-area-inset-bottom,0px));
  background:var(--mc-cream);color:var(--mc-olive);font:400 15px/1.5 var(--mc-ui);
  padding-bottom:env(safe-area-inset-bottom,0px);overscroll-behavior:contain;overflow:hidden;
  border-radius:16px 16px 0 0;box-shadow:0 -18px 44px -22px rgba(47,51,41,.5),0 0 0 1px var(--mc-line);
  transition:height .38s cubic-bezier(.22,.8,.24,1);animation:mmChatIn .3s cubic-bezier(.2,.7,.2,1) both}
/* svh behind @supports: beside a var() it is only rejected at computed time,
   which would unset the vh height above rather than fall back to it */
@supports (height:1svh){.mm-chat-panel{height:calc(clamp(300px,var(--mm-chat-h,520px),80svh) + env(safe-area-inset-bottom,0px))}}
.mm-chat-panel.mm-chat-snap{transition:none}
.mm-chat-panel[hidden]{display:none}
.mm-chat-panel *,.mm-chat-panel *::before,.mm-chat-panel *::after{box-sizing:border-box}
.mm-chat-panel>*:not(.mm-chat-log){flex:none}
@keyframes mmChatIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media (min-width:601px){
  .mm-chat-panel{top:auto;right:24px;bottom:88px;left:auto;inset:auto 24px 88px auto;width:400px;padding-bottom:0;border-radius:14px;
    height:max(300px,min(var(--mm-chat-h,520px),min(80vh,calc(100vh - 112px))));
    box-shadow:0 24px 60px -24px rgba(47,51,41,.55),0 0 0 1px var(--mc-line)}
  @supports (height:1svh){.mm-chat-panel{height:clamp(300px,var(--mm-chat-h,520px),min(80svh,calc(100svh - 112px)))}}
}

/* phones (<=920px or a touch screen; chat.js decides and adds .mm-chat-sheet):
   a card sheet that fills the screen, the same panel (urgent row, Book online
   and Search the site, the saved-messages note, suggested questions), with
   rounded top corners over a dark veil. chat.js pins it with .mm-chat-pin:
   position:absolute in PAGE coordinates (top/height inline: the visual
   viewport's while the keyboard is up, scrollY + innerHeight once it is
   down). Absolute, not fixed: iOS 26 Safari (WebKit 297779) can leave the
   fixed layer offset by the keyboard's height after the keyboard closes.

   Nothing of the page may ever show around it (Eric, 2026-10-05: the hero's
   search pill showed between the composer and the keyboard, behind iOS 26's
   floating autofill bar). Four layers, each enough on its own for most cases:
   1. the page itself stops painting while the sheet is open (opacity, which
      no descendant can override, plus visibility so nothing behind is
      focusable); 2. html and body paint the veil colour, so rubber-band and
      any uncovered strip are veil, never page; 3. the veil, a fixed layer that
      over-extends a full screen above and below, so a fixed layer iOS leaves
      offset still covers; 4. a white skirt under the sheet (::after) that runs
      two screens down, so whatever sits between the composer and the keyboard
      (the accessory bar's glass, the keyboard sliding in or out before the
      viewport reports it) is the footer's own white. */
html.mm-chat-lock,html.mm-chat-lock body{overflow:hidden!important;overscroll-behavior:none;background:#1F221B none!important}
html.mm-chat-lock body>*:not(.mm-chat-panel):not(.mm-chat-veil){opacity:0!important;visibility:hidden!important;transition:none!important;animation:none!important}
.mm-chat-veil{display:none}
html.mm-chat-lock .mm-chat-veil{display:block;position:fixed;left:0;right:0;top:-100vh;bottom:-100vh;z-index:69;margin:0;padding:0;border:0;
  background:#1F221B;touch-action:none}
.mm-chat-panel.mm-chat-sheet{position:fixed;top:0;right:0;bottom:0;left:0;inset:0;z-index:70;width:auto;height:100vh;height:100dvh;
  padding-bottom:0;overflow:visible;border-radius:18px 18px 0 0;box-shadow:0 -1px 0 rgba(249,246,238,.1);transition:none;
  animation:mmSheetIn .34s cubic-bezier(.2,.8,.2,1) both}
.mm-chat-panel.mm-chat-sheet.mm-chat-pin{position:absolute;top:auto;right:auto;bottom:auto;left:auto;inset:auto;left:0;right:0;top:0}
.mm-chat-panel.mm-chat-sheet:focus{outline:0}
.mm-chat-sheet::after{content:"";position:absolute;left:0;right:0;top:calc(100% - 1px);height:200vh;background:#fff;pointer-events:none}
.mm-chat-sheet .mm-chat-head{border-radius:18px 18px 0 0;padding-top:16px}
.mm-chat-sheet .mm-chat-foot{padding-bottom:calc(8px + env(safe-area-inset-bottom,0px))}
/* keyboard up: the composer and the rows under it ride on the keyboard; no
   home-indicator pad there, and the suggested questions become one row that
   scrolls sideways so the transcript keeps its room. When the keyboard still
   leaves the transcript too little (chat.js measures), .mm-chat-tight folds
   the header's second line and the saved-messages note, every button stays;
   only a landscape phone (.mm-chat-tighter) also folds the rows under the
   composer and the suggestions until the keyboard goes down. */
.mm-chat-sheet.mm-chat-kb .mm-chat-foot{padding-bottom:6px}
.mm-chat-sheet.mm-chat-kb .mm-chat-starters{flex-wrap:nowrap;overflow-x:auto;overscroll-behavior-x:contain;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.mm-chat-sheet.mm-chat-kb .mm-chat-starters::-webkit-scrollbar{display:none}
.mm-chat-sheet.mm-chat-kb .mm-chat-starters .mm-chat-chip{flex:none;white-space:nowrap}
.mm-chat-sheet.mm-chat-tight .mm-chat-sub,.mm-chat-sheet.mm-chat-tight .mm-chat-foot:not(.mcx-foot-on)>span:last-child,
.mm-chat-sheet.mm-chat-tight .mcx-foot>span:last-child{display:none}
.mm-chat-sheet.mm-chat-tight .mm-chat-head{padding-top:10px;padding-bottom:8px}
.mm-chat-sheet.mm-chat-tighter .mcx-sos,.mm-chat-sheet.mm-chat-tighter .mm-chat-foot,.mm-chat-sheet.mm-chat-tighter .mm-chat-starters{display:none}
html.mm-chat-lock .mm-chat-launch{opacity:0;visibility:hidden;pointer-events:none}
@keyframes mmSheetIn{from{transform:translateY(32px)}to{transform:none}}

.mm-chat-head{display:flex;align-items:flex-start;justify-content:space-between;gap:12px;padding:14px 10px 12px 18px;
  background:var(--mc-olive);color:var(--mc-cream)}
.mm-chat-head h2{margin:0;font:500 22px/1.2 var(--mc-display);color:var(--mc-cream);letter-spacing:0;display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.mm-chat-demo{display:inline-flex;align-items:center;border:1px solid rgba(249,246,238,.4);color:var(--mc-cream);font:500 11px/1 var(--mc-ui);padding:5px 8px;border-radius:999px}
.mm-chat-sub{margin:4px 0 0;font:400 13px/1.4 var(--mc-ui);color:#C9C8BF}
.mm-chat-close{flex:none;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:transparent;color:var(--mc-cream);cursor:pointer;touch-action:manipulation}
.mm-chat-close:focus-visible{outline:2px solid var(--mc-cream);outline-offset:0}
@media (hover:hover){.mm-chat-close:hover{background:rgba(249,246,238,.1)}}

.mm-chat-log{position:relative;flex:1 1 auto;min-height:0;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:16px 14px 10px;display:flex;flex-direction:column;gap:10px}
.mm-chat-panel a{color:inherit;text-decoration:none;-webkit-tap-highlight-color:transparent}
.mm-chat-msg{max-width:88%;padding:11px 14px;border-radius:14px;overflow-wrap:anywhere;font:400 15px/1.55 var(--mc-ui)}
.mm-chat-msg p{margin:0}
.mm-chat-msg p+p,.mm-chat-msg .mm-chat-body>*+*{margin-top:10px}
.mm-chat-msg.bot{align-self:flex-start;max-width:92%;background:#fff;color:var(--mc-olive);border:1px solid var(--mc-line);border-bottom-left-radius:4px}
.mm-chat-msg.me{align-self:flex-end;background:var(--mc-olive);color:var(--mc-cream);border-bottom-right-radius:4px}
.mm-chat-msg.mm-in{animation:mmMsgIn .3s cubic-bezier(.2,.7,.2,1) both}
@keyframes mmMsgIn{from{opacity:0;transform:translateY(6px)}to{opacity:1;transform:none}}

/* answer type: lists, bold, a heading line */
.mm-chat-body ul,.mm-chat-body ol{margin:0;padding:0 0 0 1.3em}
.mm-chat-body li{padding-left:.2em}
.mm-chat-body li+li{margin-top:6px}
.mm-chat-body li::marker{color:var(--mc-muted)}
.mm-chat-body ol li::marker{font-weight:600;font-variant-numeric:tabular-nums}
.mm-chat-body strong{font-weight:600;color:var(--mc-olive-2)}
.mm-chat-body em{font-style:italic}
.mm-chat-h{font:500 17px/1.3 var(--mc-display)}
.mm-chat-from{margin-top:10px!important;font-size:13px;color:var(--mc-muted)}
.mm-chat-from a{color:var(--mc-olive);font-weight:600;background:linear-gradient(var(--mc-line-strong),var(--mc-line-strong)) 0 100%/100% 1px no-repeat}

/* a URL in the text: a quiet inline pill, the place's name and an arrow */
.mm-chat-inl{display:inline-flex;align-items:center;gap:4px;max-width:100%;margin:0 1px;padding:0 7px 0 9px;vertical-align:baseline;
  border:1px solid var(--mc-line);border-radius:999px;background:var(--mc-paper);color:var(--mc-olive);font:600 13.5px/1.6 var(--mc-ui);
  white-space:nowrap;touch-action:manipulation}
.mm-chat-inl>span:first-child{min-width:0;overflow:hidden;text-overflow:ellipsis}
.mm-chat-inl svg{flex:none;opacity:.75}
.mm-chat-inl:focus-visible{outline:2px solid var(--mc-olive);outline-offset:1px}
@media (hover:hover){.mm-chat-inl:hover{border-color:var(--mc-olive)}}

/* destination cards under the answer: name, a one-line hint, an arrow */
.mm-chat-cards{display:grid;grid-template-columns:minmax(0,1fr);gap:8px;margin-top:12px}
.mm-card{display:flex;align-items:center;gap:12px;min-height:58px;padding:9px 10px 9px 14px;border:1px solid var(--mc-line);border-radius:14px;
  background:var(--mc-cream);color:var(--mc-olive);touch-action:manipulation;transition:border-color .15s ease,background-color .15s ease}
.mm-card-tx{flex:1 1 auto;min-width:0;display:flex;flex-direction:column;gap:2px}
.mm-card-t{font:500 16px/1.25 var(--mc-display);color:inherit;overflow-wrap:anywhere}
.mm-card-h{display:block;font:400 12.5px/1.35 var(--mc-ui);color:var(--mc-muted);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.mm-card-h::before{content:"";display:inline-block;width:6px;height:6px;margin-right:7px;border-radius:50%;background:#5F8B73;vertical-align:1px}
.mm-card[data-kind="faq"] .mm-card-h::before,.mm-card[data-kind="insight"] .mm-card-h::before{background:var(--mc-copper)}
.mm-card[data-kind="outside"] .mm-card-h::before{background:var(--mc-muted)}
.mm-card-go{flex:none;width:36px;height:36px;display:grid;place-items:center;border:1px solid var(--mc-line);border-radius:50%;background:#fff;color:var(--mc-olive);
  transition:background-color .15s ease,color .15s ease}
.mm-card:focus-visible{outline:2px solid var(--mc-olive);outline-offset:2px}
.mm-card:active{background:var(--mc-paper)}
@media (hover:hover){.mm-card:hover{border-color:var(--mc-olive)}.mm-card:hover .mm-card-go{background:var(--mc-olive);border-color:var(--mc-olive);color:var(--mc-cream)}}
/* booking is the one filled card: the clinic's main action */
.mm-card[data-kind="booking"]{background:var(--mc-olive);border-color:var(--mc-olive);color:var(--mc-cream)}
.mm-card[data-kind="booking"] .mm-card-h{color:#C9C8BF}
.mm-card[data-kind="booking"] .mm-card-h::before{background:var(--mc-copper)}
.mm-card[data-kind="booking"] .mm-card-go{background:rgba(249,246,238,.1);border-color:rgba(249,246,238,.28);color:var(--mc-cream)}
.mm-card[data-kind="booking"]:active{background:var(--mc-olive-2)}
.mm-card[data-kind="booking"]:focus-visible{outline-color:var(--mc-olive)}
@media (hover:hover){.mm-card[data-kind="booking"]:hover{background:var(--mc-olive-2)}.mm-card[data-kind="booking"]:hover .mm-card-go{background:var(--mc-cream);color:var(--mc-olive)}}

/* type-in: words wait hidden and fade up as they arrive; cards land whole */
.mm-tw-h{display:none!important}
.mm-chat-msg.is-typing .mm-tw,.mm-chat-msg.is-typing .mm-chat-inl{animation:mmTw .32s ease-out both}
.mm-chat-msg.is-typing .mm-card{animation:mmMsgIn .34s cubic-bezier(.2,.7,.2,1) both}
@keyframes mmTw{from{opacity:0}to{opacity:1}}
.mm-chat-links,.mm-chat-starters,.mm-chat-suggest{display:flex;flex-wrap:wrap;gap:8px}
.mm-chat-links{margin-top:10px}
.mm-chat-starters{padding:0 14px 10px}
.mm-chat-starters:empty{display:none}
.mm-chat-suggest{align-self:flex-start;max-width:100%}
.mm-chat-chip{display:inline-flex;align-items:center;min-height:44px;padding:8px 14px;border-radius:999px;border:1px solid var(--mc-line-strong);
  background:#fff;color:var(--mc-olive);font:500 14px/1.25 var(--mc-ui);text-align:left;text-decoration:none!important;cursor:pointer;touch-action:manipulation}
.mm-chat-chip:focus-visible{outline:2px solid var(--mc-olive);outline-offset:1px}
@media (hover:hover){.mm-chat-chip:hover{border-color:var(--mc-olive)}}
.mm-chat-cta{display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin-top:10px;padding:10px 16px;border-radius:999px;
  background:var(--mc-olive);color:var(--mc-cream)!important;font:600 15px/1.2 var(--mc-ui);text-decoration:none!important}
.mm-chat-typing{display:inline-flex;gap:5px;align-items:center;min-height:20px}
.mm-chat-typing i{width:6px;height:6px;border-radius:50%;background:var(--mc-muted);animation:mmChatDot 1s infinite ease-in-out}
.mm-chat-typing i:nth-child(2){animation-delay:.15s}.mm-chat-typing i:nth-child(3){animation-delay:.3s}
@keyframes mmChatDot{0%,80%,100%{opacity:.3}40%{opacity:1}}

.mm-chat-form{display:flex;align-items:flex-end;gap:8px;padding:10px 12px 6px;background:#fff;border-top:1px solid var(--mc-line)}
.mm-chat-form textarea{flex:1 1 auto;min-height:44px;max-height:120px;resize:none;margin:0;padding:11px 14px;border:1px solid var(--mc-line-strong);
  border-radius:22px;background:var(--mc-cream);color:var(--mc-olive);font:400 16px/1.35 var(--mc-ui)}
.mm-chat-form textarea::placeholder{color:var(--mc-muted)}
.mm-chat-form textarea:focus{outline:2px solid var(--mc-olive);outline-offset:0;border-color:var(--mc-olive)}
.mm-chat-form textarea:disabled{opacity:.6}
.mm-chat-send{flex:none;width:44px;height:44px;display:grid;place-items:center;border:0;border-radius:50%;background:var(--mc-olive);color:var(--mc-cream);cursor:pointer;touch-action:manipulation}
.mm-chat-send:disabled{opacity:.5;cursor:default}
.mm-chat-send:focus-visible{outline:2px solid transparent;box-shadow:0 0 0 2px #fff,0 0 0 4px var(--mc-olive)}
.mm-chat-foot{display:flex;flex-wrap:wrap;align-items:center;gap:0 8px;margin:0;padding:2px 12px 8px;background:#fff;font:400 12px/1.4 var(--mc-ui);color:var(--mc-muted)}
.mm-chat-foot>span:last-child{flex:1 1 100%;padding:0 2px}
/* footer pills: a 44px tap target drawing a 34px pill (the pill is ::before) */
.mm-chat-foot a,.mm-chat-foot button{position:relative;z-index:0;display:inline-flex;align-items:center;min-height:44px;margin:0;padding:0 15px;border:0;
  background:none;color:var(--mc-olive);font:600 13px/1 var(--mc-ui);text-decoration:none;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent}
.mm-chat-foot a::before,.mm-chat-foot button::before{content:"";position:absolute;top:5px;right:0;bottom:5px;left:0;inset:5px 0;z-index:-1;border:1px solid var(--mc-line-strong);border-radius:999px;background:#fff;
  transition:background-color .15s ease,border-color .15s ease}
.mm-chat-foot a{color:var(--mc-cream)}
.mm-chat-foot a::before{background:var(--mc-olive);border-color:var(--mc-olive)}
.mm-chat-foot a:focus-visible,.mm-chat-foot button:focus-visible{outline:0}
.mm-chat-foot a:focus-visible::before,.mm-chat-foot button:focus-visible::before{box-shadow:0 0 0 2px #fff,0 0 0 4px var(--mc-olive)}
.mm-chat-foot button:active::before{background:var(--mc-paper)}
.mm-chat-foot a:active::before{background:var(--mc-olive-2)}
@media (hover:hover){.mm-chat-foot button:hover::before{border-color:var(--mc-olive)}.mm-chat-foot a:hover::before{background:var(--mc-olive-2)}}
.mm-chat-hp{position:absolute!important;left:-9999px!important;width:1px;height:1px;overflow:hidden}
.mm-chat-sr{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}

@media (prefers-reduced-motion:reduce){
  .mm-chat-typing i{animation:none;opacity:.7}
  .mm-chat-panel,.mm-chat-panel.mm-chat-sheet,.mm-chat-msg.mm-in,.mm-chat-msg.is-typing .mm-tw,.mm-chat-msg.is-typing .mm-chat-inl,.mm-chat-msg.is-typing .mm-card{animation:none}
  .mm-chat-panel,.mm-card,.mm-card-go{transition:none}
}