/* ================================================================
   MISSION NEWS 1.66 — GEMEINSAMES MASTER-STYLESHEET
   Portale: News | rechte Sidebar | rechte Sidebar
   Verwendung: zuerst laden, danach portal-spezifische CSS-Datei.
   CSS-Variablen --site-* etc. werden in der Portal-CSS definiert.
   Referenzbasis: BIO-ZEITUNG.COM MASTER V6.
   ================================================================ */

/* 02 — BREITE: gleiche horizontale Referenz für Header + Content */
#comments { display: none; }
body#mission-news .max-width,
body#mission-news .content-container {
    width: 100% !important;
    max-width: var(--site-max) !important;
    margin-inline: auto !important;
    box-sizing: border-box !important;
}
body#mission-news #site-header {
    position: relative !important;
    width: 100% !important;
    max-width: var(--site-max) !important;
    margin-inline: auto !important;
    box-sizing: border-box !important;
}
body#mission-news .is-sticky .site-header {
    max-width: var(--site-max) !important;
}

/* 03 — HAUPTMENÜ: farbige Unterstriche bleiben erhalten */
#menu-primary-items > li > a {
    text-transform: uppercase;
    font-weight: 600;
    box-sizing: border-box;
    border-bottom: 4px solid transparent;
    transition: background-color .2s ease, color .2s ease, border-color .2s ease;
}
#menu-primary-items > li > a:hover,
#menu-primary-items > li > a:focus { text-decoration: none; }

/* 04 — WIDGET-FARBEN: IDs je Portal kontrollieren */
.widget_ct_mission_news_post_list .widget-title,
.widget_custom_html > .widget-title {
    box-sizing: border-box;
    padding: 10px 15px !important;
    margin: 0 0 15px !important;
    border: 0 !important;
    box-shadow: none !important;
    line-height: 1.35;
    color: #FFFFFF !important;
}
/* 05 — DESKTOP-HEADER: schwarzer Strich ist die Referenzkante */
@media (min-width: 1600px) {
    body#mission-news #site-header {
        padding-inline: var(--site-edge) !important;
    }
    body#mission-news #site-header #title-container,
    body#mission-news #site-header .site-title {
        position: static !important;
    }
    body#mission-news #site-header #title-container { /* Datum relativ zum Header, nicht zum Logo */
        padding-bottom: 18px !important;
        border-bottom: 4px solid #151515 !important;
        box-shadow: none !important;
    }
    body#mission-news #site-header #menu-primary-container {
        position: static !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border-top: 0 !important;
        border-bottom: 0 !important;
        box-shadow: none !important;
        background: transparent !important;
    }
    body#mission-news #menu-primary,
    body#mission-news #menu-primary nav {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border: 0 !important;
        box-shadow: none !important;
    }
    body#mission-news #menu-primary-items {
        display: flex !important;
        align-items: flex-end !important;
        justify-content: flex-start !important;
        flex-wrap: nowrap !important;
        gap: var(--nav-gap) !important;
        list-style: none !important;
        margin: 0 !important;
        padding: 0 var(--header-tools-space) 0 0 !important;
        border: 0 !important;
        background: transparent !important;
    }
    body#mission-news #menu-primary-items > li {
        flex: 0 0 auto !important;
        margin: 0 !important;
        padding: 0 !important;
    }
    body#mission-news #menu-primary-items > li > a {
        display: block !important;
        white-space: nowrap !important;
        padding: 12px 12px 14px !important;
        margin: 0 !important;
    }
    /* Suchbutton sitzt im selben Container wie Impressum/Datenschutz:
       den Container NICHT verschieben, nur den Button separat. */
    body#mission-news #site-header .top-nav {
        position: static !important;
        padding: 0 !important;
        margin: 0 !important;
        height: auto !important;
    }
    body#mission-news #menu-secondary-container {
        position: absolute !important;
        top: 6px !important;
        right: var(--site-edge) !important;
        width: auto !important;
    }
    body#mission-news #search-toggle {
        position: absolute !important;
        right: var(--site-edge) !important;
        bottom: 11px !important;
        z-index: 15 !important;
        display: inline-flex !important;
        align-items: center !important;
        gap: 6px !important;
        padding: 0 !important;
        margin: 0 !important;
        border: 0 !important;
        background: transparent !important;
        box-shadow: none !important;
    }
    body#mission-news #title-container .date {
        position: absolute !important;
        left: auto !important;
        top: auto !important;
        right: calc(var(--site-edge) + 125px) !important;
        bottom: 13px !important;
        transform: none !important;
        float: none !important;
        width: auto !important;
        text-align: right !important;
        margin: 0 !important;
        padding: 0 !important;
        font-size: 12px !important;
        font-weight: 600 !important;
        line-height: 1.2 !important;
        white-space: nowrap !important;
        z-index: 14 !important;
    }
    body#mission-news #title-container .date::after {
        content: "" !important;
        position: absolute !important;
        top: 50% !important;
        left: auto !important;
        right: -22px !important;
        transform: translateY(-50%) !important;
        height: 18px !important;
        border-right: 1px solid #7a8184 !important;
    }
    /* Einzige schwarze Linie oberhalb, keine zweite helle darunter */
    body#mission-news #menu-primary-container::before,
    body#mission-news #menu-primary-container::after,
    body#mission-news #menu-primary::before,
    body#mission-news #menu-primary::after {
        content: none !important;
        display: none !important;
    }
    body#mission-news #menu-primary-items,
    body#mission-news #menu-primary { border-bottom: 0 !important; }
}

/* 06 — DESKTOP-CONTENT: News | Sidebar rechts | Sidebar ganz rechts */
@media (min-width: 1600px) {
    body#mission-news .content-container { padding: 0 !important; }
    body#mission-news.layout-double-right .content-container > .layout-container {
        display: grid !important;
        grid-template-columns: minmax(0, 1fr) var(--sidebar-width) var(--sidebar-width);
        grid-template-areas: "news sidebar1 sidebar2";
        column-gap: var(--column-gap) !important;
        align-items: start !important;
        width: 100% !important;
        max-width: none !important;
        margin: 0 !important;
        padding: 0 var(--site-edge) !important;
        box-sizing: border-box !important;
    }
    body#mission-news.layout-double-right .layout-container > #main { grid-area: news; }
    body#mission-news.layout-double-right .layout-container > #sidebar-left { grid-area: sidebar1; }
    body#mission-news.layout-double-right .layout-container > #sidebar-right { grid-area: sidebar2; }
    body#mission-news.layout-double-right .layout-container > :is(#main,#sidebar-left,#sidebar-right) {
        float: none !important; clear: none !important;
        width: 100% !important; max-width: none !important;
        min-width: 0 !important; margin: 0 !important;
        padding: 0 !important; box-sizing: border-box !important;
    }
    body#mission-news.layout-double-right :is(#main,#sidebar-left,#sidebar-right) > .inner {
        width: 100% !important; max-width: none !important;
        margin: 0 !important; padding: 0 !important;
        box-sizing: border-box !important;
    }
    body#mission-news.layout-double-right .sidebar :is(img,iframe) {
        max-width: 100% !important;
    }
}

/* 06a — Entfernt Theme-Trennlinien, nicht die Ressort-Unterstreichungen */
body#mission-news .layout-container::before,
body#mission-news .layout-container::after,
body#mission-news .content-container::before,
body#mission-news .content-container::after,
body#mission-news #main::before,
body#mission-news #main::after,
body#mission-news #sidebar-left::before,
body#mission-news #sidebar-left::after,
body#mission-news #sidebar-right::before,
body#mission-news #sidebar-right::after {
    content: none !important;
    display: none !important;
    border: 0 !important;
    box-shadow: none !important;
}
body#mission-news .layout-container > #main,
body#mission-news .layout-container > #sidebar-left,
body#mission-news .layout-container > #sidebar-right,
body#mission-news .layout-container > :is(#main,#sidebar-left,#sidebar-right) > .inner,
body#mission-news #main .post-list,
body#mission-news #main .posts-list,
body#mission-news #main .pagination,
body#mission-news #main .page-numbers,
body#mission-news #main .loop-pagination {
    border-top: 0 !important;
    border-right: 0 !important;
    border-bottom-color: transparent !important;
    border-left: 0 !important;
    box-shadow: none !important;
}
/* Die Rahmen einzelner Paginierungs-Schaltflächen bleiben erhalten. */

/* 07 — RESPONSIVE: Theme-Verhalten unter 1600 px respektieren;
   Header-Navigation unter 1600 px nicht überschreiben. */
@media (max-width: 768px) {
    .tooltip-ref .tooltip-text { max-width: 70vw; }
    .widget_ct_mission_news_post_list .widget-title { padding: 9px 12px !important; }
    #menu-primary-items > li > a { border-bottom-width: 3px; }
}

/* 08 — RAHMEN: keine vertikalen Spaltenlinien, keine Artikeltrennstriche */
body#mission-news :is(#main,#sidebar-left,#sidebar-right,.layout-container,.content-container),
body#mission-news :is(#main,#sidebar-left,#sidebar-right) .inner,
body#mission-news .widget_ct_mission_news_post_list :is(ul,li,.post-item,.top,.bottom),
body#mission-news :is(.posts-list .post,article.post,.archive .post,.blog .post,.search .post) {
    border: 0 !important;
    box-shadow: none !important;
}
body#mission-news .widget_ct_mission_news_post_list li.post-item,
body#mission-news :is(.posts-list .post,article.post,.archive .post,.blog .post,.search .post) {
    border-bottom: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 24px;
}
/* Farbige Unterstreichungen des Menüs bleiben ausdrücklich bestehen. */

/* ======================================================
   06 – OBERES MENÜ
====================================================== */

#menu-secondary .menu ul {
    float: right;
}

@media (min-width: 50em) {
    .menu-secondary-container {
        text-align: left;
        float: right;
    }
}


/* 09 — FOOTER: dieselbe Außenkante wie Header und Content.
   Keine Änderung des redaktionellen Footer-Inhalts. */
body#mission-news #site-footer {
    width: 100% !important;
    max-width: var(--site-max) !important;
    margin-inline: auto !important;
    box-sizing: border-box !important;
    border: 0 !important;
    box-shadow: none !important;
}
@media (min-width: 1600px) {
    body#mission-news #site-footer {
        padding-inline: var(--site-edge) !important;
    }
    body#mission-news #site-footer .max-width,
    body#mission-news #site-footer .content-container {
        max-width: none !important;
        width: 100% !important;
        padding-inline: 0 !important;
        margin-inline: 0 !important;
        box-sizing: border-box !important;
    }
    /* Drei Footer-Spalten mit gleichen Außenkanten und Spaltengaps.
       Für beide möglichen Theme-Markup-Varianten. */
    body#mission-news #site-footer :is(.footer-widgets,.footer-widget-area,.footer-widget-container) {
        display: grid !important;
        grid-template-columns: repeat(3,minmax(0,1fr)) !important;
        gap: var(--column-gap) !important;
        width: 100% !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }
    body#mission-news #site-footer :is(.footer-widgets,.footer-widget-area,.footer-widget-container) > * {
        float: none !important;
        min-width: 0 !important;
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
        border-left: 0 !important;
        border-right: 0 !important;
        box-sizing: border-box !important;
    }
}

/* 09a — Footer: Theme-Spaltentrenner und Linien entfernen.
   Die farbigen Widget-Kopfleisten bleiben unangetastet. */
body#mission-news #site-footer,
body#mission-news #site-footer :is(.max-width,.footer-widgets,.footer-widget-area,.footer-widget-container,.footer-widget,.widget,.widget-area,.inner),
body#mission-news #site-footer :is(.footer-widgets,.footer-widget-area,.footer-widget-container) > * {
    border: 0 !important;
    box-shadow: none !important;
    outline: 0 !important;
}
body#mission-news #site-footer :is(.footer-widgets,.footer-widget-area,.footer-widget-container,.footer-widget,.widget-area)::before,
body#mission-news #site-footer :is(.footer-widgets,.footer-widget-area,.footer-widget-container,.footer-widget,.widget-area)::after {
    border: 0 !important;
    box-shadow: none !important;
    background-image: none !important;
}
body#mission-news #site-footer :is(.footer-widgets,.footer-widget-area,.footer-widget-container) > *::before,
body#mission-news #site-footer :is(.footer-widgets,.footer-widget-area,.footer-widget-container) > *::after {
    border: 0 !important;
    box-shadow: none !important;
    background-image: none !important;
}

/* ======================================================
   10 – TOOLTIP
====================================================== */

/* Referenzzahl */

.tooltip-ref {
    position: relative;
    display: inline-block;

    font-size: 0.8em;
    vertical-align: super;

    cursor: pointer;
    color: #005699;
}


/* Tooltip-Fenster */

.tooltip-ref .tooltip-text {
    visibility: hidden;
    opacity: 0;

    position: absolute;
    z-index: 10;

    left: 50%;
    bottom: 130%;

    transform: translateX(-50%);

    width: 20rem;
    max-width: 80vw;

    padding: 0.6rem 0.9rem;

    background-color: #111827;
    color: #F9FAFB;

    border-radius: 1rem;

    box-shadow: 0 10px 20px rgba(0,0,0,0.25);

    font-size: 1.2em;
    line-height: 1.4;
    text-align: left;
    text-decoration: none;

    display: block;

    transition: opacity 0.2s ease-in-out;
}


/* Tooltip-Pfeil */

.tooltip-ref .tooltip-text::after {
    content: "";

    position: absolute;

    top: 100%;
    left: 50%;

    margin-left: -6px;

    border-width: 6px;
    border-style: solid;

    border-color: #111827 transparent transparent transparent;
}


/* Tooltip Hover-Farbe */

.tooltip-ref .tooltip-text:hover {
    background-color: #020617;
}


/* Desktop */

.tooltip-ref:hover .tooltip-text {
    visibility: visible;
    opacity: 1;
}


/* Mobile / Tastatur */

.tooltip-ref:focus .tooltip-text,
.tooltip-ref:active .tooltip-text,
.tooltip-ref:focus-within .tooltip-text {
    visibility: visible;
    opacity: 1;
    outline: none;
}


/* ======================================================
   11 – SAVEFROM-LINKS AUSBLENDEN
====================================================== */

a[savefrom_lm],
a[savefrom_lm_is_link] {
    display: none !important;
}

/* =====================================================
   12 BREADCRUMB – EINHEITLICHE ÜBERSCHRIFTENGESTALTUNG
===================================================== */

body#mission-news #breadcrumbs {
    display: block;
    width: 100%;
    box-sizing: border-box;

    background-color: var(--breadcrumb-bg, #176DB3);
    color: var(--breadcrumb-color, #FFFFFF);

    padding: var(--breadcrumb-padding, 10px 15px);
    margin: 0 0 15px;

    font-size: var(--breadcrumb-font-size, 18px);
    font-weight: var(--breadcrumb-font-weight, 600);
    line-height: var(--breadcrumb-line-height, 1.35);
    text-transform: uppercase;

    border: none;
    box-shadow: none;
}

body#mission-news #breadcrumbs span,
body#mission-news #breadcrumbs a,
body#mission-news #breadcrumbs .breadcrumb_last {
    color: inherit;
    font-size: inherit;
    font-weight: inherit;
    line-height: inherit;
    text-transform: inherit;
}


/* ================================================================
   14 — TABLET LANDSCAPE / BREITE 769–1199 CSS-PIXEL
   Referenzansicht 769px: 720px Gesamtbreite, zentriert.
   News 720px; darunter Sidebar 350px + 20px + Sidebar 350px.
   Bei 1024/1199px bleibt diese feste Layoutbreite erhalten.
   Das Hamburger-Menü aus V6 bleibt erhalten.
   ================================================================ */
@media screen and (min-width: 769px) and (max-width: 1199px) {
    /* Eine gemeinsame Außenkante für Header, Nachrichten und Footer. */
    body#mission-news #site-header,
    body#mission-news .content-container,
    body#mission-news #site-footer {
        width: 720px !important;
        max-width: 720px !important;
        margin-left: auto !important;
        margin-right: auto !important;
        box-sizing: border-box !important;
    }

    /* Keine zusätzliche Einrückung innerhalb der 720px Referenzbreite. */
    body#mission-news .content-container {
        padding-left: 0 !important;
        padding-right: 0 !important;
    }
    body#mission-news #site-footer .max-width,
    body#mission-news #site-footer .content-container {
        width: 100% !important;
        max-width: 100% !important;
        margin-left: 0 !important;
        margin-right: 0 !important;
        box-sizing: border-box !important;
    }

    body#mission-news.layout-double-right .content-container > .layout-container {
        display: grid !important;
        grid-template-columns: 350px 350px !important;
        grid-template-areas: "news news" "sidebar1 sidebar2" !important;
        column-gap: 20px !important;
        row-gap: 24px !important;
        align-items: start !important;
        justify-content: start !important;
        width: 720px !important;
        max-width: 720px !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    body#mission-news.layout-double-right .content-container > .layout-container > #main {
        grid-area: news !important;
    }
    body#mission-news.layout-double-right .content-container > .layout-container > #sidebar-left {
        grid-area: sidebar1 !important;
    }
    body#mission-news.layout-double-right .content-container > .layout-container > #sidebar-right {
        grid-area: sidebar2 !important;
    }
    body#mission-news.layout-double-right .content-container > .layout-container > :is(#main,#sidebar-left,#sidebar-right) {
        display: block !important;
        position: static !important;
        float: none !important;
        clear: none !important;
        width: 100% !important;
        max-width: none !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }
    body#mission-news.layout-double-right .content-container > .layout-container > :is(#main,#sidebar-left,#sidebar-right) > .inner {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        margin: 0 !important;
        padding: 0 !important;
        box-sizing: border-box !important;
    }

    /* Vorhandene Mission-News-Hamburger-Navigation beibehalten. */
    body#mission-news #site-header {
        position: relative !important;
    }
    body#mission-news #toggle-navigation {
        display: block !important;
        visibility: visible !important;
        cursor: pointer !important;
    }
    body#mission-news #menu-primary-items {
        display: block !important;
        width: 100% !important;
        padding: 0 !important;
        margin: 0 !important;
    }
    body#mission-news #menu-primary-items > li {
        display: block !important;
        float: none !important;
        width: 100% !important;
    }
    body#mission-news #menu-primary-items > li > a {
        display: block !important;
        white-space: normal !important;
    }
    body#mission-news #menu-primary-container {
        display: none !important;
        float: none !important;
        width: 100% !important;
        max-width: 100% !important;
        box-sizing: border-box !important;
    }
    body#mission-news #site-header:has(#toggle-navigation[aria-expanded="true"]) #menu-primary-container {
        display: block !important;
    }

    /* Das bestehende MU-Plugin übernimmt die proportionale Banner-Skalierung. */
    body#mission-news :is(#sidebar-left,#sidebar-right) :is(iframe,img) {
        max-width: 100% !important;
    }
}

/* Laptop-Navigation: kompaktere Beschriftungen */
@media (min-width: 1200px) and (max-width: 1599px) {
    body#mission-news #menu-primary-items > li > a {
        letter-spacing: -1px;
    }
}