/* Elementor Container Support für Blog Detail Widget */

/* Container Full Width - nur für Blog-Widgets */
.elementor-widget-container .blog-detail-widget,
.e-container .blog-detail-widget,
.e-con .blog-detail-widget,
.e-con-boxed .blog-detail-widget,
.e-con-full .blog-detail-widget {
    width: 100%;
    max-width: none;
}

/* Transparenter Hintergrund für Elementor Container mit Blog-Widgets */
.elementor-widget-blog_entry_detail .elementor-widget-container,
.elementor-widget-blog_entries_list .elementor-widget-container,
.e-con:has(.elementor-widget-blog_entry_detail),
.e-container:has(.elementor-widget-blog_entry_detail),
.e-con:has(.elementor-widget-blog_entries_list),
.e-container:has(.elementor-widget-blog_entries_list),
.e-con-boxed:has(.elementor-widget-blog_entry_detail),
.e-con-full:has(.elementor-widget-blog_entry_detail),
.e-con-boxed:has(.elementor-widget-blog_entries_list),
.e-con-full:has(.elementor-widget-blog_entries_list) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* Zusätzliche Transparenz-Regeln für verschachtelte Container */
.e-con-inner:has(.elementor-widget-blog_entry_detail),
.e-con-inner:has(.elementor-widget-blog_entries_list),
.e-con .e-con-inner:has(.elementor-widget-blog_entry_detail),
.e-con .e-con-inner:has(.elementor-widget-blog_entries_list) {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* Spezifische Regeln für deinen Container aus dem HTML */
.elementor-element-ec6edc13-47ca-421d-881b-4e080bff08ce,
.elementor-element-ec6edc13-47ca-421d-881b-4e080bff08ce .e-con-inner {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* Äußere Container transparent machen, aber Blog-Widget-Inhalt weiß lassen */
.elementor-widget-blog_entry_detail .elementor-widget-container,
.elementor-widget-blog_entries_list .elementor-widget-container {
    background: transparent !important;
    background-color: transparent !important;
    background-image: none !important;
}

/* Blog-Widget-Inhalt behält weißen Hintergrund */
.elementor-widget-blog_entry_detail .blog-detail-widget,
.elementor-widget-blog_entries_list .blog-detail-widget {
    background: white !important;
    background-color: white !important;
}

/* Elementor Container Canvas Mode - nur für Blog-Widgets */
.elementor-template-canvas .e-con:has(.elementor-widget-blog_entry_detail),
.elementor-template-canvas .e-container:has(.elementor-widget-blog_entry_detail),
.elementor-template-canvas .e-con:has(.elementor-widget-blog_entries_list),
.elementor-template-canvas .e-container:has(.elementor-widget-blog_entries_list),
.elementor-template-canvas .e-con-boxed:has(.elementor-widget-blog_entry_detail),
.elementor-template-canvas .e-con-full:has(.elementor-widget-blog_entry_detail),
.elementor-template-canvas .e-con-boxed:has(.elementor-widget-blog_entries_list),
.elementor-template-canvas .e-con-full:has(.elementor-widget-blog_entries_list) {
    width: 100%;
    max-width: none;
    margin: 0;
    padding: 0;
}

/* Direkte Container ohne verschachtelte Struktur */
.e-con > .elementor-widget-blog_entry_detail,
.e-container > .elementor-widget-blog_entry_detail {
    width: 100%;
    max-width: none;
}

/* Container mit voller Breite */
.e-con[data-content_width="full"],
.e-container[data-content_width="full"] {
    width: 100vw;
    max-width: none;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
}

/* Blog Widget in Container */
.e-con .blog-detail-widget.width-full,
.e-container .blog-detail-widget.width-full {
    width: 100%;
    max-width: none;
    padding: 0;
}

/* Container Flex-Einstellungen für optimale Widget-Darstellung */
.e-con.e-flex:has(> .elementor-widget-blog_entry_detail),
.e-container.e-flex:has(> .elementor-widget-blog_entry_detail) {
    display: flex;
    flex-direction: column;
    align-items: stretch;
}

.e-con.e-flex > .elementor-widget-blog_entry_detail,
.e-container.e-flex > .elementor-widget-blog_entry_detail {
    flex: 1 1 auto;
    width: 100%;
}

/* 
 * Container Padding nur für Blog-Widgets im Frontend entfernen.
 * Diese Regel wird NICHT im Editor-Modus angewendet, um die Abstand-Steuerelemente nicht zu stören.
 */
body:not(.elementor-editor-active) .elementor-template-canvas .e-con.e-parent:has(.elementor-widget-blog_entry_detail),
body:not(.elementor-editor-active) .elementor-template-canvas .e-container.e-parent:has(.elementor-widget-blog_entry_detail),
body:not(.elementor-editor-active) .elementor-template-canvas .e-con.e-parent:has(.elementor-widget-blog_entries_list),
body:not(.elementor-editor-active) .elementor-template-canvas .e-container.e-parent:has(.elementor-widget-blog_entries_list) {
    padding: 0;
}

/* Widget-spezifische Container-Anpassungen */
.e-con > .elementor-widget-blog_entry_detail > .elementor-widget-container,
.e-container > .elementor-widget-blog_entry_detail > .elementor-widget-container {
    padding: 0;
    margin: 0;
    width: 100%;
}

/* Header-Bild volle Breite in Container */
.e-con .blog-detail-widget .blog-header-image,
.e-container .blog-detail-widget .blog-header-image {
    width: 100vw;
    margin-left: calc(-50vw + 50%);
    margin-right: calc(-50vw + 50%);
    max-width: none;
}

/* Content-Bereich Zentrierung in Container */
.e-con .blog-detail-widget .blog-detail-content,
.e-container .blog-detail-widget .blog-detail-content {
    max-width: 1200px;
    margin: 0 auto;
    padding: 40px 20px;
}

/* Responsive Container-Anpassungen */
@media (max-width: 1024px) {
    .e-con .blog-detail-widget .blog-detail-content,
    .e-container .blog-detail-widget .blog-detail-content {
        padding: 30px 20px;
    }
}

@media (max-width: 768px) {
    .e-con .blog-detail-widget .blog-detail-content,
    .e-container .blog-detail-widget .blog-detail-content {
        padding: 24px 16px;
    }
    
    .e-con .blog-detail-widget .blog-header-image,
    .e-container .blog-detail-widget .blog-header-image {
        margin-left: 0;
        margin-right: 0;
        width: 100%;
    }
}

@media (max-width: 480px) {
    .e-con .blog-detail-widget .blog-detail-content,
    .e-container .blog-detail-widget .blog-detail-content {
        padding: 20px 12px;
    }
}

/* Elementor Editor Container-Klassen - nur für Blog-Widgets */
.elementor-editor-active .e-con-inner:has(.elementor-widget-blog_entry_detail),
.elementor-editor-active .e-con > .e-con-inner:has(.elementor-widget-blog_entry_detail),
.elementor-editor-active .e-con-inner:has(.elementor-widget-blog_entries_list),
.elementor-editor-active .e-con > .e-con-inner:has(.elementor-widget-blog_entries_list) {
    padding: 0;
}

/* Container Padding nur für Blog-Widgets im Editor entfernen */
.elementor-editor-active .elementor-template-canvas .e-con.e-parent:has(.elementor-widget-blog_entry_detail),
.elementor-editor-active .elementor-template-canvas .e-container.e-parent:has(.elementor-widget-blog_entry_detail),
.elementor-editor-active .elementor-template-canvas .e-con.e-parent:has(.elementor-widget-blog_entries_list),
.elementor-editor-active .elementor-template-canvas .e-container.e-parent:has(.elementor-widget-blog_entries_list) {
    padding: 0;
}

/* Widget-Container Padding im Editor entfernen */
.elementor-editor-active .elementor-widget-blog_entry_detail .elementor-widget-container,
.elementor-editor-active .elementor-widget-blog_entries_list .elementor-widget-container {
    padding: 0;
    margin: 0;
}

/* Spezifische Container für Blog-Widgets im Editor */
.elementor-editor-active .e-con .elementor-widget-blog_entry_detail,
.elementor-editor-active .e-container .elementor-widget-blog_entry_detail,
.elementor-editor-active .e-con .elementor-widget-blog_entries_list,
.elementor-editor-active .e-container .elementor-widget-blog_entries_list {
    padding: 0;
    margin: 0;
}

/* Konsistente Container-Behandlung für Blog-Widgets - Editor und Frontend */
.elementor-widget-blog_entry_detail .elementor-widget-container,
.elementor-widget-blog_entries_list .elementor-widget-container {
    padding: 0;
    margin: 0;
    width: 100%;
}

/* Parent Container für Blog-Widgets */
.e-con:has(.elementor-widget-blog_entry_detail),
.e-container:has(.elementor-widget-blog_entry_detail),
.e-con:has(.elementor-widget-blog_entries_list),
.e-container:has(.elementor-widget-blog_entries_list) {
    padding: 0;
}

/* Spezifische Container-Behandlung nur für Blog-Widgets */
.elementor-template-canvas .e-con:has(.elementor-widget-blog_entry_detail),
.elementor-template-canvas .e-container:has(.elementor-widget-blog_entry_detail),
.elementor-template-canvas .e-con:has(.elementor-widget-blog_entries_list),
.elementor-template-canvas .e-container:has(.elementor-widget-blog_entries_list) {
    padding: 0;
}

/* Widget-Container nur für Blog-Widgets */
.elementor-template-canvas .elementor-widget-blog_entry_detail .elementor-widget-container,
.elementor-template-canvas .elementor-widget-blog_entries_list .elementor-widget-container {
    padding: 0;
    margin: 0;
}

/* Fallback für Browser ohne :has() Support - Direkte Widget-Container */
.elementor-widget-blog_entry_detail .elementor-widget-container,
.elementor-widget-blog_entries_list .elementor-widget-container {
    padding: 0;
    margin: 0;
    width: 100%;
}

/* Fallback für Parent-Container mit Blog-Widgets */
.e-con .elementor-widget-blog_entry_detail,
.e-container .elementor-widget-blog_entry_detail,
.e-con .elementor-widget-blog_entries_list,
.e-container .elementor-widget-blog_entries_list {
    padding: 0;
    margin: 0;
}

/* Kompatibilität mit verschiedenen Container-Layouts */
.e-con.e-con-boxed > .e-con-inner > .elementor-widget-blog_entry_detail,
.e-con.e-con-full > .e-con-inner > .elementor-widget-blog_entry_detail {
    width: 100%;
    max-width: none;
}

/* Container Grid Support */
.e-con[data-container_type="grid"] .blog-detail-widget,
.e-container[data-container_type="grid"] .blog-detail-widget {
    grid-column: 1 / -1;
    width: 100%;
}

/* Container mit Custom Width */
.e-con[data-content_width="custom"] .blog-detail-widget,
.e-container[data-content_width="custom"] .blog-detail-widget {
    width: 100%;
    max-width: var(--container-max-width, 1200px);
    margin: 0 auto;
}

/* Fix für verschachtelte Container */
.e-con .e-con .blog-detail-widget,
.e-container .e-container .blog-detail-widget {
    width: 100%;
    max-width: none;
}

/* Container Breakpoints */
@media (min-width: 768px) {
    .e-con-tablet .blog-detail-widget,
    .e-container-tablet .blog-detail-widget {
        width: 100%;
    }
}

@media (min-width: 1025px) {
    .e-con-desktop .blog-detail-widget,
    .e-container-desktop .blog-detail-widget {
        width: 100%;
    }
}

/* Container Animation kompatibilität */
.e-con.elementor-invisible .blog-detail-widget,
.e-container.elementor-invisible .blog-detail-widget {
    visibility: inherit;
}

/* Debug Helper entfernt */

/* Fix für Elementor Pro Features */
.elementor-widget-theme-post-content .blog-detail-widget,
.elementor-widget-wp-widget-bcm_blog_detail_widget .blog-detail-widget {
    width: 100%;
    max-width: none;
}