/* WordPress-only adjustments to the mockup's styles (kc-storybook.css is generated from the mockup;
   this file is hand-written). Keep it short: anything about the look belongs in the mockup. */

/* GoHighLevel forms and calendars (the Form or calendar block), on the mockup's clipboard paper,
   and the card that stands in until a form's id is set. */
.kc-embed__frame { display: block; width: 100%; border: 0; }
.kc-embed--fallback { padding: 6px 2px; }
.kc-embed__lead { margin: 0 0 18px; color: var(--sb-ink, #1f2d2c); font: 700 1.1875rem/1.35 var(--kc-font-display); text-wrap: balance; }
.kc-embed__centers { display: grid; gap: 20px; margin: 0; padding: 0; list-style: none; }
/* Each center the same way, however long its address: the call button, its email underneath. */
.kc-embed__centers li { display: grid; justify-items: start; gap: 8px; }
.kc-embed__email { padding-left: 6px; font-weight: 600; overflow-wrap: anywhere; }
/* Careers: the hiring address as a button above the centers' phones; on phones it wraps only after
   the @ (kc_email_html's line-break point). */
.kc-embed__apply { margin: 0 0 26px; }
.kc-embed__apply .kc-btn { max-width: 100%; white-space: normal; text-align: left; }
/* The tour's center buttons, above the chosen center's calendar (or alone, before one is chosen). */
.kc-embed__choose { margin-bottom: 22px; }
.kc-embed--choose .kc-embed__choose { margin-bottom: 0; padding: 6px 2px; }
.kc-embed__choices { display: flex; flex-wrap: wrap; gap: 10px 12px; margin: 0; padding: 0; list-style: none; }
.kc-embed__choices .kc-btn--ghost { color: var(--kc-teal-700) !important; }

/* IKS forms (Contact Us, Schedule a Tour): IKS's frame on the clipboard paper; on test copies of the
   site, the notice it waits behind; and the thank-you shown in its place after sending (the mockup's
   thank-you state, sized for the paper). */
.kc-embed__iks iframe { display: block; width: 100%; min-height: 480px; border: 0; }
.kc-embed__iks[hidden], .kc-embed__lock[hidden], .kc-embed__thanks[hidden] { display: none; }
.kc-embed__lock { padding: 6px 2px; }
.kc-embed__note { margin: 0 0 18px; color: var(--sb-text, #2e3b3b); font: 500 1rem/1.5 var(--kc-font-body); }
.kc-embed__thanks { display: grid; justify-items: center; gap: 18px; padding: 10px 0 4px; text-align: center; }
.kc-embed__thanks .kc-thanks__title { font-size: clamp(1.625rem, 1.2rem + 1.4vw, 2.25rem); }
.kc-embed__thanks .kc-thanks__sub { font-size: clamp(1.125rem, 1rem + .5vw, 1.375rem); }
.kc-embed__ticket { width: 100%; gap: 18px; margin-top: 8px; padding: 32px clamp(22px, 4vw, 40px) 30px; }
.kc-embed__ticket::after { display: none; }
.kc-embed__ticket .sb-ticket__title { font-size: clamp(1.375rem, 1.1rem + 1vw, 1.75rem); }
.kc-embed__ticket .sb-ticket__checks { grid-template-columns: minmax(0, 1fr); }

/* The admin bar (signed-in users only) sits above the page: the sticky header stays under it. */
.admin-bar .kc-header { top: calc(var(--wp-admin--admin-bar--height, 32px) - var(--kc-topbar-h)); }
@media screen and (max-width: 600px) {
  .admin-bar .kc-header { top: calc(-1 * var(--kc-topbar-h)); }
}
