#sb_menu_active {
display: none !important;
}



@media screen and (max-width: 800px) {
    .index-index #content-view::after {
        background-image: url("https://semsmed.com/uploads/semsmed/image_files/original/2fd834f6c986fed2d451a0aa176a3383.png") !important;
        bottom: 30px !important; 
        width: 150px !important;  
        height: 75px !important;  
        left: 10px !important;
        display: block !important;
        background-size: contain !important;
        pointer-events: none !important;
        z-index: 100 !important; /* Matches desktop layering */
    }
}

/* --- FORCE MENU TO THE TOP --- */
/* This ensures the mobile menu is always "higher" than the image */
#header, 
.nav-wrapper, 
.menu-in, 
.slicknav_menu, 
#main-menu-container {
    z-index: 99999 !important; 
    position: relative;
}


#header:has(button[aria-expanded="true"]) ~ #content-view::after,
#header:has(.active) ~ #content-view::after {
    display: none !important;
}

/* Specific SimplyBook Mobile Menu State */
.menu-opened #content-view::after,
body.m-menu-opened #content-view::after {
    display: none !important;
}


@media screen and (max-width: 800px) {
#content-view > div.container-fluid.column > div.row.row-eq-height-xs.default.row-mg::after {
        /* Swap to the mobile image */
        background-image: url("https://semsmed.com/uploads/semsmed/image_files/original/2fd834f6c986fed2d451a0aa176a3383.png") !important;
        
        /* Force smaller size */
        width: 200px !important;  
        height: 105px !important;  
        bottom: 140px !important;
        left: 10px !important;
        
        /* Ensure it's still visible and non-clickable */
        display: block !important;
        background-size: contain !important;
        pointer-events: none !important;
    }
}


#content-view > div.container-fluid.column > div.row.row-eq-height-xs.default.row-mg::after {
    content: ""; 
    
    /* Positioned at the bottom left */
    position: fixed;
    bottom: 20px;          
    left: 40px;            
    z-index: 9999;
    
    /* Increased Sizing to match Google Widget */
    display: block;
    width: 360px;          /* Increased width */
    height: 185px;          /* Increased height */
    
    /* Image Settings */
    background-image: url("https://semsmed.com/uploads/semsmed/image_files/original/bd2c0aea2b764fd65f532cfc9e89e5b1.png");
    background-size: contain;    /* Ensures the whole image fits without cutting off */
    background-repeat: no-repeat;
    background-position: center left;

    /* Make it non-clickable */
    pointer-events: none;
    cursor: default;

    /* Drop shadow to match the elevation of the Google badge */
    filter: drop-shadow(0px 1px 1px rgba(0,0,0,0.15));
}

#sb-main-container #main #sb-timeline #steps #details .detail-step-wrap .detail-step .license-links-container .promotions-letter-flag label[role=button]{
    display: none;
}

/*
	Custom CSS
	Please make sure your CSS rules are 
	more particular / have higher priority
	then other page styles
*/
 #events h3   {
	/* add your css rule here */
}


 #events p.duration, #events div.duration   {
	/* add your css rule here */
}


 #events p.description, #events div.description   {
	/* add your css rule here */
}


 #events .selectedEvent   {
	/* add your css rule here */
}


 #events input.reserve_time_btn   {
	/* add your css rule here */
}


 #events input.select_another_btn   {
	/* add your css rule here */
}


 #eventForm #start_date-block-container h3, #eventForm #timeline-container h3   {
	/* add your css rule here */
}


 #eventForm #save_button   {
	/* add your css rule here */
}


 div.ui-widget-content   {
	/* add your css rule here */
}


 div.ui-widget-header   {
	/* add your css rule here */
}


 #timeline-container table.timeline   {
	/* add your css rule here */
}


 .timeline td.not_worked_time   {
	/* add your css rule here */
}


 .timeline td.free_time   {
	/* add your css rule here */
}


 .timeline td.selected_time   {
	/* add your css rule here */
}


 .timeline td.reserved_time   {
	/* add your css rule here */
}


 div#loading   {
	/* add your css rule here */
}


 #start_date-block-container .zend_form dt, start_date-block-container .zend_form dt b, start_date-block-container .zend_form dd label   {
	/* add your css rule here */
}

