/** ---------------------------------------------- Heroic KB SECTION ---------------------------------------------- **/

/**
 * Heroic KB Plugin
 * hide the breadcrumbs other than the first (referrer) :nth-child()
 */

.hkb-breadcrumbs {
  display: none !important;
}
/* Re-show first child breadcrumb */
.hkb-breadcrumbs:nth-child(1) {
  display: initial !important;
}

/** ---------------------------------- Heroic KB User Manual SideBar -------------------------------- **/

/* Style the content inside the sidebar */
.hkb-sticky {
    padding: 20px;
    max-height: calc(100vh - 9rem);
    overflow-y: auto;
}

/* .ast-container .sidebar-main .ast-accordion-layout {
	max-height: calc(100vh - 3rem);
	overflow-y: auto;
} */

/* Responsive rules  */
@media screen and (max-width: 480px) {
    .wcf-mobile-drawer {
        overflow-y: auto;
        max-height: calc(100vh - 3rem);
    }
    #hkb .hkb-archive.hkb-archive--three-cols {
   	grid-template-columns: repeat(1, 1fr) !important;
    }

}

@media screen and (min-width: 481.98px) {
   #hkb .hkb-archive.hkb-archive--three-cols {
	  grid-template-columns: repeat(2, 1fr) !important;
   }
}

@media screen and (min-width: 640.98px) {
	#hkb .hkb-archive.hkb-archive--three-cols {
	  grid-template-columns: repeat(3, 1fr) !important;
	}
}

/* Scrollable side-bar woocommerce page */
/* div.sidebar-main {
    max-height: calc(70vh - 9rem);
    overflow-y: auto;
	height: 3000px;
} */
/** ---------------------------------- END Heroic KB User Manual SideBar -------------------------------- **/

/** 
 * Body & Main Components styles
 */

 /**
 * Support 'index' page
 * Mobile rules 
 */

@media screen and (max-width: 992px) {
    div.hkb-archive.hkb-archive--four-cols {
        display: flex !important;
        flex-wrap: wrap;
    }
}
/* END Mobile Rules */

#hkb .hkb-category {
    padding: 1em;
    border: 1px solid #e6e6e6;
    border-radius: 5px;
}

 #hkb .hkb-mainpage-wrapper {
     background-color: #ebebef;
 }

#hkb .hkb-searchbox-wrapper {
    background: url('../png/support-bg.png') !important;
    background-blend-mode: hue;
}

div.hkb-mainpage__main {
    background-color: #ffffff;
    padding: 40px;
    border-radius: 4px;
}

#hkb .widget {
    background-color: #ffffff;
}

/** ---------------------------------------------- END Heroic KB SECTION ---------------------------------------------- **/