/*
 * Lani Core Theme — common CTA/UI compatibility layer (v1.6.4).
 *
 * Additive, plugin-hosted, and free of external asset requests. Loaded ONLY on
 * Platform-owned article surfaces whose stored body contains a recognized
 * marker (M&M un_cta, Cocoon toggle, Lazy Blocks accordion, or Twitter embed), via
 * includes/lani-core-theme.php. Everything is scoped under
 * .lani-section-article__content so none of it can leak onto Cocoon pages.
 *
 * Purpose:
 *  1. Leave M&M CTA presentation to the client-supplied
 *     assets/cta-mandm/m_and_m_cta.css. This layer must not restyle un_cta;
 *     it only preserves audited asset URLs and one dead affiliate repair.
 *  2. Provide generic, attribute-preserving compatibility for CTA-like markup
 *     whose concrete variant is not yet evidenced (divination CTA = unknown).
 *     No product-specific selector, href, or asset is assumed.
 *  3. Migrate the audited Cocoon dependencies (toggle + Lazy Blocks
 *     accordion) to a conservative NO-JS readable fallback: content is always
 *     visible; disclosure styling degrades gracefully. No JavaScript added.
 */

/* M&M CTA presentation is intentionally owned by
 * assets/cta-mandm/m_and_m_cta.css, the client-supplied source of truth.
 * Do not restyle .un_cta in this compatibility layer. */

/* ==========================================================================
   2. Generic CTA compatibility (divination CTA variant = unknown)
   Attribute-preserving defaults only. No product-specific selector/asset.
   ========================================================================== */

.lani-section-article__content .c-button__cv__wrapper a,
.lani-section-article__content .wp-block-lazyblock-lani-button a {
    word-break: break-word;
}

/* Unknown CTA images never overflow the content column. */
.lani-section-article__content .c-button__cv__wrapper img {
    height: auto;
    max-width: 100%;
}

/* ==========================================================================
   3. Cocoon toggle — conservative NO-JS readable fallback
   Content is always visible; the label reads as a sub-heading. This keeps
   fallback9 toggle posts readable on Platform without Cocoon CSS/JS and
   without rewriting post text.
   ========================================================================== */

.lani-section-article__content .toggle-wrap,
.lani-section-article__content .wp-block-cocoon-blocks-toggle {
    border: 1px solid var(--lani-section-line, #eadbd4);
    border-radius: 12px;
    margin-block: 1.4em;
    overflow: hidden;
}

.lani-section-article__content .toggle-wrap > input.toggle-checkbox + label.toggle-button,
.lani-section-article__content .toggle-wrap > .toggle-button,
.lani-section-article__content .wp-block-cocoon-blocks-toggle .toggle-button {
    background: var(--lani-section-soft, #fbf6f1);
    border-bottom: 1px solid var(--lani-section-line, #eadbd4);
    color: var(--lani-section-primary-dark, #512034);
    display: block;
    font-weight: 800;
    padding: 12px 16px;
}

/* The Cocoon toggle hides content via its own CSS/JS. On Platform that CSS is
   absent, so explicitly force the content visible and readable (no-JS). */
.lani-section-article__content .toggle-wrap > input.toggle-checkbox + label.toggle-button + span.toggle-content,
.lani-section-article__content .toggle-wrap > .toggle-content,
.lani-section-article__content .toggle-content,
.lani-section-article__content .wp-block-cocoon-blocks-toggle .toggle-content {
    display: block !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 14px 16px;
    visibility: visible !important;
}

/* The hidden checkbox that drives the Cocoon toggle is inert without its CSS;
   keep it from creating a focusable/visual artifact. */
.lani-section-article__content .toggle-wrap > input.toggle-checkbox,
.lani-section-article__content .toggle-checkbox {
    display: none;
}

/* ==========================================================================
   4. Lazy Blocks accordion — conservative NO-JS readable fallback
   The accordion block is "unsupported" (its CSS/JS is not loaded on Platform).
   Show every panel expanded and readable; style the headers. No JavaScript.
   ========================================================================== */

.lani-section-article__content .wp-block-lazyblock-lani-accordion-block > .accordion {
    border: 1px solid var(--lani-section-line, #eadbd4);
    border-radius: 12px;
    margin-block: 1.4em;
}

.lani-section-article__content .wp-block-lazyblock-lani-accordion-block .accordion__title,
.lani-section-article__content .wp-block-lazyblock-lani-accordion-block .js-accordion-title {
    background: var(--lani-section-soft, #fbf6f1);
    border-bottom: 1px solid var(--lani-section-line, #eadbd4);
    color: var(--lani-section-primary-dark, #512034);
    font-weight: 800;
    padding: 12px 16px;
}

.lani-section-article__content .wp-block-lazyblock-lani-accordion-block > section.accordion > .accordion__container > .accordion__title.js-accordion-title + .accordion__content,
.lani-section-article__content .wp-block-lazyblock-lani-accordion-block .accordion__content {
    display: block !important;
    max-height: none !important;
    overflow: visible !important;
    padding: 14px 16px;
    visibility: visible !important;
}

/* ==========================================================================
   5. Twitter embed — preserve the third-party widget and readable fallback
   ========================================================================== */

.lani-section-article__content blockquote.twitter-tweet {
    border-left: 4px solid var(--lani-section-primary, #7b2948);
    margin: 1.4em 0;
    max-width: 100%;
    overflow-wrap: anywhere;
    padding: 12px 16px;
}

/* ==========================================================================
   6. Reduced motion
   ========================================================================== */

@media (prefers-reduced-motion: reduce) {
    .lani-section-article__content .toggle-wrap,
    .lani-section-article__content .wp-block-lazyblock-lani-accordion-block {
        scroll-behavior: auto;
        transition: none;
    }
}

