/* ==========================================================================
   CALENDLY LOADING STATE, added 28 Jul 2026.

   Why this exists. Measured on /book-a-consultation/, cold, consent granted:
   Calendly is a serial two-hop chain. widget.js lands ~600ms, creates the
   iframe immediately, and the iframe itself does not finish until ~1286ms.
   The container already carries an inline height (720px desktop, 840px on
   tablet and mobile), so there is no layout shift, but for about a second it
   is an empty transparent box, and then a blank white iframe. Burak's point:
   a parent who is not confident with websites reads that as broken.

   So the skeleton must sit ABOVE the iframe and be removed on the iframe's
   load event, not merely be painted behind it. A CSS-only version would be
   covered by the blank iframe at ~600ms and defeat the purpose.
   ========================================================================== */

.calendly-inline-widget{ position: relative; }

.iws-cal-loading{
	position: absolute;
	inset: 0;
	z-index: 2;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	gap: 18px;
	border-radius: 12px;
	/* Gradient, not a flat fill, per IWS_DESIGN.md 3.4. Periwinkle family. */
	background: linear-gradient(160deg, #EAF1FF 0%, #FFFFFF 100%);
	border: 1px solid rgba(10, 23, 118, .08);
	opacity: 1;
	transition: opacity .28s ease;
}

.iws-cal-loading.is-ready{ opacity: 0; pointer-events: none; }

.iws-cal-loading__spinner{
	width: 34px;
	height: 34px;
	border-radius: 50%;
	border: 3px solid rgba(10, 23, 118, .15);
	border-top-color: #0A1776;
	animation: iws-cal-spin .9s linear infinite;
}

.iws-cal-loading__label{
	font-family: var(--iws-font-display);
	font-weight: 600;
	font-size: .95rem;
	letter-spacing: .01em;
	color: #0A1776;
	text-align: center;
	padding: 0 24px;
	max-width: 34ch;
	line-height: 1.5;
}

@keyframes iws-cal-spin{ to{ transform: rotate(360deg); } }

/* Honour the OS setting: stop the rotation, keep the message. */
@media (prefers-reduced-motion: reduce){
	.iws-cal-loading__spinner{ animation: none; border-top-color: rgba(10,23,118,.45); }
	.iws-cal-loading{ transition: none; }
}

/* ==========================================================================
   The consent placeholder over the Calendly embed (/book-a-consultation/).
   Pre-consent, Complianz swaps the calendar for a bare grey box reading
   "Accept cookies to load this content" — 840px of nothing on the page whose
   only job is booking. This dresses the SAME element as an intentional panel.
   The wording itself is corrected via the cmplz blocked-content text filter
   in functions.php; this is the visual half. 1 Aug 2026.
   ========================================================================== */
.calendly-inline-widget.cmplz-placeholder-element{
  background-image:linear-gradient(160deg,#EAF1FF 0%,#CFE0FF 100%) !important;
  border:1px solid #CFE0FF;border-radius:22px;
  display:flex;align-items:center;justify-content:center;
}
.calendly-inline-widget .cmplz-blocked-content-notice{
  font-family:'Sora',sans-serif !important;font-size:15px !important;font-weight:700 !important;
  color:#0A1776 !important;background:#FFFFFF !important;border:1px solid #CFE0FF !important;
  border-radius:999px !important;padding:14px 26px !important;box-shadow:0 10px 28px rgba(8,16,60,.12);
}
