/* Sidebar Styles */

.bmblog-container {

    display: flex;

    gap: 0;

    max-width: 1300px;

    margin: 40px auto;

}



.bmblog-content {

    flex: 1;

}



.bmblog-sidebar {

    flex: 0 0 320px;

    background: #f8f9fa;

    border-radius: 8px;

    padding: 0 15px 15px;

    box-shadow: 0 2px 15px rgba(0, 0, 0, 0.05);

    position: -webkit-sticky;

    position: sticky;

    top: 90px; /* Adjust based on your header height */

    max-height: calc(100vh - 80px); /* Viewport height minus some offset */

    overflow-y: auto; /* Enables scrolling */

	margin-right: 40px;

}

div#outer-wrap {

    overflow: visible;

}

/* Sidebar Scrollbar Styling */

.bmblog-sidebar::-webkit-scrollbar {

    width: 6px;

}



.bmblog-sidebar::-webkit-scrollbar-track {

    background: #f1f1f1;

    border-radius: 3px;

}



.bmblog-sidebar::-webkit-scrollbar-thumb {

    background: #01c2ff;

    border-radius: 3px;

}



.bmblog-sidebar::-webkit-scrollbar-thumb:hover {

    background: #0099cc;

}



/* Sidebar Heading */

.bmblog-sidebar h3 {

    color: #2d3436;

    font-size: 1.4em;

    margin-bottom: 20px;

    padding-bottom: 15px;

    border-bottom: 2px solid #01c2ff;

    position: sticky;

    top: 0;

    background: #f8f9fa;

    z-index: 1;

}



/* Sidebar List */

.bmblog-sidebar ul {

    list-style: none;

    margin: 0;

    padding: 0;

}



.bmblog-sidebar li {

    margin-bottom: 12px;

    padding: 3px 0;

    border-bottom: 1px solid #eee;

    transition: all 0.3s ease;

}



.bmblog-sidebar li:last-child {

    border-bottom: none;

}



.bmblog-sidebar a {

    color: #555;

    text-decoration: none;

    display: flex;

    align-items: center;

    transition: all 0.3s ease;

}





.bmblog-sidebar span.sidebar-item-converter a.category-link{

	color:#333;

}

.bmblog-sidebar span.sidebar-item-converter a.category-link:hover {

    color: #01c2ff;

    transform: translateX(5px);

}

.bmblog-sidebar a:before {

    color: #01c2ff;

    opacity: 0;

    transition: opacity 0.3s ease;

    content: "\f139";

    font-family: 'dashicons';

    font-size: 19px;

	vertical-align:middle;

}



.bmblog-sidebar a:hover:before {

    opacity: 1;

}



/* Responsive Sidebar */

@media (max-width: 768px) {

    .bmblog-container {

        flex-direction: column !important;

        margin-top: -35px;

    }



    .bmblog-sidebar {

        flex: none;

        width: 100%;

        margin-top: 30px;

        position: static;

        max-height: none;

        overflow-y: visible;

    }



    .bmblog-sidebar {

  background: #f8f9fa;

  padding: 20px;

  border-radius: 8px;

  box-shadow: 0 2px 5px rgba(0,0,0,0.1);

}



.accordion-header {

  cursor: pointer;

  padding: 10px 15px;

  background: #e9ecef;

  border-radius: 4px;

  display: flex;

  justify-content: space-between;

  align-items: center;

  margin: 0 0 10px 0;

  transition: background-color 0.3s;

}



.accordion-header:hover {

  background: #dee2e6;

}



.chevron {

  display: inline-block;

  width: 12px;

  height: 12px;

  border: solid #495057;

  border-width: 0 2px 2px 0;

  transform: rotate(45deg);

  transition: transform 0.3s;

}



.accordion-content {

  max-height: 0;

  overflow: hidden;

  transition: max-height 0.3s ease-out;

  padding-left: 0;

  margin: 0;

}



.accordion-content.active {

  max-height: 1000px; 

}



.bmblog-sidebar ul {

  list-style: none;

  padding: 0;

  margin: 0;

}



.bmblog-sidebar li {

  padding: 8px 15px;

  border-radius: 4px;

  transition: all 0.2s;

}



.bmblog-sidebar li:hover {

  background: #e9ecef;

}



.bmblog-sidebar li a {

  color: #495057;

  text-decoration: none;

  display: block;

}



.bmblog-sidebar a:hover:before {

    

    vertical-align: middle !important;

}



.bmblog-sidebar li a:hover {

  color: #212529;

}



.accordion-header.active .chevron {

  transform: rotate(-135deg);

}



}

.bmblog-sidebar a:hover:before,.bmblog-sidebar .category-item,.bmblog-sidebar .category-link {

    vertical-align: middle;

}



.bmblog-sidebar .active-category span.sidebar-item-converter .category-link {

    font-weight: bold;

    color: #01c2ff; 

}

.bmblog-sidebar .sub-posts li.active-post a{

    font-weight: bold;

    color: #000; 

}

.bmblog-sidebar .sub-posts li.active-post a:before {

    opacity: 1;

}

.active-category.category-link {

    font-weight: 700;

}



.bmblog-sidebar .active-category a:before {

    opacity: 1;

}