/* The Revline booker — shared by /podcast (paper) and /apply (ink).
   The host page sets the theme via these variables before loading booker.js:
     --bk-fg      main text          --bk-dim    secondary text
     --bk-line    hairlines          --bk-panel  chip/field background
     --bk-accent  the redline        --bk-accent-ink  text on the accent
   Fonts come from the page's own @font-face (Newsreader + FiraVar). */
.bk { width:100%; }
.bk-status { font-family:"FiraVar",monospace; font-size:13px; letter-spacing:.1em; text-transform:uppercase; color:var(--bk-dim); }
.bk-tz { font-family:"FiraVar",monospace; font-size:12px; letter-spacing:.08em; color:var(--bk-dim); margin-top:14px; }
.bk-note { font-size:.9375rem; line-height:1.5; color:var(--bk-dim); margin-top:12px; }
.bk-tz label { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
/* 16px floor: anything smaller and iOS Safari zooms the whole page on focus,
   which on a booking form reads as the page breaking. */
.bk-tz select { font-family:inherit; font-size:16px; min-height:44px; padding:6px 10px;
  background:var(--bk-panel); color:var(--bk-fg); border:1px solid var(--bk-line);
  cursor:pointer; max-width:100%; }
.bk-tz select:hover, .bk-tz select:focus-visible { border-color:var(--bk-accent); outline:none; }

.bk-days { display:flex; gap:8px; overflow-x:auto; padding:2px 2px 10px; margin-top:18px; scrollbar-width:thin; }
.bk-day { flex:0 0 auto; min-width:76px; min-height:64px; padding:10px 14px; background:var(--bk-panel);
  border:1px solid var(--bk-line); color:var(--bk-fg); cursor:pointer; text-align:center; touch-action:manipulation; }
.bk-day small { display:block; font-family:"FiraVar",monospace; font-size:11px; letter-spacing:.14em; text-transform:uppercase; color:var(--bk-dim); }
.bk-day strong { display:block; font-family:"Newsreader",Georgia,serif; font-weight:400; font-size:1.35rem; margin-top:2px; }
.bk-day[aria-pressed="true"] { border-color:var(--bk-accent); box-shadow:inset 0 -4px 0 var(--bk-accent); }
.bk-day:hover, .bk-day:focus-visible { border-color:var(--bk-accent); outline:none; }

.bk-times { display:grid; grid-template-columns:repeat(auto-fill,minmax(104px,1fr)); gap:8px; margin-top:14px; }
.bk-time { min-height:48px; padding:12px 8px; background:var(--bk-panel); border:1px solid var(--bk-line);
  color:var(--bk-fg); font-family:"FiraVar",monospace; font-size:15px; cursor:pointer; touch-action:manipulation; }
.bk-time:hover, .bk-time:focus-visible { border-color:var(--bk-accent); outline:none; }
.bk-time[aria-pressed="true"] { background:var(--bk-accent); border-color:var(--bk-accent); color:var(--bk-accent-ink); }

.bk-form { margin-top:22px; border-top:1px solid var(--bk-line); padding-top:20px; display:grid; gap:14px; text-align:left; }
.bk-form label { display:grid; gap:6px; font-family:"FiraVar",monospace; font-size:12.5px; letter-spacing:.1em; text-transform:uppercase; color:var(--bk-dim); }
.bk-form input { font-family:Georgia,serif; font-size:16px; padding:13px 15px; min-height:48px; background:var(--bk-panel);
  border:1px solid var(--bk-line); color:var(--bk-fg); width:100%; border-radius:0; }
.bk-form input:focus { outline:2px solid var(--bk-accent); outline-offset:0; }
.bk-as { font-family:"FiraVar",monospace; font-size:13px; letter-spacing:.06em; color:var(--bk-dim); }
.bk-as button { background:none; border:none; color:var(--bk-fg); font:inherit; cursor:pointer; text-decoration:underline; text-underline-offset:3px; padding:4px; }
.bk-confirm { min-height:52px; padding:16px 26px; background:var(--bk-accent); color:var(--bk-accent-ink); border:none;
  font-family:"FiraVar",monospace; font-size:14px; letter-spacing:.1em; text-transform:uppercase; cursor:pointer; justify-self:start; touch-action:manipulation; }
.bk-confirm:hover { filter:brightness(.92); }
.bk-confirm:disabled { opacity:.55; cursor:wait; }
.bk-error { font-family:"FiraVar",monospace; font-size:13px; color:var(--bk-accent); line-height:1.5; }

.bk-done { border:1px solid var(--bk-line); padding:clamp(24px,4vw,40px); text-align:center; }
.bk-done h3 { font-family:"Newsreader",Georgia,serif; font-weight:400; font-size:clamp(1.8rem,4vw,2.4rem); }
.bk-done .bk-when { font-family:"FiraVar",monospace; font-size:15px; letter-spacing:.06em; margin-top:12px; color:var(--bk-fg); }
.bk-done p { margin-top:12px; color:var(--bk-dim); font-size:.98rem; line-height:1.6; }
@media (prefers-reduced-motion:no-preference) {
  .bk-times, .bk-form, .bk-done { animation:bkrise .3s cubic-bezier(.16,1,.3,1); }
  @keyframes bkrise { from { opacity:0; transform:translateY(8px); } to { opacity:1; transform:none; } }
}

/* Room for the cookie notice, on our pages only (bug 217). consent.js pins its
   card over the bottom of the screen and reserves nothing, so on a phone the
   last button on a page sat under it until the visitor answered: on /invite
   that was Next. The script is shared with client funnels and stays as it is;
   the room is made here, and only while the notice's host is in the page.
   Card measured at 171px on an iPhone 13 and a Pixel 7, 190px on an SE. */
body:has(> [data-rl-consent]) { padding-bottom: 13rem; }