/*
 Theme Name:   GeneratePress Child
 Theme URI:    https://generatepress.com
 Description:  GeneratePress child theme for Alpha Hospital Group
 Author:       Infoserve
 Template:     generatepress
 Version:      1.0.0
*/

/* =========================================
   Transparent Header (Homepage template)
   ========================================= */

body.transparent-header .site-header {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    background: transparent;
    z-index: 100;
}

body.transparent-header .main-navigation a,
body.transparent-header .site-header .site-title a {
    color: #fff;
}

body.transparent-header .site-content {
    margin-top: calc(-1 * var(--header-height, 90px));
}

/* =========================================
   Off-canvas mobile menu
   Hooks into GeneratePress's OWN toggle state
   (nav gets .toggled, <html> gets .mobile-menu-open)
   rather than replacing GP's toggle JS.
   ========================================= */

@media ( max-width: 768px ) {

    /* The panel that slides in — GP's existing menu container */
    .main-navigation .main-nav {
        position: fixed;
        top: 0;
        right: 0;
        height: 100vh;
        width: 300px;
        max-width: 85vw;
        background: #fff;
        overflow-y: auto;
        transform: translateX( 100% );
        transition: transform 0.3s ease;
        z-index: 1000;
        box-shadow: -2px 0 12px rgba( 0, 0, 0, 0.15 );
        padding: 80px 20px 40px;
        visibility: hidden;
    }

    /* GP adds .toggled to the parent <nav id="site-navigation" class="main-navigation">
       when the menu-toggle button is clicked — this is what drives the slide-in. */
    .main-navigation.toggled .main-nav {
        transform: translateX( 0 );
        visibility: visible;
    }

    .main-navigation .main-nav ul {
        display: block;
    }

    .main-navigation .main-nav li {
        display: block;
        border-bottom: 1px solid #eee;
    }

    /* Dark overlay behind the panel — driven by GP's own
       html.mobile-menu-open class, no extra markup needed */
    html.mobile-menu-open body::before {
        content: "";
        position: fixed;
        inset: 0;
        background: rgba( 0, 0, 0, 0.5 );
        z-index: 999;
    }

    html.mobile-menu-open {
        overflow: hidden;
    }
}

/* =========================================
   Sticky header on scroll
   ========================================= */

body.is-sticky-header .site-header {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    z-index: 998;
    box-shadow: 0 2px 8px rgba( 0, 0, 0, 0.1 );
    background: #fff;
}

/* Keep transparent-header pages readable once sticky kicks in */
body.transparent-header.is-sticky-header .site-header {
    background: #fff;
}

body.transparent-header.is-sticky-header .main-navigation a,
body.transparent-header.is-sticky-header .site-header .site-title a {
    color: inherit;
}
