/* ============================================================
   EBC Page Builder — Text Block (frontend)
   ============================================================ */

.ebc-textblock {
    box-sizing: border-box;
}

/* When a max-width is set, the block centres within its column. */
.ebc-textblock {
    margin-left: auto;
    margin-right: auto;
}

.ebc-textblock__inner > :first-child { margin-top: 0; }
.ebc-textblock__inner > :last-child  { margin-bottom: 0; }

/* Sensible defaults for common rich-text content; theme styles still win
   where they set these, because these are low-specificity element rules. */
.ebc-textblock__inner ul,
.ebc-textblock__inner ol {
    margin: 0 0 1em 1.5em;
}

.ebc-textblock__inner blockquote {
    margin: 0 0 1em;
    padding-left: 1em;
    border-left: 3px solid currentColor;
    opacity: 0.9;
}

.ebc-textblock__inner img {
    max-width: 100%;
    height: auto;
}

/* Inline Dashicons (inserted via the editor's Icon menu) inherit the
   surrounding text colour and size, so they sit neatly within a line.

   `display` and `vertical-align` are forced: Dashicons' own base rule sets
   inline-block, but some theme rules redeclare `display` on the glyph with
   enough weight to win and drop the icon onto its own line. Asserting it here
   keeps the icon flowing inline with the surrounding text. */
.ebc-textblock .dashicons {
    display: inline-block !important;
    vertical-align: middle !important;
    font-size: 1em;
    width: 1em;
    height: 1em;
    line-height: 1;
}

/* Icon row helper.
   Add the class "ebc-icon-row" to a Text Block's "Extra CSS class" field to lay
   its contents out as a single horizontal, wrapping row — handy for a strip of
   social Dashicons that the editor would otherwise drop onto separate lines
   (each icon ends up in its own paragraph). It works regardless of how the
   icons were entered: every direct child is flowed inline and any line breaks
   between them are ignored, so the icons sit side by side.

   Horizontal alignment follows the block's own "Default text alignment"
   setting (the children are inline-level), so left / centre / right all work. */
.ebc-textblock.ebc-icon-row .ebc-textblock__inner > * {
    display: inline-block;
    vertical-align: middle;
    margin: 0 .5em 0 0;
}
.ebc-textblock.ebc-icon-row .ebc-textblock__inner br {
    display: none;
}
/* Space the icons themselves, so a run of side-by-side icons in one paragraph
   (the normal result of inserting several from the Icon menu) gets a gap too —
   not just icons that landed in separate paragraphs. */
.ebc-textblock.ebc-icon-row .dashicons {
    margin: 0 .5em 0 0;
}
