/* Ergänzungen zum alten Stylesheet (miro.css): WordPress-Elemente, Kontaktformular, Handy-Ansicht.
---------------------------------------------*/

.screen-reader-text {
    border: 0;
    clip: rect(1px, 1px, 1px, 1px);
    clip-path: inset(50%);
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute !important;
    width: 1px;
    word-wrap: normal !important;
}

.skip-link:focus {
    background: #fff;
    clip: auto;
    clip-path: none;
    height: auto;
    left: 10px;
    padding: 10px;
    top: 10px;
    width: auto;
    z-index: 100;
}

.clear { clear: both; }
.clear-block::after { clear: both; content: ""; display: block; }

strong, b { font-weight: bold; }
em, i { font-style: italic; }
#contentInner ol { margin: 0 0 1em 20px; }
#contentInner ol li { list-style: decimal; }

/* Ausrichtungen aus dem alten Editor (CKEditor in Drupal) */
.rteleft { text-align: left; }
.rteright { text-align: right; }
.rtecenter { text-align: center; }
.rtejustify { text-align: justify; }
.rteindent1 { margin-left: 40px; }
.rteindent2 { margin-left: 80px; }
.rteindent3 { margin-left: 120px; }
.rteindent4 { margin-left: 160px; }

/* Bilder aus dem alten Editor haben feste Breiten (z. B. 945px) – nie breiter als der Inhalt. */
#contentInner img { height: auto !important; max-width: 100% !important; }
#contentInner table { max-width: 100%; }

#topNav ul { margin: 0; }
#navToggle { display: none; }

#slide img { display: block; transition: opacity .2s ease; }
#slide img.miro-ausblenden { opacity: 0; }
#slideNumbers ul li p { margin: 0; }

/* Alte Seitenleiste: Inhalt des Newskastens */
#sidebarNews h3 a { color: #f3e504; }
#sidebarNews h3 { margin-bottom: 8px; }
#sidebarNews .news-sidebar-teaser { padding: 0 20px; }
#sidebarNews p { margin: 0 0 1em 0; }

#footerRight p { margin: 0; }

/* Unterseiten-Liste (z. B. auf „Galerie“) */
.miro-unterseiten { margin: 0 0 15px 0; }

/* WordPress-Ausrichtungen und Bildunterschriften */
.alignleft { float: left; margin: 0 15px 10px 0; }
.alignright { float: right; margin: 0 0 10px 15px; }
.aligncenter { display: block; margin-left: auto; margin-right: auto; }
.wp-caption-text, figcaption { color: #777; font-size: 11px; }

/* Galerien */
#contentInner .gallery, #contentInner .wp-block-gallery { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 1em 0; }
#contentInner .gallery .gallery-item { background: #fff; border: 1px solid #ddd; box-sizing: border-box; margin: 0; padding: 6px; text-align: center; width: calc(25% - 6px); }
#contentInner .gallery .gallery-icon img { display: block; margin: 0 auto; max-width: 100%; }
#contentInner .gallery br { display: none; }

/* Kontaktformular */
.miro-kontakt label { display: block; font-weight: bold; margin: 0 0 4px 0; }
.miro-kontakt .feld { margin: 0 0 14px 0; }
.miro-kontakt input[type="text"], .miro-kontakt input[type="email"], .miro-kontakt textarea {
    background: #fff;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    font: inherit;
    padding: 6px 8px;
    width: 100%;
}
.miro-kontakt textarea { min-height: 160px; }
.miro-kontakt .optionen label, .miro-kontakt .einwilligung label { display: inline; font-weight: normal; }
.miro-kontakt .optionen label { margin-right: 15px; }
.miro-kontakt .pflicht { color: #b00; }
.miro-kontakt button {
    background: #343839 url(../img/navbg.jpg);
    border: 0;
    border-radius: 6px;
    color: #f4f4f4;
    cursor: pointer;
    font-size: 13px;
    font-weight: bold;
    padding: 10px 20px;
}
.miro-kontakt button:hover { color: #f3e504; }
.miro-kontakt .hp { left: -9999px; position: absolute; }
.miro-meldung { border-radius: 6px; margin: 0 0 15px 0; padding: 10px 15px; }
.miro-meldung.ok { background: #e3f3d8; border: 1px solid #9c6; }
.miro-meldung.fehler { background: #fbe3e3; border: 1px solid #d99; }

/* Handy und Tablet: Feste Breite von 1000px auflösen
---------------------------------------------*/
@media (max-width: 1000px) {
    body { min-width: 0; }
    #header, #wrapper, #footer, #footerInner, #contentWrap, #teaser { box-sizing: border-box; width: auto; }
    #wrapper, #footer { margin: 0 8px; }
    #headspace { height: 16px; }

    #headerWrap { height: auto; }
    #header { padding: 0 10px; }
    #header::after { clear: both; content: ""; display: block; }
    #bannerlink { margin: 13px 0; }
    #navToggle {
        background: #343839 url(../img/navbg.jpg);
        border: 0;
        border-radius: 6px;
        color: #f4f4f4;
        display: block;
        float: right;
        font-weight: bold;
        margin: 12px 0;
        padding: 8px 14px;
    }
    #topNav { clear: both; display: none; float: none; height: auto; margin: 0 -10px; width: auto; }
    #topNav.offen { display: block; }
    #topNav ul li { display: block; float: none; width: auto; }
    #topNav ul li a { border-top: 1px solid #eee; height: 44px; line-height: 44px; width: auto; }
    #topNav ul li a:hover, #topNav ul li a.active, #topNav ul li a.active-trail { background: #f3e504; }

    #teaser { height: auto; }
    #slide, #slideNumbers { display: block; float: none; height: auto; width: auto; }
    #slide img { height: auto; width: 100%; }
    #slideNumbers { border-radius: 0 0 12px 12px; }
    #slideNumbers h2, #slideNumbers ul li, #slideNumbers ul li a { box-sizing: border-box; width: auto; }
    #slideNumbers ul li { height: auto; }
    #teaserSmall { background-size: cover; height: 50px; width: auto; }

    #content, #sidebar { display: block; float: none; margin: 0 0 20px 0; width: auto; }
    h1.title, #contentInner, #sidebar h2, #sidebar .block .content, #sidebarNews,
    #sidebar .block-menu_block ul li, #sidebar .block-menu_block ul li a, #sidebarNews hr { box-sizing: border-box; width: auto; }
    #sidebarNews .ui-accordion-content, #sidebarNews h3 { width: auto; }

    #footer, #footerInner { height: auto; }
    #footerLeft { display: none; }
    #footerRight { box-sizing: border-box; display: block; float: none; height: auto; width: auto; }

    #contentInner .gallery .gallery-item { width: calc(50% - 4px); }
}
