/*
 * Copied verbatim from William's pasted <style> block for the "Brochure"
 * template, shared by 9 pages — confirmed via WP REST API + live fetch:
 *
 *   - 8113315   Brochures ("brochure-old", /brochure-old/) — the ONLY one
 *               of these 9 with the real `#brochure-page` wrapper this CSS
 *               targets. No embedded product grid — its content is a list
 *               of Issuu PDF `.iframe-wrapper` embeds.
 *   - 8972010   Brochure Homepage (/brochures/) — the CURRENT canonical
 *               hub. Uses `id="template-text-only"` instead of
 *               `#brochure-page`, so it OVERLAPS with
 *               temp-legacy/text-only-category/ (see note below). The
 *               `.best-frag-wrapper` grid of `.best-frag-item` cards
 *               linking to each seasonal brochure lives here.
 *   - 8976775, 8976785, 8976761, 8976790, 8973692, 8976787, 8976780
 *               The 7 individual seasonal brochure subpages (Autumn 2025,
 *               Early Summer 2025, Winter 2026, Winter 2025, Spring 2026,
 *               Spring 2025, Late Summer 2025). ALL confirmed to also use
 *               `id="template-text-only"` (checked live on
 *               /autumn-brochure-2025/) — same overlap as the homepage.
 *
 * OVERLAP WITH temp-legacy/text-only-category/: 8 of these 9 pages (every
 * one except 8113315) carry the `id="template-text-only"` marker, so that
 * fix's loader.php ALREADY re-enqueues valentte-shop / valentte-product /
 * cart.js + legacy-oversized.css on them. This subfolder does not
 * duplicate that. Because the `#brochure-page`-scoped rules below are
 * naturally inert on those 8 pages (there's no `#brochure-page` ancestor —
 * only `.best-frag-wrapper` / `button.clear_button` / `h2.subpage-padding`
 * / each page's own `article#post-*` rule are live there), there was no
 * `!important`/specificity conflict to fix this time, unlike
 * temp-legacy/ambassadors/ — nothing needed rescoping. Cross-reference
 * note added to temp-legacy/text-only-category/README.md. Do not delete
 * that folder without checking these 8 pages first.
 *
 * FLAG: this CSS's own `article#post-8976767` and `article#post-9071243`
 * rules (Christmas Brochure 2025 and Summer Brochure 2026 — both confirmed
 * real, published pages via REST) are NOT among the 9 IDs this fix
 * matches. Kept verbatim since they were in the pasted block, but they're
 * unreachable dead code here — this stylesheet never loads on either page.
 * If those two also need this template, add their IDs to
 * VALENTTE_TEMP_BROCHURE_PAGE_IDS in loader.php.
 *
 * No `.woocommerce` / `ul.products` conflict — none of these 9 pages embed
 * a product grid (confirmed live on all fetched pages), so loader.php
 * doesn't enqueue shop/product/cart assets.
 *
 * No JS needed — the brochure viewers are third-party Issuu `<iframe>`
 * embeds, not a custom script.
 */

.best-frag-wrapper {
    width: 75%;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 10px;
    padding: 0 45px;
    margin-bottom: 40px;
    justify-self: center;
}

#template-text-only {
    margin: 0 0 40px !important;
}

/* Tablet + Mobile */
@media (max-width: 1024px) {
    .best-frag-wrapper {
        grid-template-columns: repeat(2, 1fr);
        width: 100%;
    }

    p.brochure-text {
        padding-left: 5%;
        padding-right: 5%;
    }
}

@media (max-width: 380px) {
    .best-frag-wrapper {
        grid-template-columns: 1fr;
    }
}

#brochure-page {
    padding: 50px 20px 0;
    text-align: center;
    color: var(--text);
}

#brochure-page p {
    max-width: 1080px;
    margin: 0 auto 27px;
}

#brochure-page .wp-block-group__inner-container.is-layout-constrained {
    max-width: 1500px;
    margin: 0 auto;
    padding: 0;
}

#brochure-page a button {
    border-radius: 5px !important;
    border: 1px solid #211F20;
    width: 100%;
    box-shadow: none;
    color: var(--text);
    text-transform: capitalize;
    font-size: 18px !important;
    font-weight: 400;
    background-color: #fff;
    margin: 0 auto 50px;
    max-width: 286px;
}

button.clear_button {
    border-radius: 5px !important;
    border: 1px solid #211F20;
    width: 100%;
    box-shadow: none;
    color: var(--text);
    text-transform: capitalize;
    font-size: 18px !important;
    font-weight: 400;
    background-color: #fff;
    margin: 0 auto 50px;
    max-width: 286px;
}

.best-frag-wrapper H2 {
    margin-bottom: 30px;
    color: var(--text);
}

.wp-block-group__inner-container > a {
    width: 100%;
    display: block;
    text-align: center;
}

#brochure-page .iframe-wrapper {
    margin-bottom: 60px;
}

@media screen and (max-width: 781px) {
    #brochure-page {
        padding: 20px;
    }
}

/**** Sub page alignments & Styling ****/
h2.subpage-padding {
    padding-top: 3%;
}

article#post-8973692 {
    text-align: center;
}

article#post-8976761 {
    text-align: center;
}

article#post-8976767 {
    text-align: center;
}

article#post-8976775 {
    text-align: center;
}

article#post-8976780 {
    text-align: center;
}

article#post-8976785 {
    text-align: center;
}

article#post-8976787 {
    text-align: center;
}

article#post-8976790 {
    text-align: center;
}

article#post-8972010 {
    text-align: center;
}

article#post-9071243 {
    text-align: center;
}