/*
Theme Name: Waipoua Child
Theme URI: https://example.com/waipoua-child
Description: Child-Theme für das modernisierte Waipoua-Theme.
Author: Grace Fellenbrook
Author URI: https://example.com
Template: waipoua-main
Version: 1.0.0
Text Domain: waipoua-child
*/

/* ==========================================================================
   0. Basis / Farb-Variable (optional)
   ========================================================================== */

:root {
    /* Wenn du magst, kannst du hier deine Akzentfarbe definieren */
    --waipoua-accent: #F00c5cd;
}

/* ==========================================================================
   1. Drei-Spalten-Layout Startseite: Beiträge (links), Featured (Mitte), Sidebar (rechts)
   ========================================================================== */

@media screen and (min-width: 1024px) {

    /* Rahmen um Content + Featured */
    #content-wrap {
        width: 71.3114754098%;
        float: left;
    }

    /* Linke Spalte: normale Beiträge */
    #content {
        width: 59.7701149425%;
        float: left;
        margin-right: 5.7471264368%;
        margin-bottom: 0;
    }

    /* Mittlere Spalte: Featured-Posts (Sticky-Beiträge) */
    #featuredposts {
        width: 34.4827586207%;
        float: left;
        padding-top: 0;
    }

    /* Rechte Spalte: Sidebar */
    #sidebar {
        width: 24.5901639344%;
        float: right;
        margin-top: 3px;
        padding-top: 0;
        padding-bottom: 0;
    }
}

/* ==========================================================================
   2. Einzelbeiträge (single.php): Content breit, Sidebar erhalten
   ========================================================================== */

@media screen and (min-width: 1024px) {

    /* Featured-Spalte auf Einzelansicht komplett entfernen */
    body.single #featuredposts {
        display: none;
    }

    /* Content nutzt gesamte Breite von #content-wrap */
    body.single #content {
        width: 100%;
        margin-right: 0;
        float: left;
    }

    /* Sicherheitsnetz: innere Container nicht künstlich begrenzen */
    body.single #content .entry,
    body.single #content .post,
    body.single #content article {
        max-width: 100%;
    }
}

/* ==========================================================================
   3. „Zurück zur Übersicht“-Link (als schlichter Textlink)
   ========================================================================== */

.back-button-wrapper {
    margin-top: 30px;
}

.back-button {
    background: none !important;
    border: none !important;
    padding: 0 !important;
    color: inherit !important;
    text-decoration: none;
    font-weight: 500;
    font-size: 15px;
}

.back-button:hover {
    text-decoration: underline;
}

/* ==========================================================================
   4. Mobile Navigation (Klick auf ☰ Menu)
   ========================================================================== */

@media screen and (max-width: 1169px) {

    /* Hintergrund für den Navigationsbereich oben */
    #site-nav-wrap {
        background: #333;
    }

    /* Mobile-Menü-Button sichtbar und gut klickbar */
    #site-nav-wrap a#mobile-menu-btn {
        display: block;
        width: 100%;
        padding: 12px 16px;
        background: none;
        color: #fff;
        font-size: 1rem;
        font-weight: 600;
        text-decoration: none;
        text-indent: 0;
        text-align: left;
    }

    /* Hamburger-Symbol */
    #site-nav-wrap a#mobile-menu-btn::before {
        content: "☰ ";
        margin-right: 4px;
        font-size: 1.1rem;
    }

    #site-nav-wrap a#mobile-menu-btn:hover {
        background: #444;
    }

    /* Dropdown-Navigation */
    #site-nav {
        display: none; /* wird per JS (slideToggle) sichtbar */
        padding: 0;
        background: #444;
        text-align: left;
    }

    #site-nav ul {
        padding: 0;
        margin: 0;
    }

    #site-nav li {
        display: block;
        border-bottom: 1px solid #555;
    }

    #site-nav li a {
        display: block;
        padding: 10px 16px;
        color: #fff;
        text-decoration: none;
        font-size: 0.95rem;
    }

    #site-nav li a:hover {
        background: #555;
    }

    #site-nav #searchform {
        padding: 10px 16px 12px;
        background: #333;
    }
}

/* Desktop: Menü-Button ausblenden, normale Navi anzeigen */
@media screen and (min-width: 1170px) {

    #site-nav-wrap a#mobile-menu-btn {
        display: none;
    }

    #site-nav {
        display: block;
        background: transparent;
    }
}

/* ==========================================================================
   Einzelansicht (single.php): Featured weg, Content breit
   ========================================================================== */

/* Featured-Bereich auf Einzelansicht überall ausblenden */
body.single-post #featuredposts {
    display: none !important;
}

/* Desktop: Content in der Einzelansicht wirklich breit machen */
@media screen and (min-width: 1170px) {

    /* Content soll innerhalb von #content-wrap die volle Breite nutzen */
    body.single-post #content {
        width: 100% !important;
        margin-right: 0;
        float: left;
    }

    /* Sicherheitsnetz für innere Container */
    body.single-post #content .entry,
    body.single-post #content .post,
    body.single-post #content article {
        max-width: 100%;
    }
}