/* Meldo Zusatzmaterial – Marker in der LearnDash-Navigation */

.mzm-has-extra { position: relative; }

.mzm-nav-badge {
  display: inline-flex; align-items: center; gap: 5px;
  vertical-align: middle; margin-left: 8px;
  opacity: .92; line-height: 0;
}

/* Immer absolut, links vom Abhak-Kreis (Abstand wird gemessen) */
.mzm-has-extra > .mzm-nav-badge {
  position: absolute; right: 52px; top: 50%; transform: translateY(-50%);
  margin-left: 0; pointer-events: auto; z-index: 2;
}

.mzm-nav-ico {
  display: inline-flex; width: 17px; height: 17px;
  border-radius: 6px; align-items: center; justify-content: center;
}
.mzm-nav-ico svg { width: 100%; height: 100%; display: block; }
.mzm-nav-ico[data-t="pdf"] svg { transform: scale(1.12); }
.mzm-nav-ico[data-t="pdf"]   { color: #3D7C85; }
.mzm-nav-ico[data-t="audio"] { color: #E77D20; }
.mzm-nav-ico[data-t="video"] { color: #3D7C85; }
.mzm-nav-ico/* Mixer in Bernstein – hebt sich von Noten (Petrol) und Audio (Grün) ab,
   ohne aus der Meldo-Palette zu fallen. */
[data-t="mixer"] { color: #D08A1E; }
[data-t="other"] { color: #9aa0a6; }
.mzm-nav-ico[data-t="lock"]  { color: #b6bbc0; }

.mzm-nav-badge.is-locked { opacity: .75; }
.mzm-nav-badge.is-link { cursor: pointer; }
.mzm-nav-badge.is-link:hover .mzm-nav-ico { color: #E8924F; }

/* Dezenter Farbanstrich der Zeile, damit man Songs mit Material scannen kann */
.ld-table-list-item.mzm-has-extra::before,
.ld-topic-row.mzm-has-extra::before {
  content: ''; position: absolute; left: 0; top: 8px; bottom: 8px; width: 3px;
  border-radius: 0 3px 3px 0; background: linear-gradient(180deg, #E8924F, #3D7C85);
  opacity: .55;
}

/* Filter «Nur mit Zusatzmaterial» – erstes Element in der Themenliste */
.mzm-nav-filter {
  display: block !important; visibility: visible !important; opacity: 1 !important;
  width: auto !important; height: auto !important;
  margin: 0 !important; padding: 12px 16px !important;
  background: none !important; border: none !important; box-shadow: none !important;
  border-bottom: 1px solid rgba(17,20,22,.06) !important;
  text-align: left; list-style: none;
}
/* Immer im Fluss – keine schwebende Variante mehr */
.mzm-nav-filter { position: static !important; }
.mzm-nav-filter .mzm-nav-fbtn,
.mzm-nav-filter .mzm-nav-fbtn:hover,
.mzm-nav-filter .mzm-nav-fbtn:focus,
.mzm-nav-filter .mzm-nav-fbtn:active {
  appearance: none !important; -webkit-appearance: none !important;
  display: inline-flex !important; align-items: center; gap: 9px;
   
  border: 1.5px solid rgba(61,124,133,.25) !important;
  border-radius: 999px !important; padding: 10px 18px 10px 14px !important;
  margin: 0 !important; min-height: 0 !important; width: auto !important; height: auto !important;
  box-shadow: 0 2px 10px rgba(17,20,22,.07) !important; text-shadow: none !important;
  font-family: 'Akko', sans-serif !important; font-weight: 600 !important;
  font-size: .88rem !important; line-height: 1.2 !important; letter-spacing: normal !important;
  text-transform: none !important; color: #4a5054 !important; cursor: pointer;
  transition: all .22s ease;
}
.mzm-nav-filter .mzm-nav-fbtn:hover {
  border-color: #3D7C85 !important; color: #3D7C85 !important;
  transform: translateY(-2px); box-shadow: 0 10px 28px rgba(61,124,133,.22) !important;
}
.mzm-nav-filter.is-on .mzm-nav-fbtn {
  
  border-color: transparent !important; color: #fff !important;
}
.mzm-nav-fico { display: inline-flex; width: 18px; height: 18px; flex: 0 0 auto; }
.mzm-nav-fico svg { width: 100%; height: 100%; }
.mzm-nav-filter.is-on .mzm-nav-fico { color: #fff; }
.mzm-nav-count {
  font-style: normal; font-size: .74rem; font-weight: 700;
  background: rgba(232,146,79,.22); color: #B96111;
  padding: 2px 9px; border-radius: 999px;
}
.mzm-nav-filter.is-on .mzm-nav-count { background: rgba(255,255,255,.25); color: #fff; }

@media (max-width: 782px) {
  .mzm-nav-filter { margin-bottom: 10px !important; }
  .mzm-nav-filter .mzm-nav-fbtn { padding: 9px 14px 9px 11px !important; font-size: .8rem !important; }

  .mzm-nav-badge { gap: 3px; }
  .mzm-nav-ico { width: 15px; height: 15px; }
}
