.navbar .glyphicon {
    font-size: 0.75em;
    opacity: 1;
    color: #ccc;  /* Text color for icons */
}

/* .container {
    background-color: #141414;
} */

.navbar {
    background-color: #141414;
}

html, body {
    background-color: #181818;
    color: #ddd;
}

blockquote {
    color: #AAAAAA;
}

.table {
    border-bottom: 1px solid #444;
}

#main {
    padding-top: 50px;
    padding-bottom: 50px;
    background-color: #181818;  /* Darker background */
    border-color: #1f2a34;
}

table td, th {
    text-align: center;
    background-color: #2c2c2c;  /* Dark background for table rows */
    color: #e0e0e0;  /* Light text color for table */
}

/* Reading table */
img.book {
    width: 200px;
}

/* Staff page profile pictures */
.profilepic {
    display: block;
    margin: 0 auto;
    height: 200px;
    text-align: center;
}
.profilepic img {
    -ms-interpolation-mode: bicubic;
    max-height: 100%;
    max-width: 100%;
    height: auto;
    width: auto;
    image-orientation: from-image;
}
.profile p {
    text-align: center;
    color: #ddd;  /* Light text color for profile */
}
.profile {
    padding-top: 30px;
}
.staff {
    padding-top: 10px;
    font-size: 130%;
    text-align: center;
    color: #e0e0e0;  /* Light text color for staff */
}

/* Calendar styling */
table {
    border: 1px solid #888;
    margin: auto;
    font-size: 14px;
    width: 100%;
    color: #ddd;  /* Light text color for table */
}
table td {
    padding: 5px;
    margin: 4px;
    border: 1px solid #888;
    vertical-align: middle;
    color: #ddd;  /* Light text color for table cells */
}
table#calendar .td-left {
    text-align: left;
}
table th {
    padding: 5px;
    margin: 4px;
    border: 1px solid #888;
    background-color: #333;  /* Dark background for th */
    color: #fff;
    font-weight: normal;
}
table#calendar .hw0 {
    background-color: #2f3b2a;  /* Slightly darker, more distinct */
}
table#calendar .hw1 {
    background-color: #3d5b68;  /* More distinct contrast */
}
table#calendar .hw2 {
    background-color: #5e4d87;  /* Stronger contrast */
}
table#calendar .hw3 {
    background-color: #6c4b58;  /* Increased contrast */
}
table#calendar .hw4 {
    background-color: #2f3b2a;  /* Consistent with hw0 */
}
table#calendar .hw5 {
    background-color: #3d5b68;  /* More contrast for clarity */
}
table#calendar .hw6 {
    background-color: #5e4d87;  /* Contrast enhanced */
}
table#calendar .hw7 {
    background-color: #6c4b58;  /* Stronger contrast */
}
table#calendar .hw8 {
    background-color: #2f3b2a;  /* Consistent with hw0 */
}
table#calendar .hw9 {
    background-color: #3d5b68;  /* More distinct contrast */
}
table#calendar .proj1 {
    background-color: #4c6779;  /* Slightly deeper and more distinct */
}
table#calendar .proj2 {
    background-color: #616948;  /* Stronger contrast */
}
table#calendar .proj3 {
    background-color: #896f43;  /* More contrast with a golden tone */
}
table#calendar .proj4 {
    background-color: #484c81;  /* Deeper, more distinct contrast */
}
table#calendar .proj5 {
    background-color: #b27e7d;  /* More contrast, warmer tone */
}
table#calendar .gray-bg {
    background: #444;  /* Darker gray background */
}
table#calendar tr th:nth-child(2) {
    width: 60px;
}
table#calendar tr:not(:first-child):hover td:not(.weeknum) {
    background: #4e4e4e;  /* Dark hover effect */
}
table#calendar .today {
    background-color: #4e4e4e;  /* Dark background for today */
}
table#calendar .blended-assignment {
    background: linear-gradient(to right, var(--start-color), var(--end-color));
}

.scrollTodayButton {
    background-color: #333;  /* Dark button background */
    color: #fff;
    padding: 10px 20px;
}

.scrollTodayButton:hover {
    background-color: #444;  /* Darker hover effect */
}

#scrollToday {
    position: fixed;
    bottom: -4px;
    right: 20px;
}

/* Schedule styling */
table#schedule {
    margin-top: 20px;
    width: 100%;
}
table#schedule td {
    border: 1px solid #555;  /* Darker border for schedule */
    font-size: 14px;
    vertical-align: middle;
    color: #ddd;  /* Light text color */
}
table#schedule tr th:first-child {
    width: 12%;
}
table#schedule th {
    width: 17.6%;
    border: 1px solid #555;
    background-color: #333;  /* Dark background for th */
    color: #fff;
}
table#schedule tr:first-child th {
    height: 40px;
}
table#schedule td[colspan=3] {
    width: 8.8%;
}
table#schedule td[colspan=2] {
    width: 5.86666667%;
}
.sched-lec {
    background-color: #4f6b7b;  /* Darker background */
}
.sched-dis {
    background-color: #3e4a3b;  /* Darker background */
}
.min30 {
    height: 30px;
}
.sched-oh {
    background-color: #5e4a6f;  /* Darker background */
}
.sched-oh-prof {
    background-color: #6a6a5e;  /* Darker background */
}

table#schedule td.noborder {
    border: none;
}

/* Special styles for anchors, so that when you go to an anchor, extra space is added for our fixed header. */
a[name] {
    display: block;
    position: relative;
    top: -70px;
    visibility: hidden;
}

a {
    font-weight: bold;
    color: #ccc;  /* Light text color for anchors */
}

h1, h2, h3, h4, h5, h6 {
    /* font-weight: bold;  /* Make headers bolder if needed */
    color: #fff;  /* White color for headers to make them stand out */
}

p ul, p ol, p li {
    color: inherit;  /* Ensure list items inside paragraphs inherit the correct color */
}

p, ul, ol, li {
    color: #ddd;  /* Light gray color for text */
}

p {
    color: #ddd;
}

p * {
    color: inherit;
}

code {
    color: #bbb;
    background-color: #242424;
}

#text {
    color: #ddd;
}

.row.display-flex {
  display: flex;
  flex-wrap: wrap;
}

.row.display-flex > [class*='col-'] {
  display: flex;
  flex-direction: column;
}

::selection {
  color: #CCCCCC;
}

::-moz-selection {
  color: #CCCCCC;
}