/* IMPL-0016 (Branding): hand-authored, not npm-managed — sizes the admin-uploaded logo image in
 * the navbar without an inline style="..." attribute (this app's CSP has no unsafe-inline/hash/
 * nonce allowance for style attributes, same reasoning as forms.css/sidenav.css). Loaded
 * unconditionally by UikitTheme alongside 'uikit'/'forms', since the header renders on every page. */
.branding-logo-image {
    height: 32px;
    width: auto;
}

/* The homepage hero's left column (UikitTheme::renderHeader()) — a separate, optional upload from
 * the navbar Logo. Deliberately no uk-grid-match between the two columns — each is sized
 * independently (the image column fixed at 240px, the text column by its own content),
 * `.branding-header-section` just caps the overall section so neither one can push the whole hero
 * past 240px regardless. */
.branding-header-section {
    max-height: 240px;
    overflow: hidden;
}

/* IMPL-0018: the actual `background-image: url(...)` comes from MediaAssetRenderer's own
 * dynamically-generated, per-asset CSS class (media-bg-{uid}-{size}, merged onto the same div
 * alongside this one) — this class only supplies the structural/presentation properties that
 * apply uniformly no matter which MediaAsset currently fills the Header Image slot: a fixed
 * height (an empty div has no intrinsic height of its own) and how the image should fit that box.
 *
 * No explicit width here, deliberately: this div IS the grid column UikitTheme's
 * uk-child-width-1-2@s already sizes to 50% (its own CSS rule targets this div directly, as a
 * direct child of the uk-grid). An explicit width here previously fought that rule at equal
 * specificity (this stylesheet loads after uikit.min.css, so it was winning) and forced the
 * column to 100% width — which is also why the second column got pushed onto its own row
 * (uk-grid-stack/uk-first-column on both, confirmed against the actual rendered output). */
.branding-header-image {
    background-size: cover;
    background-position: center;
    height: 240px;
}