/*
 * Copied from William's pasted <style> block for page 9033890
 * ("Ambassadors", https://valentte.com/ambassadors/). Verified against the
 * live page: `valentte-tiktok-section`, `valentte-tiktok-user-section`,
 * `dropdown_boxes`, `wp-block-details`, and multiple `id="template-text-only"`
 * divs all match real markup there.
 *
 * IMPORTANT — this page ALSO matches temp-legacy/text-only-category/'s
 * content marker (it contains `id="template-text-only"`), so that fix's
 * loader.php ALREADY re-enqueues valentte-shop / valentte-product / cart.js
 * and legacy-oversized.css here. This subfolder does NOT duplicate any of
 * that — it only adds this page's own extra sections (TikTok blocks + FAQ
 * accordion) on top. See the cross-reference note added to
 * temp-legacy/text-only-category/README.md. Do not delete
 * text-only-category/ without checking this page first.
 *
 * CONFIRMED CONFLICT, fixed: legacy-oversized.css declares an unscoped
 * `.wp-block-group__inner-container { max-width: 2000px !important; ... }`
 * that applies on every page it loads on, including this one. The pasted
 * CSS's own `.wp-block-group__inner-container { max-width: 100%; }` would
 * lose to that !important rule as originally written. Rescoped below to
 * `.page-id-9033890 .wp-block-group__inner-container` (+ !important) so it
 * wins by specificity for this page, without touching the shared file used
 * by ~59 other pages.
 *
 * FIXED a dead selector: the source's `wp-block-columns.dropdown_boxes...`
 * rule (meant to size the FAQ accordion's columns to 78% width) was
 * missing its leading `.` — as written it matched nothing (a nonexistent
 * `<wp-block-columns>` element). Added the dot; the real element (confirmed
 * live) is `.wp-block-columns.dropdown_boxes...`.
 *
 * LEFT AS-IS (dead, but harmless): a second, similarly malformed
 * `hp-read-more-btn { ... }` rule further down, also missing its leading
 * dot. It's a 100% redundant duplicate of the correctly-dotted
 * `.hp-read-more-btn` rule just above it, so fixing it would be a no-op
 * either way — not touched.
 *
 * No `.woocommerce` / `ul.products` conflict of its own — this page has no
 * embedded product grid (confirmed live), so this subfolder doesn't need
 * to enqueue shop/product/cart assets itself.
 *
 * The FAQ accordion uses native HTML `<details>`/`<summary>` — no JS
 * needed, browsers handle the open/close toggle themselves.
 *
 * BRAND FLAG (not fixed by this file): `.hp-banner-btn_white` below sets a
 * solid orange (#FFA222) button background — another BRAND.md violation
 * ("never use orange as a button background"), same issue already flagged
 * in temp-legacy/contact-page/README.md for a different button. Kept
 * verbatim since it's recovered legacy styling, not a redesign.
 */

 .wp-block-group.valentte-tiktok-section, 
 .alignfull {
    max-width: 100vw;
    margin-left: calc(50% - 50vw);
    margin-right: calc(50% - 50vw);
}

.wp-block-group.valentte-tiktok-section {
    text-align: center;
    background-color: #889977;
    color: #fff;
    padding: 40px;
}


.wp-block-group.valentte-tiktok-section h2,
 .wp-block-group.valentte-tiktok-section h3 {
    color: #FFFFFF;
    margin-bottom: 20px;
}

.page-id-9033890 .wp-block-group__inner-container {
    max-width: 100% !important;
    margin-left: auto;
    margin-right: auto;
}

details.wp-block-details.is-layout-flow.wp-block-details-is-layout-flow p {
    text-wrap-mode: wrap;
}

img.wp-image-9035321 {
    margin-top: -22px;
}

.wp-block-group.valentte-tiktok-user-section .wp-block-column:first-child h3.wp-block-heading {
    margin-top: 20px;
}

#template-text-only {
    max-width: 1100px;
    margin-inline: auto;
    text-align: center;
}

.wp-block-group.valentte-tiktok-section h1 {
    color: #fff !important;
}


.fragrance-banner.wp-block-columns-is-layout-flex {
    background-color: #F5F5F5 !important;
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
}

.dropdown_boxes.wp-block-columns-is-layout-flex {
    max-width: 1500px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
}

.hp-read-more-btn {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
    text-align: center;
}

hp-read-more-btn {
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 30px;
}

.fragrance-banner .fragrance-banner-heading {
    padding: 0px 0px;
    max-width: 675px;
    padding: 20px 60px;
    align-content: center;
}

.fragrance-banner .fragrance-banner-heading h3.wp-block-heading {
    margin-left: 33px;
}

.hp-banner-btn_white {
    background-color: #FFA222;
    color: #fff;
    border-radius: 10px;
    margin-left: 0%;
    font-size: 23px;
    padding: 9px 89px;
    min-width: 15%;
    text-transform: capitalize;
    border: none;
}

.hp-read-more-btn {
    place-self: center;
    margin-bottom: 30px;
}

img.wp-image-9004581 {
    max-width: 152px;
    min-width: 152px;
    max-height: 155px;
    min-height: 155px;
}

img.wp-image-9004580 {
    max-width: 200px;
    max-height: 200px;
}

img.wp-image-9004579 {
    min-width: 200px;
    max-width: 200px;
    max-height: 200px;
}

.valentte-tiktok-user-section figure.wp-block-image.size-full {
    max-height: 200px;
    min-height: 210px;
}

.wp-block-group.valentte-tiktok-user-section img {
    margin-left: auto;
    margin-right: auto;
}

.wp-block-group.valentte-tiktok-user-section {
    text-align: center;
}

@media screen and (max-width: 781px) {
    .fragrance-banner .fragrance-banner-heading h3.wp-block-heading {
        place-self: center;
    }

    .wp-block-group.valentte-tiktok-section {
        padding: 20px;
    }

    .wp-block-group.valentte-tiktok-user-section {
        padding-left: 20px;
        padding-right: 20px;
    }
}

.wp-block-details {
    font-size: 24px;
    margin: 10px 0;
}

.lists details summary {
    list-style: none;
    margin-bottom: 20px;
}

.lists details summary::-webkit-details-marker {
    display: none;
}

.lists details summary::before {
    content: "+";
    display: inline-block;
    font-size: 32px;
    line-height: 14px;
    font-weight: 700;
    color: #fff;
    padding-right: 6px;
    transition: transform 0.2s ease;
}

.lists details[open] summary::before {
    content: "−";
}

.lists details[open] {
    min-height: 346px;
}

details.wp-block-details.is-layout-flow.wp-block-details-is-layout-flow {
    background-color: #879B77;
    padding: 20px;
    color: #fff !important;
}

.wp-block-columns.dropdown_boxes.is-layout-flex.wp-container-core-columns-is-layout-9d6595d7.wp-block-columns-is-layout-flex {
    white-space: nowrap;
    min-width: 78%;
    margin-left: auto;
    margin-right: Auto;
}

@media screen and (max-width: 768px) {
    #template-text-only {
        margin: 20px 20px;
    }
}
