:root {
  --primary-blue: #375b9a;
  --primary-blue-dark: #2c487a;
  --light-gray-bg: #f7f7f7;
  --medium-gray-border: #e0e0e0;
  --dark-gray-text: #333333;
  --light-gray-text: #666666;
  --white-color: #ffffff;
  --panel-width: 350px;
}

body,
button,
input,
textarea {
  font-family: "SourceSansPro", Helvetica, Arial, "serif";
}

.annotator-hl {
  background: rgba(255, 239, 90, 0.8);
  cursor: pointer;
}

.annotator-hl-temporary {
  background: rgba(255, 239, 90, 0.85);
}

.annotator-hl-active {
  background: rgba(255, 239, 90, 0.9);
}


.annotator-outer {
  left: 15px !important;
  z-index: 1070;
}

.annotator-outer.annotator-editor {
  left: 15px !important;
  z-index: 1050;
}

.annotator-widget {
  background-color: var(--white-color);
  border: 1px solid var(--medium-gray-border);
  border-radius: 8px;
  box-shadow: 0 5px 20px rgba(0, 0, 0, 0.15);
  font-size: 14px;
  line-height: 1.5;
  min-width: 320px;
}

.annotator-widget::after,
.annotator-resize,
.annotator-viewer .annotator-controls .annotator-edit,
.annotator-viewer .annotator-controls .annotator-delete {
  display: none !important;
}

.annotator-editor .annotator-item:first-child textarea {
  min-height: 70px !important;
  padding: 12px;
  font-size: 14px;
  color: var(--dark-gray-text);
  border: none;
  border-bottom: 1px solid var(--medium-gray-border);
  border-radius: 4px;
  font-style: normal;
  box-sizing: border-box;
}

.annotator-editor .annotator-item textarea:focus {
  background-color: #fcfcfc;
  outline: none;
}

.annotator-editor .annotator-controls {
  display: flex;
  justify-content: flex-end;
  padding: 10px;
  background-color: #fff !important;
  background-image: none !important;
  border-top: 1px solid var(--medium-gray-border);
  border-radius: 0 0 8px 8px;
}

.annotator-editor .annotator-controls a {
  padding: 8px 16px;
  margin-left: 8px;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid transparent;
  border-radius: 5px;
  cursor: pointer;
  transition: all 0.2s ease;
  text-shadow: none;
  background-image: none !important;
}

.annotator-editor a.annotator-save {
  background-color: var(--primary-blue);
  color: var(--white-color) !important;
}

.annotator-editor a.annotator-save:hover {
  background-color: var(--primary-blue-dark);
}

.annotator-editor a.annotator-cancel {
  background-color: #f8f9fa;
  border-color: #ced4da;
  color: var(--dark-gray-text) !important;
}

.annotator-editor a.annotator-cancel:hover {
  background-color: #dee2e6;
}

.annotator-editor .annotator-controls a::after {
  display: none;
}

.annotator-viewer div:first-of-type {
  padding: 10px;
  color: var(--dark-gray-text);
  font-size: 14px;
  font-style: normal;
  line-height: 1.6;
}

.comments-panel,
.comments-timeline {
  position: fixed;
  top: 0;
  right: 0;
  /*right: calc(-1 * var(--panel-width));*/
  width: var(--panel-width);
  height: 100vh;
  background-color: var(--light-gray-bg);
  box-shadow: -4px 0 15px rgba(0, 0, 0, 0.1);
  z-index: 1050;
  overflow-y: auto;
  /*transition: right 0.3s ease-in-out;*/
  padding-top: 60px;
  box-sizing: border-box;

  /* hidden state */
  transform: translateX(100%);
  opacity: 0;
  pointer-events: none;

  transition: transform 300ms ease, opacity 200ms ease;
  will-change: transform;
}

.open .comments-panel,
.open .comments-timeline {
  /*right: 0;*/
  transform: translateX(0);
  opacity: 1;
  pointer-events: auto;
}

.comments-panel .comments-close-btn,
.comments-timeline .comments-timeline-close-btn {
  position: absolute;
  top: 15px;
  right: 15px;
  font-size: 24px;
  color: var(--light-gray-text);
  background: none;
  border: none;
  cursor: pointer;
  padding: 5px;
  line-height: 1;
}

.comments-panel .comments-close-btn:hover,
.comments-timeline .comments-timeline-close-btn:hover {
  color: var(--dark-gray-text);
}

.comments-toggle,
.comments-timeline-toggle {
  position: fixed;
  top: 30%;
  right: 0;
  width: 45px;
  height: 180px;
  background-color: var(--primary-blue);
  color: var(--white-color);
  border: none;
  border-top-left-radius: 8px;
  border-bottom-left-radius: 8px;
  cursor: pointer;
  z-index: 1040;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: right 0.3s ease-in-out;
  box-shadow: -2px 2px 10px rgba(0, 0, 0, 0.15);
}

.comments-timeline-toggle {
  top: 55%;
}

.open .comments-toggle,
.open .comments-timeline-toggle {
  right: var(--panel-width);
}

.comments-toggle span,
.comments-timeline-toggle span {
  display: block;
  font-size: 18px;
  font-weight: 500;
  white-space: nowrap;
  transform: rotate(-90deg);
}

.timeline {
  padding: 0 25px 25px 25px;
}

.timeline ul {
  list-style: none;
  padding-left: 0;
  margin: 0;
}

.timeline li {
  padding: 8px 0;
}

.timeline .lvl1>li {
  padding-left: 10px;
  cursor: pointer;
  font-weight: bold;
  color: var(--dark-gray-text);
}

.timeline ul.lvl2 {
  max-height: 0;
  overflow: hidden;
  font-size: 14px;
  transition: max-height 0.4s ease-in-out;
  margin: 0;
  padding: 0;
  list-style-position: inside;
  padding-left: 20px;
  font-weight: normal;
}

.timeline ul.lvl2.expanded {
  max-height: 100%;
  margin-top: 5px;
}

.toggle-revision {
  display: inline-block;
  transition: transform 0.4s ease;
  margin-right: 8px;
  font-size: 12px;
}

.toggle-revision.expanded {
  transform: rotate(90deg);
}

@media (max-width: 768px) {
  :root {
    --panel-width: 85vw;
    /* Make panel wider on small screens */
  }

  .comments-toggle,
  .comments-timeline-toggle {
    width: 40px;
  }
}

.annotator-adder {
  background-image: none !important;
  width: 48px !important;
  height: 48px !important;
  display: flex;
  align-items: center;
  justify-content: center;
}

.annotator-adder button {
  font-size: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: auto;
  height: auto;
  border: none;
  background: none;
  cursor: pointer;
  color: #333;
}

.annotator-adder button:hover {
  color: #0071b8;
}

.annotator-adder button::before {
  font-family: "Font Awesome 6 Free";
  font-weight: 400;
  content: "\f075";
  font-size: 36px;
}

/* legacy base64 icon removed — replaced by Font Awesome
.annotator-adder-legacy {
  background-image: url('data:image/png;base64,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');
  /* background-image: url('data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAJAAAAAwCAYAAAD+WvNWAAAAGXRFWHRTb2Z0d2FyZQBBZG9iZSBJbWFnZVJlYWR5ccllPAAAA2ZpVFh0WE1MOmNvbS5hZG9iZS54bXAAAAAAADw/eHBhY2tldCBiZWdpbj0i77u/IiBpZD0iVzVNME1wQ2VoaUh6cmVTek5UY3prYzlkIj8+IDx4OnhtcG1ldGEgeG1sbnM6eD0iYWRvYmU6bnM6bWV0YS8iIHg6eG1wdGs9IkFkb2JlIFhNUCBDb3JlIDUuMC1jMDYwIDYxLjEzNDc3NywgMjAxMC8wMi8xMi0xNzozMjowMCAgICAgICAgIj4gPHJkZjpSREYgeG1sbnM6cmRmPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5LzAyLzIyLXJkZi1zeW50YXgtbnMjIj4gPHJkZjpEZXNjcmlwdGlvbiByZGY6YWJvdXQ9IiIgeG1sbnM6eG1wTU09Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC9tbS8iIHhtbG5zOnN0UmVmPSJodHRwOi8vbnMuYWRvYmUuY29tL3hhcC8xLjAvc1R5cGUvUmVzb3VyY2VSZWYjIiB4bWxuczp4bXA9Imh0dHA6Ly9ucy5hZG9iZS5jb20veGFwLzEuMC8iIHhtcE1NOk9yaWdpbmFsRG9jdW1lbnRJRD0ieG1wLmRpZDowMzgwMTE3NDA3MjA2ODExODRCQUU5RDY0RTkyQTJDNiIgeG1wTU06RG9jdW1lbnRJRD0ieG1wLmRpZDowOUY5RUFERDYwOEIxMUUxOTQ1RDkyQzU2OTNEMDZENCIgeG1wTU06SW5zdGFuY2VJRD0ieG1wLmlpZDowOUY5RUFEQzYwOEIxMUUxOTQ1RDkyQzU2OTNEMDZENCIgeG1wOkNyZWF0b3JUb29sPSJBZG9iZSBQaG90b3Nob3AgQ1M1IE1hY2ludG9zaCI+IDx4bXBNTTpEZXJpdmVkRnJvbSBzdFJlZjppbnN0YW5jZUlEPSJ4bXAuaWlkOjA1ODAxMTc0MDcyMDY4MTE5MTA5OUIyNDhFRUQ1QkM4IiBzdFJlZjpkb2N1bWVudElEPSJ4bXAuZGlkOjAzODAxMTc0MDcyMDY4MTE4NEJBRTlENjRFOTJBMkM2Ii8+IDwvcmRmOkRlc2NyaXB0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'); */


.timeline {
  font-family: "SourceSansPro", Helvetica, Arial, "serif";
  padding: 0 10px;
}

.timeline ul.lvl1 {
  list-style: none;
  padding-left: 20px;
  border-left: 3px solid #e0e0e0;
  margin-bottom: 25px;
}

.timeline ul.lvl1>li {
  position: relative;
  padding: 0;
  cursor: pointer;
}

.timeline ul.lvl1>li::before {
  content: '';
  position: absolute;
  left: -28px;
  top: 5px;
  width: 14px;
  height: 14px;
  background-color: #375b9a;
  border-radius: 50%;
  border: 2px solid #f7f7f7;
}

.timeline .revision-title {
  font-size: 16px;
  font-weight: bold;
  color: #375b9a;
  text-decoration: none;
  display: inline-block;
}

.timeline .revision-title:hover {
  text-decoration: underline;
}

.timeline .revision-title::after {
  content: " " attr(data-date-time);
  display: block;
  font-size: 13px;
  font-weight: normal;
  color: #666666;
  margin-top: 4px;
}

.timeline .revision-title {
  line-height: 1.4;
}

.timeline ul.lvl2 {
  list-style: none;
  padding: 10px 0 0 0;
  margin-left: -20px;
}

.timeline ul.lvl2>li {
  padding: 12px 15px;
  background-color: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  margin: 10px 0 10px 20px;
  position: relative;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
}

.timeline ul.lvl2>li::before {
  content: '';
  position: absolute;
  left: -22px;
  top: 18px;
  width: 20px;
  height: 1px;
  background-color: #375b9a;
}

.timeline .load-thread {
  color: #333333;
  font-size: 14px;
  line-height: 1.5;
  cursor: pointer;
  display: block;
}

.timeline .load-thread:hover {
  color: #375b9a;
}

.toggle-revision {
  display: inline-block;
  vertical-align: middle;
  margin-right: 5px;
  transition: transform 0.3s ease;
  color: #666;
  font-size: 10px;
}

.toggle-revision.expanded {
  transform: rotate(90deg);
}

.offcanvas-comment-section h3 {
  padding-left: 15px;
}

.annotator-widget {
  padding: 0;
  border: 1px solid #e0e0e0;
  background-color: #ffffff;
}

.annotator-widget>div:first-child {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 5px 15px;
  border-bottom: 1px solid #e0e0e0;
}

.annotator-widget h5 {
  color: var(--primary-blue);
  font-size: 16px;
  font-weight: 600;
  margin: 0;
}

.annotator-widget>div:first-child>div:last-child {
  font-size: 20px;
  color: #666;
  cursor: pointer;
  font-weight: bold;
}

.annotator-listing {
  padding: 15px;
}

.annotator-widget textarea.comment-input {
  width: 100%;
  min-height: 70px !important;
  padding: 10px;
  border-radius: 6px;
  border: 1px solid #ced4da;
  box-sizing: border-box;
}

.annotator-widget textarea.comment-input:focus {
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 2px rgba(55, 91, 154, 0.2);
  outline: none;
}

.annotator-item:has(input[type="file"]) {
  padding-top: 10px;
}

.file-upload-notice {
  font-size: 12px;
  color: var(--light-gray-text);
  padding-top: 5px;
}

.annotator-controls {
  display: flex;
  justify-content: flex-end;
  align-items: center;
  gap: 10px;
  background-color: #f8f9fa;
  padding: 12px 15px;
  border-top: 1px solid #e0e0e0;
  border-radius: 0 0 8px 8px;
}

.annotator-controls button {
  padding: 8px 20px;
  font-weight: 600;
  border-radius: 5px;
  border: 1px solid #ced4da;
  cursor: pointer;
}

button.annotator-cancel {
  background-color: #f8f9fa;
  color: var(--dark-gray-text);
}

button.annotator-cancel:hover {
  background-color: #dee2e6;
}

button.annotator-save {
  background-color: var(--primary-blue);
  border-color: var(--primary-blue);
  color: #ffffff;
  position: relative;
  padding-left: 28px;
}

button.annotator-save:hover {
  background-color: var(--primary-blue-dark);
  border-color: var(--primary-blue-dark);
}

button.annotator-save:disabled,
button.annotator-save.is-disabled {
  background-color: #adb5bd;
  border-color: #adb5bd;
  color: #f8f9fa;
  cursor: not-allowed;
  opacity: 0.75;
}

button.annotator-save:disabled:hover,
button.annotator-save.is-disabled:hover {
  background-color: #adb5bd;
  border-color: #adb5bd;
}

button.annotator-save::before {
  content: '⮚';
  position: absolute;
  left: 10px;
  top: 49%;
  transform: translateY(-50%) rotate(-45deg);
  font-size: 16px;
  line-height: 1;
}

li.annotator-item:has(#annotator-field-0) {
  display: none;
}


.mention-dropdown-container {
  border: none !important;
  margin: 0 !important;
}

textarea.comment-input {
  display: block;
  width: 100%;
  min-height: 70px !important;
  padding: 12px;
  font-size: 14px;
  line-height: 1.6;
  color: var(--dark-gray-text);
  background-color: #fff;
  border: 1px solid #ced4da;
  border-radius: 6px;
  box-sizing: border-box;
  transition: border-color .15s ease-in-out, box-shadow .15s ease-in-out;
}

textarea.comment-input:focus {
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 3px rgba(55, 91, 154, 0.2);
  outline: none;
}

.mention-dropdown {
  position: absolute;
  z-index: 1100;
  background: #fff;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  max-height: 250px;
  overflow-y: auto;
}

.mention-dropdown-header {
  padding: 8px 12px;
  font-size: 13px;
  color: #6c757d;
  border-bottom: 1px solid #f0f0f0;
  background-color: #f8f9fa;
}

.mention-dropdown-list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.mention-user {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  cursor: pointer;
  transition: background-color 0.2s;
}

.mention-user:hover,
.mention-user.active {
  background-color: #eef2f9;
}

.mention-user-name {
  font-weight: 500;
  color: var(--dark-gray-text);
}

li.annotator-item:has(input[type="file"]) {
  padding: 15px;
  border: 2px dashed #e0e0e0;
  border-radius: 6px;
  text-align: center;
  background-color: #f8f9fa;
}

.file-upload-notice {
  font-size: 13px;
  color: var(--light-gray-text);
}

.annotator-file-upload-input {
  display: none !important;
}

.file-upload-label {
  display: inline-block;
  padding: 8px 16px;
  background-color: #f8f9fa;
  border: 1px solid #ced4da;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  color: #212529;
  cursor: pointer;
  transition: background-color 0.2s;
}

.file-upload-label:hover {
  background-color: #e9ecef;
}

li.annotator-item:has(input[type="file"]) {
  border: none;
  background-color: transparent;
  padding: 0;
  text-align: left;
}

li.annotator-item:has(input[type="file"]) {
  border: none;
  background-color: transparent;
  padding: 0;
}

.annotator-file-upload-input {
  display: none;
}

.file-upload-label {
  display: inline-block;
  /* Aligns elements horizontally */
  vertical-align: middle;
  /* Aligns vertically */
  padding: 8px 16px;
  background-color: #f8f9fa;
  border: 1px solid #ced4da;
  border-radius: 4px;
  font-size: 14px;
  font-weight: 500;
  color: #212529;
  cursor: pointer;
  transition: background-color 0.2s;
  white-space: nowrap;
  color: #375b9a;
  font-weight: bold;
  padding: 12px;
  font-size: 14px;
}

.file-upload-label:hover {
  background-color: #e9ecef;
}

.file-upload-notice {
  display: inline-block;
  vertical-align: middle;
  font-size: 12px;
  font-weight: 500;
  color: #6c757d;
  background-color: #e9ecef;
  padding: 11px;
  border-radius: 4px;
  border: 1px solid #dee2e6;
}

.current-files {
  /* margin-top: 15px;
  padding-top: 15px;
  border-top: 1px solid #e9ecef; Separator line */
}

.editor-file-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  flex-direction: column-reverse;
}

.editor-file-list li {
  display: inline-flex;
  align-items: center;
  background-color: #e9ecef;
  border: 1px solid #dee2e6;
  border-radius: 16px;
  padding: 5px 8px 5px 12px;
  font-size: 13px;
  max-width: 100%;
}

.file-link {
  color: #212529;
  text-decoration: none;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 350px;
}

.file-link:hover {
  text-decoration: underline;
  color: var(--primary-blue);
}

.annotator-file-remove {
  background-color: transparent;
  border: none;
  padding: 0;
  width: 20px;
  height: 20px;
  margin-left: 8px;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
  font-size: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.annotator-file-remove::before {
  content: '×';
  color: #6c757d;
  font-size: 18px;
  line-height: 1;
  font-weight: bold;
  transition: color 0.2s;
}

.annotator-file-remove:hover {
  background-color: #dc3545;
}

.annotator-file-remove:hover::before {
  color: white;
}

.file-link {
  color: #343a40;
  font-weight: 500;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 250px;
}

.file-link::before {
  content: '';
  margin-right: 8px;
  font-size: 14px;
}

.file-link:hover {
  color: var(--primary-blue);
  text-decoration: underline !important;
}

.editor-file-list .file-link {
  color: #343a40;
  font-weight: 500;
  text-decoration: none !important;
  display: inline-flex;
  align-items: center;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
  padding: 0;
  background: none;
  border: none;
  box-shadow: none;
}

.editor-file-list .file-link::before {
  content: '';
  margin-right: 8px;
  font-size: 14px;
}

.editor-file-list .file-link::after {
  display: none !important;
}

.editor-file-list .file-link:hover {
  color: var(--primary-blue);
  text-decoration: underline !important;
}

.editor-file-list li:hover {
  background-color: #dbe4f5;
  border-color: #b9c7e0;
}

.annotator-editor a:hover,
.annotator-editor a:focus {
  background-image: none !important;
  background-color: transparent;

}

.annotator-quote-display {
  background-color: #fffbe6;
  border: 2px dashed #ffe58f;
  border-radius: 4px;
  padding: 10px 12px;
  margin: 5px 10px 8px 0;
  font-size: 14px;
  color: #664d03;
  line-height: 1.5;
}

.comment-toggle-btn {
  display: inline;
  padding: 0;
  font-size: inherit;
  font-weight: inherit;
  font-family: inherit;
  line-height: inherit;
  color: #375b9a;
  background: none;
  border: none;
  cursor: pointer;
  text-decoration: underline;
}

.comment-toggle-btn:hover {
  color: #1a3a6b;
}

.annotator-controls {
  display: flex;
  align-items: center;
}

.annotator-controls .annotator-cancel {
  margin-left: auto;
}

.annotator-controls .form-check {
  border: 1px solid #ced4da;
  padding: 9px 14px 9px 6px;
  border-radius: 5px;
  color: #333 !important;
}

.formDoiLabel {
  color: #333 !important;
}

.modal-body h4 {
  font-weight: bold;
  margin-top: 1rem;
  color: #000;
}

.modal-body h5:first-of-type {
  margin-top: 0;
}

.modal-body ul {
  list-style: none;
  padding-left: 0;
  margin-top: 0.5rem;
}

.modal-body li {
  padding-left: 1.5rem;
  position: relative;
  margin-bottom: 0.5rem;
  line-height: 1.6;
  color: #464b4f !important;
}

.modal-body li::before {
  content: '•';
  position: absolute;
  left: 0.5rem;
  color: #6c757d !important;
}

.modal-body kbd {
  padding: 0.2rem 0.5rem;
  font-size: 0.875em;
  color: #212529;
  background-color: #f0f0f0;
  border: 1px solid #ced4da;
  border-radius: 0.25rem;
  box-shadow: inset 0 -1px 0 #ced4da;
}

.modal-body a {
  color: #0d6efd;
  text-decoration: underline;
}

.modal-body a:hover {
  text-decoration: none;
}

#staticBackdrop {
  z-index: 1080 !important;
}

#staticBackdrop .btn-primary {
  background-color: #375b9a;
  border-color: #375b9a;
}

#staticBackdrop .btn-primary:hover {
  background-color: #2c487a;
  border-color: #2c487a;
}

.modal-body {
  font-size: 14px;
  line-height: 1.4;
}

/* Ensure headings are bold and max 16px */
.modal-body h4 {
  font-size: 16px;
  font-weight: bold;
}

.modal-body b {
  font-weight: bold;
  color: #000 !important;
}

.modal .modal-content {
  padding: 15px !important;
  border-radius: 4px !important;
  background-color: #ffffff;
}

.modal-title {
  color: #375b9a !important;
  font-weight: 400;
}

li.annotator-item:has(input[type="file"]) {
  display: flex;
  align-items: baseline;
  justify-content: flex-start;
  flex-direction: row;
  border: none;
  background-color: transparent;
  padding: 2px 0;
}

.current-files {}

.editor-file-list {
  list-style: none;
  padding: 0;
  margin: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.editor-file-list li {
  display: inline-flex;
  align-items: center;
  background-color: #ffffff;
  border: 1px solid #ced4da;
  border-radius: 6px;
  padding: 5px 8px 5px 12px;
  font-size: 13px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
}

.file-link::before {
  content: '';
  display: inline-block;
  width: 16px;
  height: 16px;
  margin-right: 8px;
  background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="%236c757d"><path d="M4 0h8a2 2 0 0 1 2 2v12a2 2 0 0 1-2 2H4a2 2 0 0 1-2-2V2a2 2 0 0 1 2-2zm0 1a1 1 0 0 0-1 1v12a1 1 0 0 0 1 1h8a1 1 0 0 0 1-1V2a1 1 0 0 0-1-1H4z"/><path d="M4.5 3.5a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h5a.5.5 0 0 1 0 1h-5a.5.5 0 0 1-.5-.5zm0 2a.5.5 0 0 1 .5-.5h2a.5.5 0 0 1 0 1h-2a.5.5 0 0 1-.5-.5z"/></svg>');
  background-size: contain;
  background-repeat: no-repeat;
}

.annotator-file-remove {
  background-color: transparent;
  border: none;
  padding: 0;
  width: 20px;
  height: 20px;
  margin-left: 8px;
  border-radius: 50%;
  cursor: pointer;
  transition: background-color 0.2s, color 0.2s;
  font-size: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.annotator-file-remove::before {
  content: '×';
  color: #6c757d;
  font-size: 18px;
  line-height: 1;
  font-weight: bold;
  transition: color 0.2s;
}

.annotator-file-remove:hover {
  background-color: #dc3545;
}

.annotator-file-remove:hover::before {
  color: white;
}

.annotator-item {
  align-items: baseline;
}

.annotator-viewer .annotator-widget {
  padding: 0 !important;
  border: 1px solid #e0e0e0;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
  background: #fff;
  border-radius: 10px;
}

.comment-viewer-header {
  border-bottom: none !important;
  display: flex;
  justify-content: space-between;
  align-items: flex-start !important;
  padding: 12px 15px;
}

.comment-author-info {
  display: flex;
  align-items: center;
  gap: 12px;
}

.author-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background-color: var(--primary-blue) !important;
  color: white !important;
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: bold;
  font-size: 16px;
}

.author-details {
  border-top: none !important;
  display: flex;
  flex-direction: column;
}

.author-name {
  font-weight: bold;
  color: var(--dark-gray-text);
}

.comment-timestamp {
  font-size: 12px;
  color: var(--light-gray-text);
}

.comment-close-btn {
  background: none;
  border: none;
  font-size: 24px;
  font-weight: 300;
  color: #6c757d;
  cursor: pointer;
}

.comment-viewer-body {
  padding: 0 15px 10px 25px  !important;
  border-top: none !important;
  border-radius: 4px;
  margin: 6px 12px 6px 0;
  font-size: 14px;
  line-height: 1.6;
}


.comment-viewer-attachments {
  padding: 0 15px 15px 15px;
}

.comment-viewer-attachments .editor-file-list li {
  background-color: #f8f9fa;
  padding: 5px 12px;
  font-size: 13px;
}

.comment-viewer-attachments .file-link::before {
  filter: grayscale(1);
}

.comment-viewer-footer {
  gap: 20px;
  display: flex;
  justify-content: flex-end;
  align-items: center;
  padding: 12px 15px;
  border-top: 1px solid #e0e0e0;
}

.comment-viewer-attachments .editor-file-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 125px;
  overflow-y: auto;
  padding: 10px;
  background-color: #f8f9fa;
  border-radius: 6px;
  border: 1px solid #e9ecef;
}

.comment-viewer-attachments .editor-file-list li {
  margin: 0;
  background-color: #ffffff;
}


.offcanvas-comment-section h3 {
  font-size: 22px;
  font-weight: 600;
  color: var(--primary-blue);
  padding-bottom: 15px;
  margin-bottom: 20px;
  border-bottom: 1px solid var(--medium-gray-border);
}

.comment-wrapper {
  background-color: #ffffff;
  border: 1px solid var(--medium-gray-border);
  border-radius: 8px;
  padding: 20px;
  margin-bottom: 25px;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.05);
}

.parent-comment {
  list-style: none;
  padding: 0;
  margin: 0;
}

.comment-user a {
  font-weight: bold;
  font-size: 16px;
  text-decoration: none;
  color: var(--dark-gray-text);
}

.comment-user a:hover {
  color: var(--primary-blue);
}

.comment-text {
  margin: 10px 0 15px 0;
  font-size: 16px;
  line-height: 1.6;
  color: #343a40;
}

.comment-time {
  display: block;
  text-align: right;
  font-size: 12px;
  color: var(--light-gray-text);
  margin-top: 10px;
}

.annotator-file-list-sidebar {
  list-style: none;
  padding: 15px 0 5px 0;
  margin-top: 15px;
  border-top: 1px solid var(--medium-gray-border);
}

.annotator-file-list-sidebar li {
  margin-bottom: 5px;
}

.annotator-file-list-sidebar li a {
  text-decoration: none;
  color: var(--primary-blue);
  font-size: 13px;
  font-weight: 500;
}

.annotator-file-list-sidebar li a:hover {
  text-decoration: underline;
}

.annotator-file-list-sidebar li a::before {
  content: '📎';
  margin-right: 8px;
  opacity: 0.7;
}

.offcanvas-comment-section {
  padding: 0 10px;
}

.timeline-back-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: calc(100% - 30px);
  margin: 4px 15px 18px;
  padding: 10px 14px;
  border: 1px solid rgba(55, 91, 154, 0.28);
  border-radius: 6px;
  background: var(--white-color);
  color: var(--primary-blue);
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  cursor: pointer;
  font-size: 14px;
  font-weight: 700;
  line-height: 1.2;
  text-align: center;
  transition: background-color 0.2s ease, border-color 0.2s ease, box-shadow 0.2s ease, color 0.2s ease;
}

.timeline-back-button::before {
  content: '';
  width: 8px;
  height: 8px;
  border-bottom: 2px solid currentColor;
  border-left: 2px solid currentColor;
  transform: rotate(45deg);
}

.timeline-back-button:hover {
  border-color: var(--primary-blue);
  background: #eef3fb;
  color: var(--primary-blue-dark);
  box-shadow: 0 3px 8px rgba(55, 91, 154, 0.16);
}

.timeline-back-button:focus-visible {
  outline: 3px solid rgba(55, 91, 154, 0.25);
  outline-offset: 2px;
}

.offcanvas-comment-section h4 {
  font-size: 18px;
  font-weight: 600;
  color: var(--dark-gray-text);
  margin-bottom: 15px;
  padding-top: 20px;
  border-top: 1px solid var(--medium-gray-border);
}

.add-comment .comment-input {
  width: 100%;
  min-height: 100px;
  padding: 10px;
  border-radius: 6px;
  border: 1px solid #ced4da;
  font-size: 14px;
}

.add-comment .comment-input:focus {
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 3px rgba(55, 91, 154, 0.2);
  outline: none;
}

.add-comment .post-comment-btn {
  width: 100%;
  margin-top: 15px;
  padding: 12px;
  font-size: 16px;
  font-weight: 600;
  border: none;
  border-radius: 6px;
  background-color: var(--primary-blue);
  color: var(--white-color);
  cursor: pointer;
  transition: background-color 0.2s;
}

.add-comment .post-comment-btn:hover {
  background-color: var(--primary-blue-dark);
}

.comment-wrapper {
  padding: 16px 20px;
}

.parent-comment {
  padding-bottom: 12px;
  border-bottom: 1px solid #f0f0f0;
  margin-bottom: 8px;
}

.comment-user a {
  font-weight: 600;
  font-size: 15px;
  color: var(--primary-blue);
  text-decoration: none;
}

.comment-user a:hover {
  text-decoration: underline;
}

.comment-text {
  font-size: 16px;
  line-height: 1.6;
  color: #343a40;
  margin: 8px 0 0 0;
}

.comment-time {
  font-size: 12px;
  color: #6c757d;
}

.reply-btn,
.timeline-btn {
  gap: 5px;
  display: inline-flex;
  align-items: baseline;
  justify-content: center;
  padding: 8px 16px;
  font-weight: 600;
  font-size: 14px;
  background-color: #ffffff;
  border-radius: 6px;
  border: 1px solid;
  cursor: pointer;
  transition: all 0.2s ease-in-out;
}


.reply-btn {
  border-color: var(--primary-blue);
  color: var(--primary-blue);
}

.reply-btn i {
  color: currentColor;
  transform: rotate(-90deg);
}

.timeline-btn i {
  color: white;
  transform: rotate(-45deg);
}

.reply-btn:hover,
.reply-btn:focus {
  background-color: var(--primary-blue);
  color: white;
}

.timeline-btn {
  background-color: var(--primary-blue);
  border-color: var(--primary-blue);
  color: white;
}


.timeline-btn:hover {
  background-color: var(--primary-blue-dark);
  color: white;
}

.comment-viewer-footer {
  display: flex;
  justify-content: flex-end;
  align-items: center;
}


.inline-comment-icon {
  width: 25px;
  height: 25px;
  vertical-align: middle;
  margin-right: 5px;
  flex: none;
}

.inline-comment-er-icon {
  background-image: url(../images/er_icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 25px;
  height: 25px;
  display: inline-block;
}

.inline-comment-sc-icon {
  background-image: url(../images/sc_icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 25px;
  height: 25px;
  display: inline-block;
}

.inline-comment-rsc-icon {
  background-image: url(../images/rsc_icon.png);
  background-size: contain;
  background-repeat: no-repeat;
  width: 25px;
  height: 25px;
  display: inline-block;
}

.mention-dropdown {
  display: none;
  position: absolute;
  z-index: 1001;
  background: #f5f5f5;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-shadow: 0 2px 10px rgba(0, 0, 0, 0.2);
  max-height: 300px;
  overflow-y: auto;
}

.mention-dropdown-header {
  padding: 8px 12px;
  font-size: 0.9em;
  color: #666;
  border-bottom: 1px solid #eee;
  background: #f5f5f5;
}

.mention-dropdown-list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.mention-user {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  cursor: pointer;
  transition: background 0.2s;
}

.mention-user:hover,
.mention-user.active {
  background: #e6f2ff;
}

.mention-user-avatar {
  width: 24px;
  height: 24px;
  border-radius: 50%;
  margin-right: 8px;
  object-fit: cover;
}

.mention-user-name {
  font-weight: 900;
  font-size: 16px;
  color: #333;
}

.mention-user-username {
  font-size: 12px;
  color: #727272;
  margin-left: 0px;
}

#annotator-field-0 {
  display: none;
}

.comment-user {
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.inline-comment-icon {
  background-image: none !important;
  width: auto;
  height: auto;
  display: inline-block;
  padding: 3px 8px;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
  text-align: center;
  border-radius: 4px;
  color: var(--primary-blue);
  background-color: #eef2f9;
  border: 1px solid #b9c7e0;
}

.inline-comment-er-icon::before {
  content: 'ER';
}

.inline-comment-sc-icon::before {
  content: 'SC';
}

.inline-comment-rsc-icon::before {
  content: 'rSC';
}

.mention-dropdown {
  position: absolute;
  z-index: 1100;
  background: #ffffff;
  border: 1px solid var(--medium-gray-border);
  border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
  min-width: 250px;
  max-height: 220px;
  overflow-y: auto;
}

.mention-dropdown-header {
  padding: 10px 15px;
  font-size: 13px;
  font-weight: 500;
  color: var(--light-gray-text);
  border-bottom: 1px solid var(--medium-gray-border);
  background-color: var(--light-gray-bg);
}

.mention-dropdown-list {
  padding: 5px 0;
  margin: 0;
  list-style: none;
}

.mention-user {
  display: flex;
  align-items: center;
  padding: 8px 15px;
  cursor: pointer;
  transition: background-color 0.2s;
}

.mention-user:hover,
.mention-user.active {
  background-color: #eef2f9;
}

.mention-user-name {
  font-weight: 500;
  color: var(--dark-gray-text);
}

.mention-user-username {
  font-size: 0.9em;
  color: var(--light-gray-text);
  margin-left: 8px;
}

.mention-user {
  display: flex;
  align-items: center;
  padding: 8px 15px;
  cursor: pointer;
  transition: background-color 0.2s;
  gap: 12px;
}

.mention-user::before {
  display: none;
}

.mention-user:hover,
.mention-user.active {
  background-color: #eef2f9;
}

.mention-user-avatar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  object-fit: cover;
  flex-shrink: 0;
}

.mention-user>div {
  display: flex;
  flex-direction: column;
}


.mention-user-name {
  font-weight: 900;
  font-size: 16px;
  color: var(--dark-gray-text);
  line-height: 1.3;
}

.mention-user-username {
  font-size: 12px;
  color: #7f7f7f;
  /* line-height: 1.3; */
  margin-left: 0px;
}

.mention-dropdown {
  background: #fdfdfd;
  border: 1px solid var(--medium-gray-border);
  border-radius: 8px;
  box-shadow: 0 5px 15px rgba(0, 0, 0, 0.12);
  min-width: 250px;
  max-height: 220px;
  overflow-y: auto;
}

div.table-of-content ul {
  margin: 5px !important;
}

.reply-file-area {
  margin-top: 15px;
}

.reply-file-label {
  display: inline-block;
  padding: 8px 16px;
  border: 1px solid #ced4da;
  border-radius: 5px;
  cursor: pointer;
  font-size: 14px;
  font-weight: 500;
  color: #6c757d;
  background-color: #fff;
  transition: background-color 0.2s;
}

.reply-file-label:hover {
  background-color: #f8f9fa;
}

.file-names-display {
  display: inline-block;
  vertical-align: middle;
  margin-left: 15px;
  font-size: 13px;
  color: #6c757d;
  font-style: italic;
}


.annotator-editor .editor-file-list {
  display: flex;
  flex-direction: column;
  gap: 8px;
  max-height: 125px;
  overflow-y: auto;
  padding: 10px;
  margin-top: 10px;
  background-color: #f8f9fa;
  border-radius: 6px;
  border: 1px solid #e9ecef;
}

.annotator-editor .editor-file-list li {
  background-color: #ffffff;
  border-color: #dee2e6;
  box-shadow: none;
}

li.annotator-item:has(input[type="file"]) {
  display: flex;
  justify-content: flex-start;
  gap: 15px;
  align-items: flex-start;
}

.comment-viewer-body p,
.comment-body-preview p,
.comment-body-full p,
.comment-text-full p {
  white-space: pre-wrap;
}

.comment-text {
  white-space: pre-wrap;
}

#custom-messages-container {
  position: fixed;
  top: 80px;
  right: 20px;
  z-index: 2000;
  width: 350px;
}

.custom-message {
  position: relative;
  padding: 15px 40px 15px 20px;
  margin-bottom: 15px;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
  color: #fff;
  opacity: 0;
  transform: translateX(20px);
  animation: slideInAndFade 0.4s ease-out forwards;
}

.custom-message.success {
  background-color: #28a745;
  border-left: 5px solid #218838;
}

.custom-message.error {
  background-color: #dc3545;
  border-left: 5px solid #c82333;
}

.message-content {
  font-weight: 500;
}

.custom-message .close-btn {
  position: absolute;
  top: 50%;
  right: 15px;
  transform: translateY(-50%);
  background: none;
  border: none;
  color: #fff;
  opacity: 0.7;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
  line-height: 1;
}

.custom-message .close-btn:hover {
  opacity: 1;
}

@keyframes slideInAndFade {
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

.competing-interests-section {
  padding: 15px;
  margin: 8px 10px 0 0;
  background-color: #f8f9fa;
  border: 1px solid var(--medium-gray-border);
  border-radius: 6px;
}

.competing-interests-section .form-check {
  padding-left: 0;
}

.competing-interests-section h5 {
  margin: 0 0 5px 0;
  font-size: 16px;
  font-weight: 600;
  color: var(--dark-gray-text);
}

.competing-interests-section .field-description {
  font-size: 14px;
  color: var(--light-gray-text);
  margin-bottom: 15px;
}

.competing-interests-section .form-check {
  margin-bottom: 8px;
}

.competing-interests-section .form-check-label {
  color: var(--dark-gray-text);
  font-size: 14px !important;
}

.annotator-widget strong {
  font-weight: bold;
  color: var(--light-gray-text);
}

.annotator-editor .annotator-item input[type=radio],
.annotator-editor .annotator-item input[type=checkbox] {
  margin: 3px 5px 0 0;

}


.competing-interests-description {}

.competing-interests-description label {
  display: block;
  margin-bottom: 5px;
  font-weight: 500;
}

.field-footer {
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
  font-size: 12px;
  color: var(--light-gray-text);
}

.char-counter {
  text-align: right;
}


.error-message {
  color: #dc3545;
  font-size: 13px;
  font-weight: 500;
  margin-top: 10px;
}

.breadcrumb {
  padding-top: 13px !important;
  font-size: 18px !important;
  line-height: 1rem !important;
  /* letter-spacing: 13px; */
}

.annotator-editor-header {
  cursor: move;
}

* {
  font-family: "SourceSansPro", Helvetica, Arial, "serif";
}


.field-footer {
  display: flex;
  justify-content: space-between;
  margin-top: 5px;
  font-size: 12px;
  color: var(--light-gray-text);
}

.char-counter {
  text-align: right;
}


.error-message {
  color: #dc3545;
  font-size: 13px;
  font-weight: 500;
  margin-top: 10px;
}

.breadcrumb {
  padding-top: 13px !important;
  font-size: 18px !important;
  line-height: 1rem !important;
  /* letter-spacing: 13px; */
}

.annotator-editor-header {
  cursor: move;
}

* {
  font-family: "SourceSansPro", Helvetica, Arial, "serif";
}


@media (max-width: 576px) {
  .annotator-controls {
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 10px;
  }

  .annotator-controls .form-check {
    width: 100%;
    margin-bottom: 10px;
    justify-content: flex-start;
  }

  .annotator-controls .annotator-cancel {
    margin-left: 0;
  }
}


.timeline ul.lvl2 .load-thread {
  display: block;
  text-decoration: none;
  color: inherit;
}

.timeline .timeline-comment-list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.timeline .timeline-comment-list--level-0 {
  margin-top: 8px;
}

.timeline .timeline-comment-item {
  position: relative;
  margin: 10px 0 10px 10px;
}

.timeline .timeline-comment-card {
  position: relative;
  display: block;
  padding: 12px 15px;
  background-color: #ffffff;
  border: 1px solid #e0e0e0;
  border-radius: 6px;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05);
  transition: all 0.2s ease-in-out;
}

.timeline .timeline-comment-card:hover {
  border-color: var(--primary-blue);
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
  transform: translateY(-2px);
}

.timeline .timeline-comment-list--level-1,
.timeline .timeline-comment-list--level-2,
.timeline .timeline-comment-list--level-3,
.timeline .timeline-comment-list--level-4,
.timeline .timeline-comment-list--level-5 {
  margin-left: 5px;
  padding-left: 0;
}

/*.timeline .timeline-comment-list--level-1 > .timeline-comment-item::before,*/
/*.timeline .timeline-comment-list--level-2 > .timeline-comment-item::before,*/
/*.timeline .timeline-comment-list--level-3 > .timeline-comment-item::before,*/
/*.timeline .timeline-comment-list--level-4 > .timeline-comment-item::before,*/
/*.timeline .timeline-comment-list--level-5 > .timeline-comment-item::before {*/
/*  content: "";*/
/*  position: absolute;*/
/*  top: 22px;*/
/*  left: -22px;*/
/*  width: 16px;*/
/*  border-top: 2px solid #dbe6ef;*/
/*}*/

.timeline .timeline-comment-list--level-1 > .timeline-comment-item > .timeline-comment-card,
.timeline .timeline-comment-list--level-2 > .timeline-comment-item > .timeline-comment-card,
.timeline .timeline-comment-list--level-3 > .timeline-comment-item > .timeline-comment-card,
.timeline .timeline-comment-list--level-4 > .timeline-comment-item > .timeline-comment-card,
.timeline .timeline-comment-list--level-5 > .timeline-comment-item > .timeline-comment-card {
  margin-top: 2px;
}


.timeline-comment-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}


.timeline-comment-author {
  font-weight: 600;
  font-size: 14px;
  color: var(--dark-gray-text);
}


.timeline-comment-meta {
  font-size: 12px;
  color: var(--light-gray-text);
  font-style: italic;
}


.timeline-comment-body {
  font-size: 14px;
  line-height: 1.5;
  color: #343a40;
  margin: 0;
  padding: 0;
}

/* Container spacing */
.title-section {
  list-style: none;
  padding: 0 !important;
  margin: 15px 0;
}

/* Bold "Title" label */
.title-label {
  margin-left: 5px;
  font-size: 15px !important;
  font-weight: 600;
  color: var(--dark-gray-text);
}

/* Red Asterisk */
.required-mark {
  color: #e32;
}

/* Input field with soft shadow and border */
.title-input-field {
  width: 100%;
  padding: 12px 16px;
  font-size: 15px;
  transition: all 0.2s ease-in-out;
  background: #fdfdfd;
  border: 1px solid var(--medium-gray-border) !important;
  border-radius: 8px;
  min-width: 250px;
  max-height: 220px;
}

/* Placeholder color */
.title-input-field::placeholder {
  color: #888;
}

/* Focus state */
.title-input-field:focus {
  border-color: var(--primary-blue);
  box-shadow: 0 0 0 2px rgba(55, 91, 154, 0.2);
  outline: none;
}

.title-container {
  padding: 10px 10px 0 0;
}

.comment-viewer-type {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 10px 15px 10px 25px !important;
}

.comment-viewer-type .inline-comment-icon {
  margin-right: 0;
}

.comment-viewer-type-text {
  color: rgb(144, 144, 144);
  font-size: 12px;
  font-weight: normal;
  line-height: 1.4;
}

.comment-viewer-type-label {
  display: inline-block;
  padding: 3px 8px;
  color: var(--primary-blue);
  background-color: #eef2f9;
  border: 1px solid #b9c7e0;
  border-radius: 4px;
  font-size: 14px;
  font-weight: bold;
  line-height: 1.5;
}

.comment-viewer-title {
  border-top: none !important;
  border-bottom: none;
  padding: 10px 15px 5px 25px !important;
}

.comment-viewer-title p {
  font-weight: 600;
  color: var(--dark-gray-text);
}

/* CKEditor List Styling - Make bullets and numbers visible */
.ck-content ul,
.ck-content ol,
.comment-body ul,
.comment-body ol,
.timeline-comment-body ul,
.timeline-comment-body ol,
.annotator-viewer ul,
.annotator-viewer ol {
  padding-left: 40px !important;
  margin: 10px 0 !important;
}

.ck-content ul li,
.comment-body ul li,
.timeline-comment-body ul li,
.annotator-viewer ul li {
  display: list-item !important;
  list-style-type: disc !important;
  list-style-position: outside !important;
  margin-left: 0 !important;
}

.ck-content ol li,
.comment-body ol li,
.timeline-comment-body ol li,
.annotator-viewer ol li {
  display: list-item !important;
  list-style-type: decimal !important;
  list-style-position: outside !important;
  margin-left: 0 !important;
}

/* Nested lists */
.ck-content ul ul li,
.comment-body ul ul li,
.timeline-comment-body ul ul li,
.annotator-viewer ul ul li {
  list-style-type: circle !important;
}

.ck-content ul ul ul li,
.comment-body ul ul ul li,
.timeline-comment-body ul ul ul li,
.annotator-viewer ul ul ul li {
  list-style-type: square !important;
}

/* Link styling for CKEditor content */
.ck-content a,
.comment-body a,
.timeline-comment-body a,
.annotator-viewer a {
  color: var(--primary-blue) !important;
  text-decoration: underline !important;
  cursor: pointer !important;
}

.ck-content a:hover,
.comment-body a:hover,
.timeline-comment-body a:hover,
.annotator-viewer a:hover {
  color: var(--primary-blue-dark) !important;
  text-decoration: underline !important;
}

/* CKEditor Link Balloon/Bubble Styling */
.ck.ck-balloon-panel {
  z-index: 10000 !important;
}

.ck.ck-link-actions,
.ck.ck-link-form {
  padding: 12px !important;
  min-width: 320px !important;
}

.ck.ck-link-actions .ck-button,
.ck.ck-link-form .ck-button {
  min-width: auto !important;
  padding: 10px 18px !important;
  margin: 0 6px !important;
  white-space: nowrap !important;
}

.ck.ck-link-form {
  width: auto !important;
  min-width: 350px !important;
}

/* Link element in editor - simple blue italic underlined text */
.ck-content a,
.ck-editor__editable a {
  background: transparent !important;
  padding: 0 !important;
  border-radius: 0 !important;
  color: var(--primary-blue) !important;
  text-decoration: underline !important;
  border: none !important;
  font-style: italic !important;
  position: relative !important;
  font-size: 16px !important;
}

.ck-content a:hover,
.ck-editor__editable a:hover {
  background: transparent !important;
  color: var(--primary-blue-dark) !important;
}

/* Remove the X button from links */
.ck-content a::after,
.ck-editor__editable a::after,
.ck-content a .ck-link_selected,
.ck-editor__editable a .ck-link_selected {
  display: none !important;
  content: none !important;
}

/* Remove highlight/selection styling from links */
.ck-content a.ck-link_selected,
.ck-editor__editable a.ck-link_selected {
  background: transparent !important;
  outline: none !important;
  box-shadow: none !important;
}

/* Link actions styling */
.ck.ck-link-actions .ck-link-actions__preview {
  color: var(--primary-blue) !important;
  max-width: 300px !important;
  overflow: hidden !important;
  text-overflow: ellipsis !important;
  padding: 8px 12px !important;
}

.ck.ck-link-form .ck-labeled-field-view {
  width: 100% !important;
  margin-bottom: 10px !important;
}

.ck.ck-link-form .ck-input {
  min-width: 280px !important;
  width: 100% !important;
}

.ck .ck-button .ck-button-action {
  min-width: auto !important;
}

/* Ensure bold and italic display properly in CKEditor content */
.ck-content strong,
.ck-content b,
.ck-editor__editable strong,
.ck-editor__editable b,
.comment-body strong,
.comment-body b,
textarea.comment-input strong,
textarea.comment-input b {
  font-weight: bold !important;
}

/* Blockquote styling for CKEditor content */
.ck-content blockquote,
.comment-body blockquote,
.timeline-comment-body blockquote,
.annotator-viewer blockquote,
.comment-wrapper blockquote,
.comment-viewer-body blockquote {
  border-left: 4px solid var(--primary-blue);
  padding: 10px 15px;
  background-color: #f8f9fa;
  margin: 10px 0;
  font-style: italic;
  color: var(--dark-gray-text);
  border-radius: 0 4px 4px 0;
}

/* Comment Notification Modal */
.comment-notification-modal {
  display: none;
  position: fixed;
  z-index: 2147483647 !important;
  /* Max int z-index */
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.4);
  /* Black w/ opacity */
  justify-content: center;
  align-items: center;
}

.comment-notification-modal.active {
  display: flex !important;
}

.comment-notification-content {
  height: 304px;
  border-top: 10px solid var(--primary-blue) !important;
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  width: 80%;
  max-width: 730px;
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
  position: relative;
  text-align: center;
}

.comment-notification-close {
  color: #aaa;
  position: absolute;
  top: 10px;
  right: 15px;
  font-size: 28px;
  font-weight: bold;
  cursor: pointer;
  line-height: 1;
}

.comment-notification-close:hover,
.comment-notification-close:focus {
  color: black;
  text-decoration: none;
  cursor: pointer;
}

.comment-notification-message {
  text-align: left;
  margin: 45px;
}

.comment-notification-message p {
  font-size:18px;
}

.comment-notification-message h5 {
  font-size: 22px;
}
.comment-notification-message.success {
  color: var(--dark-gray-text);
}

.comment-notification-message.error {
  color: var(--dark-gray-text);
}

.message-headline {
  font-weight: 700;
}

.timeline-comment-item--level-1::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
  width: 2px;
  height: 60%;
  background: var(--blue);
}

.timeline-comment-item--level-1 {
  margin: 0 0 0 10px !important;
}

.comment-reply-item--level-1 {
  position: relative;
  margin-left: 10px !important;
}

.comment-reply-item--level-1::before {
  content: "";
  position: absolute;
  left: -10px;
  top: 50%;
  transform: translateY(-50%);
  width: 2px;
  height: 60%;
  background: var(--blue);
}

.timeline-comment-replies{
  margin-left: 15px;
}

.login-msg-wrapper {
  display: grid;
  grid-template-columns: 28px minmax(0, 1fr) auto;
  align-items: center;
  gap: 12px;
  margin: 14px 0 24px;
  padding: 15px 10px;
  color: #000;
  background: #FFFFFF;
  border: 1px solid #e8e8e8;
  border-radius: 8px;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  box-sizing: border-box;
}

.login-msg-wrapper .login-msg-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  color: #262a2e;
  background: #e7e7e7;
  border-radius: 50%;
}

.login-msg-wrapper .login-msg-icon::before {
  content: "\f075";
  font-family: "Font Awesome 6 Free";
  font-size: 13px;
  font-weight: 400;
  line-height: 1;
}

.login-msg-wrapper .login-msg {
  min-width: 0;
  margin: 0;
  color: #000;
  font-size: 14px;
  font-weight: 400;
  line-height: 1.25;
}

.login-msg-wrapper .login-msg-link {
  font-style: normal !important;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 27px;
  padding: 9px 12px;
  color: #fff !important;
  background: var(--primary-blue);
  border-radius: 6px;
  font-size: 14px;
  font-weight: 600;
  line-height: 1;
  text-decoration: none !important;
  white-space: nowrap;
}

.login-msg-wrapper .login-msg-link:hover,
.login-msg-wrapper .login-msg-link:focus {
  color: #fff !important;
  background: var(--primary-blue-dark);
  text-decoration: none !important;
}

.login-msg-wrapper .login-msg-link:focus-visible {
  outline: 2px solid #375b9a;
  outline-offset: 2px;
}

.comment-body-preview {
  padding-left: 0 !important;
}