/**
 * Editable header + footer template parts.
 *
 * parts/header.html and parts/footer.html are built from core blocks, so two
 * of core's own defaults land on markup that used to be hand-written HTML:
 *
 *  1. A group in the default "flow" layout gets `:root :where(.is-layout-flow) > *`
 *     from the layout stylesheet, which puts a 24px top margin on every child
 *     (theme.json's blockGap). The parts space their children with flex/grid
 *     gaps instead, so that margin is switched off.
 *
 *  2. A core/paragraph block carries the .wp-block-paragraph class, and
 *     theme.json gives that class the body text colour plus a 1.5rem bottom
 *     margin. Both are re-declared here for the parts' own surfaces.
 *
 * The editor rules repeat the .editor-styles-wrapper prefix, following the
 * convention editor.css already uses, so the site editor canvas previews the
 * parts the way the front end renders them.
 */

/* ---------------------------------------------
   1. Flow layout block gap
   --------------------------------------------- */

/* core's own rule is `:root :where(.is-layout-flow) > *`, i.e. one class of
   specificity; scoping it to a part makes it win without !important. */
.boho-part :is(.is-layout-flow, .wp-block-group-is-layout-flow) > * {
  margin-block-start: 0;
  margin-block-end: 0;
}

/* ---------------------------------------------
   2. Element defaults
   --------------------------------------------- */

/* Margin only: .boho-part p is already more specific than .wp-block-paragraph,
   and no part class sets a paragraph margin, so nothing is overridden. */
.boho-part p {
  margin-block: 0;
}

/* The colour is a class (.wp-block-paragraph), so a plain element reset cannot
   beat it without also beating the part's own colour classes. The two surfaces
   that relied on an inherited colour are restored, and the two paragraphs that
   had a colour of their own are re-declared with the values global.css gives
   the hand-written markup. */
.boho-part--header .boho-header-note,
.boho-part--footer .footer-bottom-note {
  color: inherit;
}

.boho-part--footer .footer-logo {
  color: #fff;
}

.boho-part--footer .footer-tagline {
  color: rgba(255, 255, 255, 0.65);
}

/* The copyright line is the one text in the footer bottom that used to be a
   bare <span>, and that row's nowrap rule is written for a span. */
.boho-part--footer .footer-bottom-note {
  white-space: nowrap;
}

/* ---------------------------------------------
   3. Editor canvas
   --------------------------------------------- */

/* editor.css caps every block at an 800px prose measure so post content stays
   readable. The parts are the page's own chrome and are meant to span the full
   width, so the editor measure is lifted for them. */
.editor-styles-wrapper .boho-part,
.editor-styles-wrapper .boho-part .wp-block,
.editor-styles-wrapper .boho-part * {
  max-width: none;
}

/* A dynamic block is wrapped in a plain div while it is being edited, which
   turns the surrounding flex gap into a gap between wrappers. display: contents
   keeps the editor preview identical to the front end. */
.editor-styles-wrapper .boho-part .wp-block-boho-dynamic-text {
  display: contents;
}