whose .clearfix holds only
.summary and a payment notice — there is no woocommerce-product-gallery —
and the real content sits below in #et-boc Divi sections.
Section 16's two-column grid assumes a gallery, so on these six the summary
was being squeezed into one half of an empty two-column layout. Detect the
missing gallery with :has() and fall back to a single column.
(:has() is safe here: this file is enqueued, so WordPress's CSSLint — which
rejects it and blocks saving — is no longer in the path.)
========================================================================== */
body.single-product div.product > .clearfix:not(:has(.woocommerce-product-gallery)){
display: block !important;
}
body.single-product div.product > .clearfix:not(:has(.woocommerce-product-gallery)) .summary.entry-summary{
max-width: 760px;
margin: 0 auto !important;
text-align: center;
}
body.single-product div.product > .clearfix:not(:has(.woocommerce-product-gallery)) .summary form.cart{
justify-content: center;
max-width: 520px;
margin-left: auto !important;
margin-right: auto !important;
}
body.single-product div.product > .clearfix:not(:has(.woocommerce-product-gallery)) .summary .yith-wcwl-add-to-wishlist{
text-align: center;
}
/* Empty payment placeholder leaves a gap on these layouts */
body.single-product #payment-method-message:empty{ display: none !important; }
/* Give the builder content below the summary the same measure and rhythm as
the rest of the site. */
body.single-product .et_builder_inner_content.product .et_pb_section{
background-color: transparent !important;
padding-top: 24px !important;
padding-bottom: 24px !important;
}
body.single-product .et_builder_inner_content.product .et_pb_row{
width: 100% !important;
max-width: 900px !important;
}
body.single-product .et_builder_inner_content.product .et_pb_text_inner p{
font-size: 16.5px !important;
line-height: 1.85 !important;
color: var(--nn-ink) !important;
}
body.single-product .et_builder_inner_content.product .et_pb_text_inner h2,
body.single-product .et_builder_inner_content.product .et_pb_text_inner h3{
font-family: var(--nn-display) !important;
color: var(--nn-plum) !important;
}
/* ==========================================================================
30. ROUND-UP FIXES
========================================================================== */
/* --- 30.1 Post title band: gap under the header, rounded corners -----------
It was bleeding to the article edges via negative margins, so it ran hard
against the fixed header with square corners. Inset it instead.
(#page-container already carries padding-top:80px from
.et_fixed_nav.et_show_nav, so only a small extra gap is needed here.)
-------------------------------------------------------------------------- */
body.single-post article.et_pb_post > .et_post_meta_wrapper{
margin: 22px 0 46px !important;
padding: 58px 36px 46px !important;
border: 1px solid var(--nn-line) !important;
border-radius: 28px !important;
overflow: hidden;
}
/* --- 30.2 Centre every line in the Shop now panel --------------------------
.nn-post-cta sits inside .entry-content, and
body.single-post .entry-content p{ margin: 0 0 20px !important }
outweighs the panel's own `margin: 0 auto`, so the narrower sub-paragraph
was pinned left instead of centred. Restore the auto margins.
-------------------------------------------------------------------------- */
body.single-post .entry-content .nn-post-cta p,
body.single-post .entry-content .nn-post-cta .nn-post-cta__sub{
margin-left: auto !important;
margin-right: auto !important;
text-align: center !important;
}
body.single-post .entry-content .nn-post-cta{ text-align: center !important; }
/* --- 30.3 Drop the Gutenberg separator rules -------------------------------
9
across the posts. The h3 rules already
give each section its own rule, so these read as clutter. Their spacing is
handed back to the following heading.
-------------------------------------------------------------------------- */
body.single-post .entry-content hr.wp-block-separator,
body.single-post .entry-content hr{ display: none !important; }
/* --- 30.4 Shop sort dropdown ------------------------------------------------
The closed control is fully styled in section 22.2. The open list is drawn
by the operating system, not the page, so CSS reach is limited: background
and text colour land in Chrome and Firefox on Windows, and the highlight
can be nudged in Firefox via :checked. A fully styled list would need a
custom dropdown component rather than a native