/* ============================================================
   A) Base helpers (all sizes)
   ============================================================ */
.assoc-image-mobile{display:none}
.search-container{display:none!important}

/* Never insert automatic hyphens anywhere in the public site. Target the
   whole page shell with enough specificity to override theme/component rules,
   including shortcode cards rendered outside the normal entry-content node.
   Keep overflow-wrap component-specific so long URLs can still wrap safely. */
html body #page,
html body #page *,
html body .site,
html body .site *{
    -webkit-hyphens:none!important;
    -moz-hyphens:none!important;
    -ms-hyphens:none!important;
    hyphens:none!important;
}

.single-yada_wiki{--wiki-header-gap:28px}
.single-yada_wiki article.yada_wiki{padding-top:var(--wiki-header-gap)}
.single-yada_wiki article.yada_wiki .entry-header{margin-top:0!important;padding-top:0!important}
.single-yada_wiki article.yada_wiki .entry-header > :first-child{margin-top:0!important}
.single-yada_wiki article.yada_wiki .entry-title,
.single-yada_wiki article.yada_wiki .assoc-image-mobile,
.single-yada_wiki article.yada_wiki .breadcrumb{margin-top:0!important}

/* ============================================================
   B) Home page mobile cleanup
   ============================================================ */
@media (max-width:768px){
    .home .entry-title,
    .home .entry-content img.wp-image-4031{display:none}
}

/* ============================================================
   C) Association image helper (tablet/mobile)
   ============================================================ */
@media (max-width:1024px){
    .assoc-image-mobile{display:block;text-align:left;margin-bottom:0.5em}
    .assoc-image-mobile img{width:150px;height:auto;display:block;margin:0;float:none}
}

/* ============================================================
   D) Mobile header layout -- grid: [search] [logo] [burger]
   ============================================================ */
@media (max-width:768px){
    #masthead,.site-header{padding-top:4px!important;padding-bottom:4px!important}
    #masthead,.site-header,#masthead *,.site-header *,#content.site-content,#primary.content-area{
        outline:0!important;box-shadow:none!important;
    }
    #content.site-content,#primary.content-area{
        border-top-color:transparent!important;
    }

    #masthead .site-branding{
        display:flex!important;
        align-items:center!important;
        justify-content:space-between!important;
        position:relative!important;
        min-height:40px!important;
        padding-left:2px!important;
        padding-right:2px!important;
    }
    #masthead .site-title,
    #masthead .site-description{display:none!important;margin:0!important;padding:0!important}

    #masthead .custom-logo-link{
        position:absolute!important;
        left:50%!important;
        transform:translateX(-50%)!important;
        display:flex!important;align-items:center!important;margin:0!important;
        z-index:1!important;
        pointer-events:auto!important;
    }
    #masthead .custom-logo{height:28px!important;width:auto!important;max-width:none!important;display:block!important}

    #masthead .tabler-mob-search-btn{
        width:48px!important;height:40px!important;
        padding:0!important;margin:0 0 0 -8px!important;
        border:0!important;background:transparent!important;box-shadow:none!important;
        display:flex!important;align-items:center!important;justify-content:center!important;
        -webkit-tap-highlight-color:transparent;touch-action:manipulation;
        position:relative!important;z-index:2!important;flex:0 0 48px!important;
    }
    #masthead .tabler-mob-search-btn svg{width:24px!important;height:24px!important;opacity:.95!important}

    #masthead .secondary-toggle{
        margin:0 -2px 0 0!important;
        width:48px!important;min-width:48px!important;height:40px!important;
        padding:0!important;display:block!important;
        position:relative!important;z-index:2!important;flex:0 0 48px!important;
        align-self:center!important;top:auto!important;bottom:auto!important;
        line-height:1!important;font-size:0!important;vertical-align:middle!important;overflow:hidden!important;
        color:transparent!important;text-indent:-9999px!important;white-space:nowrap!important;
        transform:none!important;
        background-image:
            linear-gradient(#fff,#fff),
            linear-gradient(#fff,#fff),
            linear-gradient(#fff,#fff)!important;
        background-repeat:no-repeat!important;
        background-size:18px 2px,18px 2px,18px 2px!important;
        background-position:center calc(50% - 6px),center 50%,center calc(50% + 6px)!important;
    }
    #masthead .secondary-toggle:before{
        content:none!important;
        display:none!important;
    }

    /* Deprecated old search */
    .search-container,.search-box,.search-button{display:none!important}
}

/* ============================================================
   E) Sticky header
   ============================================================ */
#masthead,.site-header{
    position:sticky;top:0;z-index:9999;
    -webkit-overflow-scrolling:touch;
}

/* ============================================================
   F) Mobile content spacing fixes (remove white band)
   ============================================================ */
@media (max-width:782px){
    #content.site-content{display:flow-root}

    #primary.content-area,
    #primary.content-area > #main.site-main,
    #primary.content-area > #main.site-main > article:first-of-type,
    #primary.content-area > #main.site-main > article:first-of-type .entry-header,
    #primary.content-area > #main.site-main > article.page:first-of-type .entry-header{
        margin-top:0!important;padding-top:0!important;border-top:0!important;
    }
    #primary.content-area{padding-top:8px!important;background:#fff}
}

/* ============================================================
   G) Association/Region header logo sizing (mobile)
   ============================================================ */
@media (max-width:768px){
    .entry-header img[style*="width:300px"]{width:150px!important;height:auto!important;max-width:100%}
    .entry-header .association-logo img,
    .entry-header a img[src*="region_"]{width:150px!important;height:auto!important;max-width:100%}
}