/**
 * CONTENT WRAPPERS - Sistema nativo para single posts
 * 
 * Propósito: Reemplazar .elementor-widget-theme-post-content
 * con nuestro propio wrapper de contenido
 */

/* ============================================================
   SINGLE POST CONTENT WRAPPER
============================================================ */

/**
 * Wrapper principal del contenido de single post
 * Reemplaza: .elementor-widget-theme-post-content
 */
.informe-post-content {
    max-width: var(--max-width-content, 800px);
    margin: 0 auto;
    padding: var(--space-8, 2rem) 0;
}

/**
 * Entry content - contenido del artículo
 */
.informe-post-content .entry-content {
    font-family: var(--font-serif-roman, "MJRT", Georgia, serif);
    font-size: var(--font-size-base, 1rem);
    line-height: var(--line-height-relaxed, 1.6);
    color: var(--color-text-primary, #000000);
}

/**
 * Párrafos dentro del contenido
 */
.informe-post-content .entry-content p {
    margin-bottom: var(--space-6, 1.5rem);
}

/**
 * Epigraphe - Estilos unificados
 * 
 * Los estilos de .epigraphe están ahora unificados en:
 * assets/css/components/article-content.css
 * 
 * Todos los epígrafes tienen:
 * - Fondo rojo (var(--color-brand-primary))
 * - Line-height legible (1.5)
 * - Ubicación inmediatamente después de la imagen (sin gaps)
 */

/**
 * Imágenes dentro del contenido
 */
.informe-post-content .entry-content img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: var(--space-6, 1.5rem) auto;
}

/**
 * Embeds dentro del contenido
 * Integración con sistema nativo de embeds
 */
.informe-post-content .entry-content .sd-embed {
    margin: var(--space-8, 2rem) 0;
}

/**
 * YouTube Shorts en contenido de single post
 * Forzar aspect-ratio 9:16 (vertical)
 */
.informe-post-content .entry-content .sd-embed.is-youtube-short,
.informe-post-content .entry-content .sd-embed.is-vertical.is-youtube-short,
.informe-post-content .entry-content iframe.sd-embed.is-youtube-short,
.informe-post-content .entry-content iframe.sd-embed.is-vertical.is-youtube-short,
.informe-single-content .sd-embed.is-youtube-short,
.informe-single-content .sd-embed.is-vertical.is-youtube-short,
.informe-single-content iframe.sd-embed.is-youtube-short,
.informe-single-content iframe.sd-embed.is-vertical.is-youtube-short,
.informe-single-content .sd-video .sd-embed.is-youtube-short,
.informe-single-content .sd-video .sd-embed.is-vertical.is-youtube-short,
.informe-single-content .sd-video iframe.sd-embed.is-youtube-short,
.informe-single-content .sd-video iframe.sd-embed.is-vertical.is-youtube-short,
.informe-post-content .entry-content .sd-video .sd-embed.is-youtube-short,
.informe-post-content .entry-content .sd-video .sd-embed.is-vertical.is-youtube-short,
.informe-post-content .entry-content .sd-video iframe.sd-embed.is-youtube-short,
.informe-post-content .entry-content .sd-video iframe.sd-embed.is-vertical.is-youtube-short {
    aspect-ratio: 9 / 16 !important;
    width: 100% !important;
    height: auto !important;
    max-width: 400px !important;
    margin-left: auto !important;
    margin-right: auto !important;
    display: block !important;
    position: static !important;
    top: unset !important;
    left: unset !important;
    right: unset !important;
    bottom: unset !important;
    inset: unset !important;
}

/* Neutralizar wrappers que puedan romper el aspect-ratio */
.informe-post-content .entry-content .embed-wrap:has(iframe.sd-embed.is-youtube-short),
.informe-post-content .entry-content .embed-wrap:has(.sd-embed.is-youtube-short),
.informe-single-content .embed-wrap:has(iframe.sd-embed.is-youtube-short),
.informe-single-content .embed-wrap:has(.sd-embed.is-youtube-short),
.informe-single-content .sd-video:has(iframe.sd-embed.is-youtube-short),
.informe-single-content .sd-video:has(.sd-embed.is-youtube-short),
.informe-post-content .entry-content .sd-video:has(iframe.sd-embed.is-youtube-short),
.informe-post-content .entry-content .sd-video:has(.sd-embed.is-youtube-short) {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    position: static !important;
    height: auto !important;
    aspect-ratio: unset !important;
    width: 100% !important;
    max-width: 100% !important;
}

/* Neutralizar contenedor .sd-video que pueda tener estilos que rompan el aspect-ratio */
.informe-single-content .sd-video,
.informe-post-content .entry-content .sd-video {
    padding: 0 !important;
    margin: var(--space-8, 2rem) auto !important;
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    position: relative !important;
    display: block !important;
}

/* Asegurar que .sd-video no fuerce aspect-ratio 16:9 */
.informe-single-content .sd-video:has(.sd-embed.is-youtube-short),
.informe-single-content .sd-video:has(iframe.sd-embed.is-youtube-short),
.informe-post-content .entry-content .sd-video:has(.sd-embed.is-youtube-short),
.informe-post-content .entry-content .sd-video:has(iframe.sd-embed.is-youtube-short) {
    aspect-ratio: unset !important;
    padding-bottom: 0 !important;
}

/* ============================================================
   COMPATIBILITY - Mantener funcionamiento con Elementor
============================================================ */

/**
 * Si la página usa Elementor, estos estilos mantienen compatibilidad
 * elementor-overrides.css neutralizará los hacks de Elementor
 */
.elementor-widget-theme-post-content .entry-content {
    /* Heredamos los estilos de .informe-post-content */
    font-family: var(--font-serif-roman, "MJRT", Georgia, serif);
    font-size: var(--font-size-base, 1rem);
    line-height: var(--line-height-relaxed, 1.6);
}