body {
    padding-top: 9%;
}

a.selected-letter {
    color: crimson !important;
    font-weight: bold;
}

/* Add some space between the navbar items */
.nav-item {
    margin-right: 15px; /* Adjust as needed */
}

/* Style the navigation links on hover */
.nav-link:hover {
    background-color: #f8f9fa; /* Light gray background */
    border-radius: 5px; /* Rounded corners */
    transition: background-color 0.3s ease; /* Smooth transition */
}

/* Optional: Style the active navigation link */
.nav-link.active {
    font-weight: bold;
    color: #007bff; /* Bootstrap primary color */
}

/* Custom CSS for the toggle button */
#toggleChaptersButton {
    background-color: #007bff; /* Bootstrap primary button color */
    color: white; /* Text color */
    border: none; /* Remove border */
    padding: 4px 15px; /* Add some padding */
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px; /* Larger font size */
    height: 30px;
    cursor: pointer; /* Cursor style */
    border-radius: 5px; /* Optional: for rounded corners */
    transition-duration: 0.5s; /* Optional: for smooth color transition */
}

#toggleChaptersButton:hover {
    background-color: white;
    color: #007bff; /* On hover, text color changes to black */
}

.chapter-title {
    font-family: Georgia;
    color: #570329;
}

.book-title {
    font-weight: bold;
    color: #032080;
}

.chap-detail{
    color: #570329;
}

.notice{
    color: #27C975;
}

.date-header {
    color: #c00909;
} /* Bootstrap primary color */

.type-header {
    color: #112e6e;
}

.filename-column {
  max-width: 330px;
  /*white-space: nowrap;*/
  overflow: hidden;
  text-overflow: ellipsis;
}
.filename-column span {
  display: inline-block;
  max-width: 100%;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.article-note {
    padding: 20px;
    margin-bottom: 20px;
    border-left: 4px solid #2196F3; /* A blue accent for visibility */
    background-color: #f0f0f0; /* A light grey background */
    font-size: 16px;
    line-height: 1.5;
    color: #333; /* Dark grey color for the text */
}

.status-edited {
    color: green;
    background-color: #e6f9e6; /* Light green */
    padding: 5px;
    border-radius: 5px;
}

.status-not-edited {
    color: red;
    background-color: #f9e6e6; /* Light red */
    padding: 5px;
    border-radius: 5px;
}

.scrollable-keyword-list {
    max-height: 200px; /* Set a fixed height */
    max-width: 350px;  /* Set a fixed width */
    overflow-y: auto;  /* Enable vertical scrolling */
    overflow-x: hidden; /* Disable horizontal scrolling */
    margin: 0 auto; /* Center the container horizontally */
    /*padding: 10px;*/
    border: 1px solid #ddd; /* Optional: Add a border for better visibility */
    border-radius: 5px;     /* Optional: Rounded corners */
    background-color: #f8f9fa; /* Optional: Light background color */
}

#viewer-container {
    position: relative;
    height: calc(100vh - 180px);
}
#viewer {
    width: 100%;
    height: 100%;
    transition: margin-left 0.3s;
}
#viewer.toc-visible {
    margin-left: 250px; /* Width of the TOC */
}
/* Responsive adjustments */
@media (max-width: 768px) {
    #toc {
        width: 80%;
    }
    #viewer.toc-visible {
        margin-left: 0;
    }
}