.logo {
    font-family: "Roboto Mono", monospace;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}
main {
    padding-top:80px;
}
:root {
    --sidebar-width: 280px; /* match your sidebar width */
    --navbar-height: 56px; /* default .navbar height; adjust if different */
}

/* Make space for sticky top navbar if needed */
body {
 
}

/* On ≥lg, pin the offcanvas as a fixed sidebar and offset main content */
@media (min-width: 992px) {
    .offcanvas-lg {
        padding-top: var(--navbar-height);
        position: fixed;
        top: var(--navbar-height);
        left: 0;
        bottom: 0;
        width: var(--sidebar-width) !important;
        transform: none !important;
        visibility: visible !important;
        border-right: 1px solid rgba(255,255,255,.125);
    }

    .layout-main {
        margin-left: var(--sidebar-width);
        /* Optional: if you want the main area to stretch full height below navbar */
        min-height: calc(100vh - var(--navbar-height));
    }
}

/* Optional: nicer active pill look in a dark sidebar */
.nav-pills .nav-link.active {
    background-color: rgba(255,255,255,.15);
}

.nav-pills .nav-link {
    border-radius: .5rem;
}

/* (Optional) collapsed sidebar mode */
body.sidebar-collapsed .offcanvas-lg {
    width: 72px !important;
}

body.sidebar-collapsed .layout-main {
    margin-left: 72px;
}


.font-xl {
    font-size: 2.0em;
}
.font-lg{
    font-size:1.5em;
}