/* SIDEBAR SPECIFIC */
#sidebar {
    position: sticky; /* Make the sidebar stick */
    top: 0; /* Align the sidebar to the top */
    bottom: 0; /* Align the sidebar to the bottom */
    height: 100%; /* Full height */
    padding: 0px; /* Remove padding*/
    overflow-y: auto; /* Allow scrolling within the sidebar if needed */
    background-color: var(--tf-page-bg-color); /* Sidebar background color */
    z-index: 1000; /* Ensure the sidebar is above other content */
    box-sizing: border-box; /* Include padding and border in the element's total width and height */
    display: block; /* Default display */
}

#sidebar > * {
    box-sizing: border-box; /* Include padding and border in the element's total width and height */
    overflow: hidden; /* Hide overflow content */
}

/* Fix issues with margins and paddings inside sidebar */
#sidebar .container, #sidebar .row, #sidebar .col {
    margin: 0; /* Removing margins */
    padding: 0; /* Removing padding */
    box-sizing: border-box; /* Include padding and border in width and height */
}

/* ADDITIONAL CHANGES */
main {
    margin-left: 300px; /* Offset content to the right of the sidebar */
    padding: 0px; /* Removing padding for main content */
    box-sizing: border-box; /* Include padding and border in width and height */
}

#about-section {
    display: none; /* Hide the about section by default */
}

/* Responsive adjustments */
@media (max-width: 1028px) { /* When width is < 1028px */
    #sidebar {
        display: none !important; /* Hide the sidebar */
    }
    #about-section, #mobile-friendly { /* Show the about section */
        display: block;
    }

    /* Adjust content margins and padding */
    main #about-me {
        margin-left: 0; /* Remove margin when sidebar is hidden */
        padding: 15px; /* Adjust padding for spacing */
    }
    main .main-page {
        width: 100%; /* Full width */
        padding: 0 1rem; /* Adjust padding */
        margin: 0 auto; /* Centering content */
        box-sizing: border-box; /* Include padding and border in width and height */
    }
}