thetempusproject/app/plugins/notes/css/notes.css

/* Custom styles for your specific layout */

.content-area {
    margin-left: 400px; /* Adjust for the width of left sidebar */
    padding: 20px; /* Adjust as per your design */
    padding-bottom: 50px;
}

.float-bottom {
    position: absolute;
    bottom: 0;
    width: 100%;
    background-color: #f8f9fa; /* Background color for visibility */
    padding: 10px 0; /* Padding for aesthetic spacing */
    text-align: center; /* Centering the content */
}

.full-width-footer {
    width: 100%;
    background-color: #333;
    color: #fff;
    padding: 20px 0;
    text-align: center;
    position: fixed;
    bottom: 0;
    left: 0;
}

.side-nav {
    width: 200px;
    bottom: 50px;
    height: 100%; /* Adjust based on your layout, could be 100vh or another value */
}

.notes-sidebar .nav li a {
    padding: 10px 10px; /* Provides padding to make links easier to click */
}
.notebook-sidebar .nav li a {
    /* padding: 10px 10px; /* Provides padding to make links easier to click */
}

.note {
    padding-left: 0px !important;
    padding-right: 0px !important;
}

#notebook-sidebar ul {
    /* background-color: #000; */
    /* background-color: #898989; */
    background-color: #323232;
}

.navbar-inverse .navbar-nav li a.label.label-none {
    --bg-color: #222;
}

.navbar-inverse .navbar-nav li a.label.label-info {
    --bg-color: #5bc0de;
}

.navbar-inverse .navbar-nav li a.label.label-danger {
    --bg-color: #d9534f;
}

.navbar-inverse .navbar-nav li a.label.label-success {
    --bg-color: #5cb85c;
}

.navbar-inverse .navbar-nav li a.label.label-primary {
    --bg-color: #337ab7;
}

.navbar-inverse .navbar-nav li a.label.label-warning {
    --bg-color: #f0ad4e;
}

.navbar-inverse .navbar-nav li a.label {
    color: #ffffff;
    background-color: var(--bg-color) !important;
    background-image:none !important;
}

.navbar-inverse .navbar-nav li.active a.label {
    color: #ffffff !important;
    background-image:none !important;
    font-weight: bold;
    box-shadow: inset 2px -1px 2px 1px rgb(255, 255, 255) !important;
}

.notebook-sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    width: 200px; /* 1/6 width */
    background-color: #00ff0d;
    padding-top: 50px; /* Adjust as per your design */
}

.navbar-inverse.nav-stack .navbar-nav li a:hover,
.navbar-inverse.nav-stack .navbar-nav li a:focus  {
    background-color: #5a5a5a;
}

.notebook-sidebar .navbar-nav li a {
    padding-top: 10px;
    padding-bottom: 10px;
    width: 200px;
}

.notes-sidebar .navbar-nav li.sidebar-brand a {
    padding-top: 10px;
    padding-bottom: 10px;
    width: 200px;
    background-color: #666666;
    background-image:none !important;
}

.notes-sidebar .nav .sidebar-brand a {
    color: #fff;
}

.notes-sidebar {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 200px; /* Width of first sidebar */
    width: 200px; /* 1/6 width */
    background-color: #c7c7c7;
    padding-left: 0px !important;
    padding-right: 0px !important;
    padding-top: 50px; /* Adjust as per your design */
    overflow-y: auto; /* Makes vertical overflow scrollable */
    overflow-x: hidden; /* Hides horizontal overflow */
}

.notes-sidebar-width {
    width: 200px;
}

.notes-sidebar .nav li {
    width: 200px;
    padding-left: 0 !important;
    padding-right: 0 !important;
}

.notes-sidebar .nav li a {
    color:#5a5a5a;
    display: block;
    padding-left: 10px !important;
    padding-right: 0px !important;
}

.notes-sidebar .nav {
    position: relative;
    height: calc(100% - 50px); /* Reduce the height by the padding-top value or any other header/footer within the sidebar */
    padding-bottom: 50px; /* Space for the bottom anchored item */
    margin-bottom: 0; /* Removes default margin */
}


.outlined-element, .submenu {
    border-bottom: 1px solid #575757;
}

li.submenu a.label {
    margin-left: 15px;
    padding-left: 25px;
    padding-top: 10px;
    padding-bottom: 10px;
    text-align: left;
    line-height: 20px;
}



/* .sidebar .notes-sidebar .nav li.sidebar-brand {
    background-image:none;
    background-color: #00ff0d !important;
} */

/* .notebook-sidebar .navbar-inverse .navbar-nav li a .label,
.notebook-sidebar .navbar-inverse .navbar-nav li a .label:hover,
.notebook-sidebar .navbar-inverse .navbar-nav li a .label:focus  {
    background-color: #f129d7 !important;
    color: #f129d7 !important;
    background-image:none !important;
} */
/* .navbar-inverse .navbar-nav li a.label:hover,
.navbar-inverse .navbar-nav li a.label:focus  {
    background-color: #00ff0d !important;
    color: #00ff0d !important;
    background-image:none;
} */








/* .sidebar .notes-sidebar .navbar-inverse .navbar-nav li .active  {
    background-color: #00ff0d !important;
    color: #00ff0d !important;
    background-image:none;
} */

/* .sidebar .notes-sidebar .navbar-inverse .navbar-nav li .active  {
    background-color: #f129d7 !important;
    color: #f129d7 !important;
    background-image:none;
} */
/* .dateMonthContainer {
    background-color: #f129d7 !important;
    color: #f129d7 !important;
    background-image:none;
} */
/* .sidebar .notes-sidebar .navbar-inverse .navbar-nav li .active  {
    background-image: none;
    background-color: #00ff0d !important;
    color: #00ff0d !important;
} */

.side-bar-brand,
.sidebar-brand {
    /* background-image: none !important; */
    /* background-color: #f129d7 !important;
    color: #f129d7 !important; */
}