/* ============================================================================ genk-vccorp.css — publisher adapter for VCCorp (Genk / Kenh14) ---------------------------------------------------------------------------- THE ONLY PLACE PUBLISHER CSS LIVES. Never inline these rules into a piece's main.css and never re-author them per article — that is precisely how the previous system drifted into a bug that appeared only on live. Copied byte-for-byte into /css/ at delivery. CMS_ADAPTER_DRIFT compares the copy against this file; edit here, then re-copy. Host chain: .k14-sp-wrapper | .genk-sp-wrapper .sp-body-content .w980 (caps width at 980px — overridden below) .sp-detail .sp-detail-maincontent .sp-detail-content[data-role=content] .detail-emagazine [bundle content] Every host-facing selector is rooted under .k14-sp-wrapper or .genk-sp-wrapper so this file is completely inert on any other site. The single exemption is the :root custom-property block below. ========================================================================== */ /* --- Host chrome ----------------------------------------------------------- Genk's sticky header: div.sp-sticky-header, position fixed, top 0, z-index 100, 44px tall. Top-anchored fixed UI offsets by this token. Declared on :root, NOT on the wrapper. Custom properties inherit downward only, and overlays are appended to — an ancestor of the wrapper — so a wrapper-scoped value is invisible to them and silently resolves to the 0px default, putting the UI under the header. Measured: wrapper-scoped gives a body-appended element 0px; :root-scoped gives it 44px. -------------------------------------------------------------------------- */ :root { --td-host-offset: 44px; } /* --- Release the 980px cage ------------------------------------------------ */ .k14-sp-wrapper .sp-body-content, .k14-sp-wrapper .sp-body-content .w980, .k14-sp-wrapper .sp-body-content .w980 .sp-detail, .k14-sp-wrapper .sp-body-content .sp-detail-maincontent, .k14-sp-wrapper .sp-body-content .sp-detail-content, .genk-sp-wrapper .sp-body-content, .genk-sp-wrapper .sp-body-content .w980, .genk-sp-wrapper .sp-body-content .w980 .sp-detail, .genk-sp-wrapper .sp-body-content .sp-detail-maincontent, .genk-sp-wrapper .sp-body-content .sp-detail-content { width: 100% !important; max-width: 100% !important; padding: 0 !important; margin-left: auto !important; margin-right: auto !important; overflow: visible !important; } /* --- Reset the emagazine container ---------------------------------------- */ .k14-sp-wrapper .sp-detail-content .detail-emagazine, .k14-sp-wrapper .sp-detail-content .detail-content, .genk-sp-wrapper .sp-detail-content .detail-emagazine, .genk-sp-wrapper .sp-detail-content .detail-content { padding: 0 !important; margin: 0 !important; background-color: transparent !important; background-image: none !important; } /* --- Hide admin-rendered metadata ----------------------------------------- The CMS renders title / sapo / author / time from admin fields, which duplicates the hero. Hide them. -------------------------------------------------------------------------- */ .k14-sp-wrapper .sp-body-content .sp-detail .sp-sapo, .k14-sp-wrapper .sp-body-content .sp-detail-title, .k14-sp-wrapper .sp-body-content .sp-detail .sp-author, .k14-sp-wrapper .sp-body-content .sp-detail .sp-time, .genk-sp-wrapper .sp-body-content .sp-detail .sp-sapo, .genk-sp-wrapper .sp-body-content .sp-detail-title, .genk-sp-wrapper .sp-body-content .sp-detail .sp-author, .genk-sp-wrapper .sp-body-content .sp-detail .sp-time { display: none !important; } /* --- Beat the publisher's inherited colour -------------------------------- Genk ships .k14-sp-wrapper .sp-body-content .sp-detail { color: #222 } at specificity (0,3,0). These selectors match it and load later, so they win. background-COLOR longhand, never the shorthand: the shorthand resets every background longhand including background-image, and !important locks the reset in. That is production failure F1 — a doodle pattern that rendered in local preview and vanished on live, because this rule only matches when the host wrapper is present. The piece sets its own colour and background-image on .td-emag__wrapper; this only guarantees the publisher's value does not win. -------------------------------------------------------------------------- */ .k14-sp-wrapper .sp-detail-content .td-emag__wrapper, .genk-sp-wrapper .sp-detail-content .td-emag__wrapper { background-color: inherit !important; } /* --- Overlay stacking ------------------------------------------------------ Host header sits at z-index 100; overlays must clear it. -------------------------------------------------------------------------- */ .k14-sp-wrapper .td-lightbox, .genk-sp-wrapper .td-lightbox { z-index: 9999; }