/*
Theme Name: Blogmatic Child
Theme URI: https://sharedinterestblog.com/
Description: Child theme of Blogmatic with custom author pages, native user-meta admin UI, and per-writer category branding for Shared Interest Blog.
Author: Shared Interest Blog Editorial Team
Author URI: https://sharedinterestblog.com/
Template: blogmatic
Version: 1.0.0
Text Domain: blogmatic-child
*/

/* ============================================================
   Header overrides
   ============================================================ */

/* The legacy .menu-toggle button inside #site-navigation is
   redundant: on desktop the menu UL is rendered inline, and on
   mobile a separate .canvas-menu-icon toggle widget opens the
   off-canvas menu. Blogmatic only hides it at max-width:769px,
   which leaks the button onto desktop. Hide it on every
   breakpoint so neither nav shows the stray hamburger. */
#site-navigation button.menu-toggle {
    display: none !important;
}

/* Site title removed from the DOM via overrides of
   blogmatic_header_site_branding_part and blogmatic_footer_logo_part
   in functions.php — no .site-title element is emitted. The defensive
   theme_mod_site_title_tag_for_* filter still demotes the wrapper to
   <p> on the off chance the title is ever re-rendered. */

/* Header background — match the logo PNG background on every
   breakpoint. .row-two (the menu bar) keeps its brand-color
   background defined by the parent theme; we only repaint the
   logo row and the surrounding .site-header.
   !important is required because Blogmatic's Customizer prints
   identical-specificity rules inline via wp_head, later in source
   order than this stylesheet. */
body.blogmatic-light-mode .site-header,
body.blogmatic-light-mode .site-header .row-one,
body.blogmatic-light-mode .site-header .row-three {
    background: #D4D4D4 !important;
}

/* Mobile (< 769px) — Blogmatic's .bb-bldr--responsive header
   places the logo in column one with smartphone-alignment--left,
   which left-justifies it. Switch the row to flex, centre the
   logo column, and pin the hamburger to the right. */
@media (max-width: 769px) {
    .bb-bldr--responsive .bb-bldr-row.row-one.column-3 {
        display: flex;
        align-items: center;
        justify-content: center;
        position: relative;
        grid-template-columns: unset;
    }

    .bb-bldr--responsive .bb-bldr-row.row-one .bb-bldr-column.two {
        display: none;
    }

    .bb-bldr--responsive .bb-bldr-row.row-one .bb-bldr-column.one {
        flex: 0 1 auto;
        text-align: center;
    }

    .bb-bldr--responsive .bb-bldr-row.row-one .bb-bldr-column.three {
        position: absolute;
        right: 15px;
        top: 50%;
        transform: translateY(-50%);
    }

    .bb-bldr--responsive .site-branding {
        text-align: center;
    }

    .bb-bldr--responsive .site-branding .custom-logo-link {
        display: inline-block;
    }

    .bb-bldr--responsive .site-branding .site-title {
        text-align: center;
        display: block;
    }
}
