/*
 * REVIEW-23: /gillingham/booking/ and /maidstone/booking/, the two routes
 * that never joined the redesign. Enqueued from inc/bands-booking.php on
 * these two routes only, filemtime-versioned.
 *
 * ON-DARK, NOT ON-LIGHT. Both pages keep their original Divi section
 * background (a dark wood-grain photograph under a 60% black scrim,
 * untouched by this task), so the intro band below follows the sitewide
 * on-dark hero pattern (.myth-band-hero__h1/__body, css/myth-bands.css:
 * White text, centred), not the gift band's Ink-on-Parchment reading
 * column css/myth-gift.css uses on its own Parchment ground.
 *
 * Band padding 48/64/96 comes from .myth-band in css/myth-bands.css; this
 * file adds only the content column and the one frozen-adjacent surface
 * neither page ever had styled.
 */

.myth-booking__inner {
  position: relative;
  z-index: 1;
  max-width: 720px;
  margin-left: auto;
  margin-right: auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
  gap: 12px;
}

.myth-booking__title {
  font-size: clamp(2.2rem, 5vw, 3.6rem);
  line-height: 1.1;
  color: #FFFFFF;
}

.myth-booking__line {
  font-size: 18px;
  line-height: 1.5;
  color: #FFFFFF;
  max-width: 640px;
}

/* THE MAIDSTONE STATUS BLOCK. Deliberately parallel to
   .maidstone-gift-placeholder (css/myth-gift.css), same structure, same
   visual language: a white card, elevation step 1, on whatever ground it
   sits on, so a status reads as a panel rather than as ghost text on the
   page's own dark photograph. This is the ORIGINAL: R13 built the gift
   route's placeholder by copying THIS class's structure and never gave
   the treatment back here, which is the regression REVIEW-23 closes (R13's
   own Acceptance criterion: "the Maidstone placeholder matches the
   booking page's"). The class name is the flip pass's grep handle
   (inc/bands-gift.php's own comment on its twin) and is never renamed. */
.maidstone-booking-placeholder {
  max-width: 65ch;
  margin: 32px auto 0;
  padding: 24px 20px;
  background-color: #FFFFFF;
  border: 1px solid rgba(212, 169, 74, 0.55);
  border-radius: 4px;
  box-shadow: var(--myth-elev-1);
  text-align: left;
}

@media (min-width: 768px) {
  .maidstone-booking-placeholder {
    padding: 28px 32px;
  }
}

.maidstone-booking-placeholder p {
  color: #1C1310;
  margin: 0 0 12px;
}

.maidstone-booking-placeholder p:last-child {
  margin-bottom: 0;
}

/* MANUAL-42 (2026-09-12, the user's own instruction). The FAQ block
   MANUAL-38 dropped into the existing "BOOKING RELATED FAQS" container
   (inc/bands-booking.php's myth_booking_faq_render()) carries no
   .myth-band wrapper on purpose, so it never picked up that class's own
   bottom padding; measured live before this fix, the block's own bottom
   edge sat flush against the footer's top edge, 0px, on both routes.
   Scoped to `.myth-booking-faq`, the second class that render function's
   wrapper carries, not to the shared `.myth-band-faq` class itself:
   `.myth-band-faq` is reused by the FAQ hub and by Gillingham's,
   Maidstone's and Events' own "Questions we get a lot" bands, and a
   padding change on it would move every one of those too, out of scope
   here. Values are `.myth-band`'s own three breakpoints
   (css/myth-bands.css), not independently chosen, so this block ends
   with the same rhythm as every other band on the site.

   CORRECTION, MANUAL-47 (2026-09-12, user-reported). "Top spacing,
   background and every other property of the block are untouched" above
   did not anticipate the interaction: `.myth-band-faq` (css/myth-bands.css)
   paints `background: #1C1310` on this same wrapper, and padding sits
   INSIDE the border box, so the padding-bottom this rule adds became
   visible as more solid Ink, not as a gap; both the real Q&A rows and the
   new trailing space rendered as one continuous dark rectangle. Fixed by
   moving the Ink fill off the wrapper and onto each visible row instead
   (below): the wrapper itself is now `background: transparent`, so the
   padding area shows the section's own dark wood-grain photograph, and
   `.myth-band-faq__item` (which carried no background of its own before
   this fix, confirmed live) is painted Ink directly, at the exact same
   left/right bounds the wrapper's old background used, so every row looks
   pixel-identical to before. The padding-bottom values themselves are
   unchanged. */
.myth-booking-faq {
  background: transparent;
  padding-bottom: 48px;
}

.myth-booking-faq .myth-band-faq__item {
  background: #1C1310;
}

@media (min-width: 768px) {
  .myth-booking-faq {
    padding-bottom: 64px;
  }
}

@media (min-width: 1024px) {
  .myth-booking-faq {
    padding-bottom: 96px;
  }
}

/* -----------------------------------------------------------------------
 * MANUAL-47 (2026-09-12, the user's own instruction). "BOOKING RELATED
 * FAQS" heading, both routes: raw Divi default, `Cabin, Helvetica, Arial,
 * Lucida, sans-serif`, the same pre-rebuild pattern found and fixed on
 * /events/ (MANUAL-43). Font-family only: size, colour and weight
 * (already 500) are untouched except where the swap itself breaks
 * wrapping, checked live rather than assumed, at all four widths, not
 * only 390 (that was the one MANUAL-43 named, but the real regression
 * this heading hit was at 768):
 *   390:  40px, already 2 lines under Cabin, still 2 lines under Julius
 *         Sans One at 40px. No regression, no change.
 *   768:  50px, 1 line under Cabin, 2 lines under Julius Sans One at the
 *         same 50px (this typeface sets wider). 48px is the largest size
 *         that holds 1 line here; shipped.
 *   1024/1440: 50px, 1 line under both fonts. No regression, no change;
 *         50px kept.
 * Scoping class added to the module in the Divi builder
 * (`myth-booking-faq-heading`, this task's own one structural
 * post_content edit per route, alongside the ornament removal below);
 * identical on both routes, since both carried the identical module.
 * `.et_pb_text` restated alongside the class (0,2,1) rather than the
 * class alone (0,1,1), since Divi's own per-post generated CSS
 * (`.et_pb_text_0 h2{font-size:...}`) is the same specificity as a bare
 * class selector and this project has already found that fight lost on
 * source order alone once this session (MANUAL-45/46's own
 * `.myth-events-what` padding correction). --------------------------- */
.myth-booking-faq-heading.et_pb_text h2 {
  font-family: "Julius Sans One", sans-serif;
}

@media (min-width: 768px) and (max-width: 1023px) {
  .myth-booking-faq-heading.et_pb_text h2 {
    font-size: 48px;
  }
}