/** * Styles for template-gutenberg-dark.php * * Overrides Enfold's `.main_color` (white background) wrapper that page.php * normally applies, so this template's content area matches theme.json's * default dark palette (navy background, white text) — the same colors the * block editor canvas shows. */ .gb-dark-template.container_wrap { background-color: var(--wp--preset--color--background, #0C002F); color: var(--wp--preset--color--foreground, #fff); } /** * CU-86bbg70za: this template-wide default was outranking blocks that set * their own explicit link color in the editor (e.g. the success-story "Watch * ___ story" links, styled orange via block supports) — `.entry-content a` * has higher specificity (0,2,1) than core's own per-block override * `.wp-elements- a:where(...)` (0,1,1), so this rule always won * regardless of source order. `has-link-color` is the marker class core adds * to any block with an explicit link color set (it sits on the same element * as the `wp-elements-` class), so excluding its descendants here lets * this rule act as a genuine fallback default instead of a forced override. */ .gb-dark-template .entry-content a:not([class*=button]):not(.wp-element-button):not(.has-link-color a) { color: var(--wp--preset--color--sky-blue, #69BCD2); } /** * Footer background for the "Dark Header and Footer" page option. * * footer.php loads the same New Footer page for both `new-header-and-footer` * and `dark-header-and-footer`, so the footer markup is shared by 27 pages and * cannot itself be changed without repainting all of them. Its sections carry * Enfold's `alternate_color`, which `#top .alternate_color` paints black — the * only background rule matching them (confirmed against the live cascade). * * The purple that already exists for footers lives in footer-alternate.scss * under `.footer-section-alternate`, an ALB *section* style. That can't be used * here: applying it means editing the shared footer page, which would turn all * 27 pages purple. So the colour is re-declared, gated on the body class, which * currently matches exactly one page. * * `--wp--preset--color--background` is the same token * `.gb-dark-template.container_wrap` above uses, so the footer matches the * content area by definition instead of by a copied hex. It resolves to #0C002F * in footer scope, which matches the purple in the design. * * `#top` is Enfold's ``, so the body class is compounded onto it rather * than used as an ancestor. That lands at (1,4,0) against the black rule's * (1,1,0), so no `!important` is needed. */ #top.has-dark-header-and-footer .footer-page-content .avia-section.alternate_color { background-color: var(--wp--preset--color--background, #0C002F); } /** * Base Gutenberg block rules. * * The theme's own gutenberg.scss and the punch-core plugin's gutenberg.css * scope every rule under `.single-content-section .container .content * .entry-content-wrapper`, which matches Enfold's normal single/page * template markup. template-gutenberg-dark.php renders a different DOM * shape (`.container_wrap.gb-dark-template .container .entry-content-wrapper`, * no `.single-content-section` or `.content` ancestor), so none of those * base rules — including text alignment — ever match here. Re-declared * below, scoped to this template's actual markup. */ .gb-dark-template .entry-content-wrapper .has-text-align-left { text-align: left; } .gb-dark-template .entry-content-wrapper .has-text-align-center { text-align: center; } .gb-dark-template .entry-content-wrapper .has-text-align-right { text-align: right; } .gb-dark-template .entry-content-wrapper .aligncenter { clear: both; display: block; float: none; margin-left: auto; margin-right: auto; text-align: center; } .gb-dark-template .entry-content-wrapper .wp-block-image .alignleft { float: left; margin: 10px 30px 10px 0; } .gb-dark-template .entry-content-wrapper .wp-block-image .alignright { float: right; margin: 10px 0 10px 30px; } .gb-dark-template .entry-content-wrapper .wp-block-image .aligncenter { margin-left: auto; margin-right: auto; } .gb-dark-template .entry-content-wrapper > *:first-child { margin-top: 0 !important; } .gb-dark-template .entry-content-wrapper > *:last-child { margin-bottom: 0 !important; } /** * CU-86bbg4yvz: close the gap between the header and a full-bleed opening section. * * Enfold's css/layout.css gives `.content, .sidebar { padding-top: 50px }`, and * this template's `

` carries `content` (see template-gutenberg-dark.php), so * every page on this template gets 50px above its first block. On a page that opens * with a full-bleed hero that reads as a stripe of page background wedged between * the header and the hero, which is what QA reported on desktop and mobile. * * Scoped by `:has()` to pages whose first block is actually marked full-bleed, * rather than zeroing the padding for the template as a whole. Three pages use this * template — the comparison page, Homepage August 2026 and a test page — and * Homepage August 2026 opens with `reverselogix/hero-flex`, which has the same 50px * gap but was not part of this report. Keying off `.is-style-full-bleed` leaves it * untouched, so this fix cannot silently restyle the homepage. If the homepage * should lose its gap too, that is a deliberate follow-up: either add the class * there or extend this selector to `.ep-hero-flex.alignfull`. * * The child combinators mirror the template's actual markup exactly * (`.content > .post-entry > .entry-content-wrapper > .entry-content > block`), so * the rule cannot reach a full-bleed group nested deeper inside the page. * * Only `padding-top` is reset. The 50px bottom padding is left in place: no page * currently *ends* with a full-bleed section, and the final CTA carries its own * 122px of bottom padding, so the footer seam was never part of this bug. */ .gb-dark-template .content:has(> .post-entry > .entry-content-wrapper > .entry-content > .wp-block-group.is-style-full-bleed:first-child) { padding-top: 0; } /*# sourceMappingURL=template-gutenberg-dark.css.map */