/**
 * PsyGuild — Plugin Compatibility & Embed CSS
 *
 * Phạm vi:
 *   - WordPress oEmbed / iframe responsive
 *   - Gutenberg block embeds
 *   - Easy Table of Contents styles tương thích
 *   - wpForo không bị ép quá hẹp
 *   - Ultimate Member form không bị CSS global override
 *   - QSM quiz không bị overflow hidden
 */

/* ============================================================
   1. EMBED / oEMBED RESPONSIVE
   Đảm bảo YouTube, TikTok, Twitter, WP embeds không tràn
   và không bị ẩn.
   ============================================================ */

/* WordPress core responsive embed wrapper */
.entry-content .wp-block-embed,
.entry-content .wp-block-embed__wrapper,
.entry-content .wp-embedded-content,
.psyguild-reading-zone .wp-block-embed,
.psyguild-reading-zone .wp-block-embed__wrapper {
    max-width: 100%;
    width: 100%;
}

/* Tỉ lệ chuẩn 16:9 cho video embed (YouTube, Vimeo, TikTok) */
.entry-content .wp-block-embed__wrapper {
    position: relative;
    padding-bottom: 56.25%; /* 16:9 */
    height: 0;
    overflow: hidden;
}

.entry-content .wp-block-embed__wrapper iframe,
.entry-content .wp-block-embed__wrapper embed,
.entry-content .wp-block-embed__wrapper object {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    border: 0;
    border-radius: 12px;
}

/* Iframe tự do (không trong wp-block-embed__wrapper) */
.entry-content iframe,
.entry-content embed,
.entry-content object {
    max-width: 100%;
    border: 0;
}

/* WordPress Twitter/X embed — giới hạn width hợp lý */
.entry-content .wp-block-embed.is-type-rich .wp-block-embed__wrapper {
    padding-bottom: 0;
    height: auto;
    position: static;
    max-width: 550px;
    margin-left: auto;
    margin-right: auto;
}
.entry-content .wp-block-embed.is-type-rich .wp-block-embed__wrapper iframe {
    position: static;
    width: 100%;
    height: auto;
    border-radius: 12px;
}

/* WordPress auto-embed (URL trực tiếp, không qua block) */
.entry-content .wp-video,
.entry-content .wp-audio {
    max-width: 100%;
}

/* Đảm bảo không ẩn embed */
.entry-content .wp-block-embed,
.entry-content iframe,
.entry-content embed {
    display: block !important; /* Không để display:none */
    opacity: 1 !important;     /* Không để opacity:0 */
    visibility: visible !important;
}

/* ============================================================
   2. EASY TABLE OF CONTENTS COMPATIBILITY
   Heading H1/H2/H3 trong bài viết không bị CSS theme phá.
   TOC plugin sinh ra .ez-toc-section, .ez-toc-container
   ============================================================ */

/* Đảm bảo heading trong entry-content có line-height, spacing đúng */
.entry-content h1,
.entry-content h2,
.entry-content h3,
.entry-content h4,
.entry-content h5,
.entry-content h6 {
    scroll-margin-top: 80px; /* Offset cho sticky header khi click TOC anchor */
}

/* TOC container không bị break layout */
.entry-content .ez-toc-container,
.entry-content #ez-toc-container {
    max-width: 100%;
    overflow: visible;
    background: rgba(255,255,255,0.04);
    border: 1px solid rgba(255,255,255,0.08);
    border-radius: 10px;
    padding: 16px 20px;
    margin: 24px 0;
}

/* TOC link không bị override bởi global `a` style */
.entry-content .ez-toc-container a,
.entry-content #ez-toc-container a {
    text-decoration: none;
    color: var(--psyguild-primary-cyan, #6eefff);
}
.entry-content .ez-toc-container a:hover,
.entry-content #ez-toc-container a:hover {
    text-decoration: underline;
}

/* ============================================================
   3. WPFORO COMPATIBILITY
   Không ép forum vào container quá hẹp.
   Không áp reveal animation toàn bộ forum.
   ============================================================ */

/* wpForo wrapper không bị ép width */
.wpforo-wrap,
#wpforo-wrap,
.wpforo,
#wpforo {
    max-width: 100% !important;
    width: 100% !important;
    overflow: visible !important; /* Không overflow:hidden làm mất dropdown */
}

/* Tắt reveal/lazy animation trong forum */
.wpforo .reveal,
#wpforo .reveal,
.wpforo-wrap .reveal {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
    animation: none !important;
    transition: none !important;
}

/* wpForo form không bị style global của theme đè */
#wpforo input,
#wpforo textarea,
#wpforo select,
#wpforo button,
.wpforo-wrap input,
.wpforo-wrap textarea,
.wpforo-wrap select,
.wpforo-wrap button {
    /* Không reset box-sizing vì wpForo có style riêng */
    font-family: inherit; /* Kế thừa font theme nhưng không override màu */
}

/* ============================================================
   4. ULTIMATE MEMBER COMPATIBILITY
   Form UM không bị CSS global button/input override
   ============================================================ */

/* Scoped: chỉ áp dụng cho class UM, không global */
.um-form input,
.um-form select,
.um-form textarea,
.um-field input,
.um-field select,
.um-field textarea {
    /* Không override màu nền/viền — để UM tự render */
    font-family: inherit;
    font-size: inherit;
}

/* Nút UM không bị ép bởi style global của theme */
.um .um-button,
.um input[type="submit"],
.um-form button[type="submit"] {
    /* Không override background-color/border-radius nếu UM đã set */
    font-family: inherit;
}

/* UM trang profile/member không bị container quá hẹp */
.um-container,
#um-container {
    max-width: 100%;
}

/* ============================================================
   5. QSM (QUIZ AND SURVEY MASTER) COMPATIBILITY
   Không bọc quiz bằng overflow hidden.
   Radio/checkbox không bị CSS reset override.
   ============================================================ */

/* QSM quiz container không bị overflow */
.qsm-quiz-wrapper,
.qmn_quiz_container,
#qmn_quiz_container {
    overflow: visible !important;
    max-width: 100%;
}

/* Radio/checkbox trong quiz không bị invisible */
.qsm-quiz-wrapper input[type="radio"],
.qsm-quiz-wrapper input[type="checkbox"],
.qmn_quiz_container input[type="radio"],
.qmn_quiz_container input[type="checkbox"] {
    width: auto;
    height: auto;
    appearance: auto;
    -webkit-appearance: auto;
    opacity: 1;
    visibility: visible;
    position: static;
    clip: auto;
    margin: 0 6px 0 0;
    vertical-align: middle;
}

/* QSM không bị reveal animation ảnh hưởng */
.qsm-quiz-wrapper .reveal,
.qmn_quiz_container .reveal {
    opacity: 1 !important;
    transform: none !important;
    visibility: visible !important;
}

/* ============================================================
   6. SPECTRA BLOCKS (tương thích nếu Spectra active)
   Không phá .wp-block-* structures
   ============================================================ */

/* Đảm bảo Spectra/Gutenberg blocks không bị ẩn bởi .reveal riêng */
.wp-block,
.wp-block-group,
.wp-block-columns,
.wp-block-column {
    /* Không reset — chỉ đảm bảo max-width không bị ép */
    max-width: 100%;
}

/* Spectra Advanced Heading không bị h1/h2 font override của theme quá mạnh */
.uagb-heading-text {
    /* Không dùng !important — Spectra có specificity riêng */
    font-family: inherit;
}

/* Spectra Buttons không bị CSS reset của theme */
.uagb-buttons-repeater {
    display: inline-flex;
}
