.highlight { background-color: yellow; }
.verse { margin-bottom: 1em; cursor: pointer; position: relative; }
#context-menu { position: absolute; background: white; border: 1px solid #ccc; padding: 5px; z-index: 1000; }
#context-menu button { display: block; }
.note-editor { display: none; position: absolute; background: white; border: 1px solid #ccc; padding: 5px; z-index: 1000; }

/* Button */

.btn-link { --bs-link-color: #000000 !important; }

/* Dark Mode */
body.dark-mode { background-color: #2C2F33; color: #E0E0E0; }
body.dark-mode .verse { color: #E0E0E0; }
body.dark-mode .btn-link { color: #4FC3F7; }
body.dark-mode .form-control { background-color: #2C2F33; color: #E0E0E0; border-color: #4FC3F7; }
body.dark-mode .form-control::placeholder { color: #E0E0E0; }
body.dark-mode .btn-primary { background-color: #4FC3F7; }
body.dark-mode .modal-content { background-color: #333; color: #fff; }
body.dark-mode .modal-header { border-bottom-color: #555; }
body.dark-mode .btn-close { filter: invert(1); }
body.dark-mode .highlight { background-color: #4a4a4a; color: #ffffff; } /* Adjust highlight in dark mode */
.user-options { display: inline; white-space: nowrap; }
.user-options * { display: inline; margin: 0 5px; }