/* ── TX Annotations — annotations.css (v1.7.0) ────────────────────────────── */

.letter_txt, .letter_txt * { cursor: text; }
.letter_txt .txa-mark { cursor: pointer !important; }

/* ── Markierungen ── */
.txa-mark {
  color: #1a1a1a;
  border-radius: 3px;
  padding: 1px 3px;
  border-bottom: 1.5px solid;
  transition: background-color 0.15s;
  position: relative;
}
.txa-mark[data-type="kommentar"] { background-color: #d4c5a0; border-bottom-color: #7a6330; }
.txa-mark[data-type="kommentar"]:hover,
.txa-mark[data-type="kommentar"]:focus,
.txa-mark[data-type="kommentar"].txa-mark--active { background-color: #c0ae84; outline: none; }
.txa-mark[data-type="register"] { background-color: #b8d4c0; border-bottom-color: #2d6644; }
.txa-mark[data-type="register"]:hover,
.txa-mark[data-type="register"]:focus,
.txa-mark[data-type="register"].txa-mark--active { background-color: #9dc4a8; outline: none; }
.txa-sup { font-size: 0.65em; vertical-align: super; line-height: 1; font-weight: 600; margin-left: 1px; color: #5a4520; }

/* ── Toggle ── */
#txa-toggle-wrap {
  display: flex;
  justify-content: flex-end;
  padding: 0 0 8px;
}
.txa-toggle {
  display: flex;
  align-items: center;
  gap: 7px;
  cursor: pointer;
  user-select: none;
}
.txa-toggle input[type="checkbox"] { display: none; }
.txa-toggle-track {
  width: 34px; height: 18px; border-radius: 9px;
  background: #c8c7c0; position: relative; transition: background 0.2s; flex-shrink: 0;
}
.txa-toggle-track::after {
  content: ''; position: absolute; top: 2px; left: 2px;
  width: 14px; height: 14px; border-radius: 50%;
  background: #fff; transition: transform 0.2s; box-shadow: 0 1px 3px rgba(0,0,0,.2);
}
.txa-toggle input:checked ~ .txa-toggle-track { background: #1a1a1a; }
.txa-toggle input:checked ~ .txa-toggle-track::after { transform: translateX(16px); }
.txa-toggle-label { font-size: 12px; color: #555; }

/* ── Format-Editor (geteilt zwischen Toolbar und Popup) ── */
.txa-editor-wrap {
  display: flex;
  flex-direction: column;
  border: 0.5px solid #c8c7c0;
  border-radius: 6px;
  overflow: hidden;
  background: #fff;
}
.txa-fmt-bar {
  display: flex;
  gap: 2px;
  padding: 4px 6px;
  border-bottom: 0.5px solid #e0dfd8;
  background: #f8f7f4;
}
.txa-fmt-bar button {
  font-size: 12px;
  padding: 2px 7px;
  border: 0.5px solid #c8c7c0;
  border-radius: 4px;
  background: #fff;
  cursor: pointer;
  line-height: 1.4;
  color: #333;
}
.txa-fmt-bar button:hover { background: #ece9e3; }
.txa-editor {
  padding: 6px 8px;
  font-size: 12px;
  line-height: 1.6;
  min-height: 60px;
  outline: none;
  font-family: inherit;
  color: #333;
}
.txa-editor:empty::before {
  content: attr(data-placeholder);
  color: #aaa;
  pointer-events: none;
}
.txa-editor a { color: #378add; text-decoration: underline; }

/* ── Toolbar ── */
#txa-toolbar {
  display: none;
  position: absolute;
  z-index: 9999;
  flex-direction: column;
  gap: 8px;
  background: #fff;
  border: 0.5px solid #c8c7c0;
  border-radius: 10px;
  padding: 10px 12px;
  box-shadow: 0 4px 16px rgba(0,0,0,.12);
  width: 300px;
}
#txa-toolbar.txa-toolbar--visible { display: flex; }
#txa-toolbar-types { display: flex; gap: 6px; }
.txa-type-btn {
  flex: 1; font-size: 12px; padding: 4px 8px; border-radius: 6px;
  border: 0.5px solid #c8c7c0; background: #fff; cursor: pointer; color: #444;
}
.txa-type-btn--active { background: #1a1a1a; color: #fff; border-color: #1a1a1a; }
#txa-toolbar-actions { display: flex; justify-content: space-between; gap: 6px; }
#txa-toolbar-cancel {
  font-size: 11px; padding: 4px 10px; border-radius: 6px;
  border: 0.5px solid #c8c7c0; background: #fff; cursor: pointer; color: #666;
}
#txa-toolbar-cancel:hover { background: #f1efe8; }
#txa-toolbar-submit {
  font-size: 11px; padding: 4px 10px; border-radius: 6px;
  border: none; background: #1a1a1a; color: #fff; cursor: pointer;
}
#txa-toolbar-submit:hover { opacity: 0.85; }
#txa-toolbar-submit:disabled { opacity: 0.5; cursor: not-allowed; }

/* ── Popup ── */
#txa-popup {
  display: none; position: absolute; z-index: 9998; width: 290px;
  background: #fff; border: 0.5px solid #c8c7c0; border-radius: 10px;
  box-shadow: 0 4px 20px rgba(0,0,0,.13), 0 1px 4px rgba(0,0,0,.06);
}
#txa-popup.txa-popup--visible { display: block; }
#txa-popup::before {
  content: ''; position: absolute; top: -7px; left: 18px;
  width: 12px; height: 12px; background: #f8f7f4;
  border-left: 0.5px solid #c8c7c0; border-top: 0.5px solid #c8c7c0;
  transform: rotate(45deg); border-radius: 2px 0 0 0;
}
#txa-popup.txa-popup--flip::before { top: auto; bottom: -7px; transform: rotate(225deg); }
#txa-popup[data-type="kommentar"] { border-left: 3px solid #7a6330; }
#txa-popup[data-type="register"]  { border-left: 3px solid #2d6644; }

#txa-popup-head {
  display: flex; align-items: center; justify-content: space-between;
  padding: 8px 12px; border-bottom: 0.5px solid #e0dfd8;
  background: #f8f7f4; border-radius: 10px 10px 0 0; gap: 6px;
}
#txa-popup-title { font-size: 12px; font-weight: 500; flex: 1; }
#txa-popup-head-actions { display: flex; align-items: center; gap: 4px; }
#txa-btn-delete-ann {
  font-size: 11px; padding: 3px 7px; border-radius: 5px;
  border: 0.5px solid #e0c0c0; background: #fff; color: #a32d2d; cursor: pointer;
}
#txa-btn-delete-ann:hover { background: #fdf0f0; }
#txa-btn-edit-ann {
  font-size: 11px; padding: 3px 7px; border-radius: 5px;
  border: 0.5px solid #c8c7c0; background: #fff; color: #444; cursor: pointer;
}
#txa-btn-edit-ann:hover { background: #f1efe8; }
#txa-popup-close {
  background: none; border: none; cursor: pointer;
  color: #888; font-size: 14px; padding: 2px 4px; line-height: 1; border-radius: 4px;
}
#txa-popup-close:hover { color: #333; }

#txa-popup-body { padding: 10px 12px; }
.txa-comment-text { margin: 0; font-size: 13px; line-height: 1.6; color: #333; }
.txa-comment-text a { color: #378add; text-decoration: underline; }
.txa-comment-text strong, .txa-comment-text b { font-weight: 600; }
.txa-comment-text em, .txa-comment-text i { font-style: italic; }
.txa-empty, .txa-loading { margin: 0; font-size: 12px; color: #999; }

/* Edit-Bereich im Popup */
#txa-popup-edit {
  display: none; flex-direction: column; gap: 8px;
  padding: 10px 12px; border-top: 0.5px solid #e0dfd8;
}
#txa-popup-edit.txa-edit--visible { display: flex; }
#txa-edit-actions { display: flex; justify-content: space-between; gap: 6px; }
#txa-edit-cancel {
  font-size: 11px; padding: 4px 8px; border-radius: 6px;
  border: 0.5px solid #c8c7c0; background: #fff; color: #666; cursor: pointer;
}
#txa-edit-cancel:hover { background: #f1efe8; }
#txa-edit-save {
  font-size: 11px; padding: 4px 10px; border-radius: 6px;
  border: none; background: #1a1a1a; color: #fff; cursor: pointer;
}
#txa-edit-save:hover { opacity: 0.85; }
#txa-edit-save:disabled { opacity: 0.5; cursor: not-allowed; }

@media (max-width: 600px) {
  #txa-popup, #txa-toolbar { width: calc(100vw - 24px); }
}

/* ── Fußnotenliste [tx_fussnoten] ── */

.txa-fussnoten {
  list-style: none;
  margin: 0;
  padding: 0;
  font-size: 13px;
  line-height: 1.7;
  color: #333;
}

.txa-fussnoten li {
  display: flex;
  gap: 8px;
  padding: 4px 0;
  border-bottom: 0.5px solid #eeeee8;
}

.txa-fussnoten li:last-child {
  border-bottom: none;
}

.txa-fn-num {
  font-size: 0.75em;
  vertical-align: super;
  line-height: 1;
  font-weight: 600;
  color: #5a4520;
  flex-shrink: 0;
  margin-top: 3px;
  min-width: 14px;
}

.txa-fussnoten a {
  color: #378add;
  text-decoration: underline;
}

.txa-fussnoten strong,
.txa-fussnoten b { font-weight: 600; }

.txa-fussnoten em,
.txa-fussnoten i { font-style: italic; }

/* Toggle: nur Hintergrund und Rahmen ausblenden, Text und Ziffer bleiben */
.txa-mark--hidden {
  background-color: transparent !important;
  border-bottom: none !important;
  cursor: text !important;
}
.txa-mark--hidden .txa-sup {
  /* Ziffer bleibt sichtbar */
}