/* Book · scheduler — a framed home for Cal.com's element embed, plus the fallback that ships visible.
   Nothing here reaches inside the embed: the frame owns the border, the radius, the head strip and the
   height it needs while loading, and Cal.com owns everything it draws. The hidden-state rules at the
   foot of this file have to beat the display rules above them, exactly as the [hidden] attribute means. */

.bk-sch__grid{align-items:start;row-gap:clamp(24px,3vw,36px)}

/* ---------- the event card (left rail) ---------------------------------- */
.bk-sch__card{
  display:flex;flex-direction:column;gap:10px;
  padding:var(--bk-pad);background:var(--paper-2);
  border:1px solid var(--line);border-radius:var(--r-lg);
}
.bk-sch__evt{font-family:var(--f-h);font-size:1.375rem;font-weight:500;line-height:1.2;letter-spacing:-.014em;color:var(--ink)}
.bk-sch__evp{font-size:var(--t-sm);line-height:1.65;color:var(--muted);max-width:40ch}
.bk-sch__facts{margin-top:6px}
.bk-sch__facts>div{border-bottom-color:var(--line)}
.bk-sch__held{margin-top:12px;background:var(--paper)}

/* ---------- the frame --------------------------------------------------- */
.bk-sch__frame{
  position:relative;overflow:hidden;
  background:var(--paper);border:1px solid var(--line);border-radius:var(--bk-frame);
  box-shadow:var(--sh-2);
}
.bk-sch__head{
  display:flex;align-items:center;justify-content:space-between;gap:12px;
  min-height:48px;padding:10px 18px;border-bottom:1px solid var(--line-2);
  background:var(--paper-2);
}
.bk-sch__src{font-family:var(--f);letter-spacing:.01em;word-break:break-all;text-align:right}
.bk-sch__body{position:relative;padding:0}

/* the embed's own box. Empty and out of flow until the script is really running; Cal.com sets its own
   height once it is up, so the min-height is only the room it needs while it is getting there. */
/* The state classes live on .bk-sch__main (the [data-bk-sch] element the script owns), NOT on the
   section, so every state rule below has to be written against it. */
.bk-sch__mount{display:none;width:100%}
.bk-sch__mount iframe,.bk-sch__mount cal-inline{display:block;width:100%;max-width:100%;border:0}
.bk-sch__main.is-embed .bk-sch__mount{display:block;min-height:clamp(520px,74vh,820px)}
.bk-sch__main.is-embed.is-ready .bk-sch__mount{min-height:360px}

/* ---------- the bounded wait ------------------------------------------- */
/* --bk-wait is written by scheduler.js from its own timeout, so the bar can never outlast the wait.
   The wait sits OVER the space the embed has reserved, rather than under it: the reserved height has
   to exist so the frame does not jump 700px when Cal.com draws, and an unexplained 700px void is the
   empty box this page is not allowed to show. */
.bk-sch__wait{
  position:absolute;inset:0;z-index:1;
  display:flex;flex-direction:column;gap:14px;align-items:center;justify-content:center;
  padding:clamp(28px,4vw,48px) var(--bk-pad);background:var(--paper);text-align:center;
}
.bk-sch__waitbar{display:block;width:min(260px,100%);height:3px;border-radius:2px;background:var(--paper-4);overflow:hidden}
.bk-sch__waitbar i{
  display:block;width:100%;height:100%;border-radius:inherit;background:var(--blue);
  transform:scaleX(0);transform-origin:left center;
  animation:bk-wait var(--bk-wait,9s) var(--e-io) 1 forwards;
}
@keyframes bk-wait{from{transform:scaleX(.02)}to{transform:scaleX(1)}}
.bk-sch__waitt{font-family:var(--f);font-size:var(--t-xs);line-height:1.6;color:var(--muted);max-width:46ch}

/* ---------- the fallback: the state the page ships in ------------------- */
.bk-sch__fb{
  display:flex;flex-direction:column;align-items:flex-start;gap:14px;
  padding:clamp(28px,4.4vw,56px) var(--bk-pad);
}
.bk-sch__warn{
  width:100%;padding:12px 14px;border:1px solid var(--line-3);border-left-width:3px;
  border-left-color:var(--blue);border-radius:var(--r-sm);background:var(--paper-3);
  font-size:var(--t-xs);line-height:1.6;color:var(--ink);
}
.bk-sch__fbico{
  display:grid;place-items:center;width:46px;height:46px;flex:none;
  border-radius:var(--r-sm);background:var(--blue-wash);color:var(--ink);
}
.bk-sch__fbico .xt-ico{width:24px;height:24px}
.bk-sch__fbt{font-family:var(--f-h);font-size:var(--t-h3);font-weight:500;line-height:1.3;letter-spacing:-.01em;color:var(--ink)}
.bk-sch__fbp{font-size:var(--t-sm);line-height:1.65;color:var(--muted);max-width:52ch}
.bk-sch__fb .btn{margin-top:4px}
.bk-sch__fbalt{font-size:var(--t-xs);line-height:1.65;color:var(--muted)}
.bk-sch__fbalt a{
  color:var(--ink);font-weight:500;
  text-decoration:underline;text-decoration-color:var(--line-3);text-underline-offset:3px;
  transition:color var(--d1) var(--e-io),text-decoration-color var(--d1) var(--e-io);
}
.bk-sch__fbalt a:hover{color:var(--blue-d);text-decoration-color:var(--blue-line)}

/* ---------- what this section loads, said out loud --------------------- */
.bk-sch__meta{
  display:flex;flex-wrap:wrap;align-items:center;gap:6px 0;margin-top:14px;padding-inline:2px;
  font-family:var(--f);font-size:var(--t-lbl);letter-spacing:.12em;text-transform:uppercase;color:var(--faint);
}
.bk-sch__meta>*+*::before{content:"\00B7";margin-inline:10px;color:var(--ghost)}

/* ---------- widths ------------------------------------------------------ */
@media (max-width:860px){
  .bk-sch__head{flex-direction:column;align-items:flex-start;gap:4px;padding:12px 16px}
  .bk-sch__src{text-align:left}
  .bk-sch__card{padding:20px}
}
@media (max-width:600px){
  .bk-sch__frame{border-radius:var(--r-lg)}
  .bk-sch__main.is-embed .bk-sch__mount{min-height:640px}
  .bk-sch__evt{font-size:1.25rem}
}

@media (prefers-reduced-motion:reduce){
  /* a moving bar is the whole point of the wait indicator, so under reduced motion the sentence
     carries it on its own and the bar is simply not drawn */
  .bk-sch__waitbar{display:none}
  .bk-sch__fbalt a{transition:none}
}

/* hidden states must beat the display rules above */
.bk-sch__wait[hidden],.bk-sch__warn[hidden]{display:none}
.bk-sch__main.is-embed .bk-sch__fb{display:none}
.bk-sch__main.is-blocked .bk-sch__mount{display:none}
.bk-sch__main.is-blocked .bk-sch__fb{display:flex}
