/* =========================================================
   BARFPLAATS ADVERTENTIEBANNER
   ========================================================= */

/* Stock Prosilver geeft .site-description width:65%, bedoeld
   voor het sitenaam/omschrijving-tekstblok naast het logo. Die
   tekst is in dit thema verborgen (display:none), dus die 65%
   is nu alleen nog dode ruimte die de banner in de weg zit.
   Laat het blok krimpen tot de breedte van het logo (350px). */
.site-description {
    float: left;
    width: auto;
}

/* Banner rechts naast het logo. Gewoon een float, net als het
   logo zelf - blijft dus altijd binnen .headerbar .inner en kan
   nooit "loslaten" van de header zoals met position:absolute. */
.barfplaats-banner {
    float: right;
    width: 42%;
    max-width: 585px;
    margin: 10px 0 0 0;
    text-align: right;
}

.barfplaats-banner img {
    display: block;
    width: 100%;
    max-width: 585px;
    height: auto;
    margin-left: auto;
}

/* Zoekbalk: ook float in plaats van absolute, valt daardoor
   automatisch rechts uit, netjes onder de banner. */
.search-header {
    float: right;
    clear: right;
    margin: 8px 0 0 0;
}

/* Mobiel: alles onder elkaar, volle breedte */
@media (max-width: 700px) {

    .barfplaats-banner {
        float: none;
        clear: both;
        width: 100%;
        max-width: 100%;
        margin: 8px 0 0 0;
        text-align: center;
    }

    .barfplaats-banner img {
        width: auto;
        max-width: 100%;
        margin: 0 auto;
    }

    .search-header {
        float: none;
        clear: both;
        margin: 8px 0 0 0;
    }
}


/* =========================================================
   BARFPLAATS SPONSORBANNERS (FOOTER)
   Vervanging voor de 4 vaste banners die op het oude bp32-
   thema hardcoded stonden in template/addons/call_to_action_body.html
   (met Bootstrap .row/.col-md-3). Prosilver heeft geen
   Bootstrap, dus hier met gewone flexbox opnieuw opgebouwd.
   ========================================================= */
.barfplaats-sponsors {
    max-width: 980px;
    margin: 20px auto 0;
    padding: 20px 10px 0;
    text-align: center;
}

.barfplaats-sponsors-title {
    font-variant: small-caps;
    font-weight: 400;
    color: #777;
    margin: 0 0 16px;
}

.barfplaats-sponsors-grid {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 16px;
}

.barfplaats-footer-sponsor {
    flex: 0 1 180px;
    display: block;
}

.barfplaats-footer-sponsor img {
    display: block;
    width: 100%;
    height: auto;
    max-width: 180px;
    margin: 0 auto;
}

/* Mobiel: 2 per rij, zoals col-xs-6 op het oude thema */
@media (max-width: 700px) {
    .barfplaats-sponsors-grid {
        gap: 10px;
    }

    .barfplaats-footer-sponsor {
        flex: 0 1 45%;
    }
}


/* =========================================================
   BARFPLAATS ADSENSE (BOVEN HET EERSTE BERICHT)
   Vervanging voor de "verkleed als bericht" AdSense-blokken
   die in het oude bp32-thema met Bootstrap .panel/.avatar-over
   opgemaakt waren. Hier met eigen classes, los van elk
   framework, in dezelfde crème/olijf stijl als de rest van
   de forumhuisstijl.
   ========================================================= */
.bp-ad-post {
    background-color: #FFFFFF;
    border: 1px solid #DEDEC7;
    border-radius: 3px;
    margin-bottom: 8px;
    padding: 10px;
}

.bp-ad-post-header {
    display: flex;
    align-items: center;
    gap: 10px;
    padding-bottom: 8px;
    border-bottom: 4px solid #E5E5E5;
    margin-bottom: 10px;
}

.bp-ad-post-avatar {
    width: 40px;
    height: 40px;
    border-radius: 50%;
    flex: 0 0 auto;
}

.bp-ad-post-headtext {
    min-width: 0;
}

.bp-ad-post-title {
    margin: 0;
    font-size: 1rem;
}

.bp-ad-post-title a {
    color: #292929;
}

.bp-ad-post-meta {
    margin: 2px 0 0;
    font-size: 0.85rem;
    color: #777777;
}

.bp-ad-post-id a {
    color: #777777;
}

.bp-ad-post-body {
    width: 100%;
    text-align: center;
    overflow: hidden;
}

.bp-ad-post-separator {
    text-align: center;
    color: #CCCCCC;
    margin: 10px 0;
}

.bp-ad-post-footer {
    text-align: center;
    font-size: 0.85rem;
}

@media (max-width: 700px) {
    .bp-ad-post-separator,
    .bp-ad-post-footer {
        display: none;
    }
}