/* Materialien-Fenster (Kursseite) */
.mm-fab {
  position: fixed; top: 68px; right: 16px; z-index: 19;
  display: inline-flex; align-items: center; gap: 6px;
  padding: 7px 12px; border-radius: 999px;
  background: #0f1f3a; color: #fff; border: 1px solid rgba(255, 255, 255, .25);
  font: 600 14px/1.2 "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  box-shadow: 0 4px 14px rgba(15, 31, 58, .25); cursor: pointer;
}
.mm-fab:hover { background: #17346b; }
.mm-fab:focus-visible, .mm-root :focus-visible { outline: 3px solid #f4b43c; outline-offset: 2px; }
.mm-fab svg { width: 16px; height: 16px; }

.mm-root {
  position: fixed; inset: 0; z-index: 2147483002;
  display: flex; align-items: center; justify-content: center; padding: 16px;
  background: rgba(10, 20, 40, .55);
  font-family: "Inter", system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
  color: #0f1f3a; animation: mm-fade .18s ease-out;
}
.mm-root[hidden] { display: none; }
html.mm-offen { overflow: hidden; }

.mm-card {
  width: 100%; max-width: 560px; max-height: calc(100vh - 32px); max-height: calc(100dvh - 32px);
  display: flex; flex-direction: column; overflow: hidden;
  background: #fff; border-radius: 16px;
  box-shadow: 0 24px 60px rgba(10, 20, 40, .35), 0 2px 6px rgba(10, 20, 40, .15);
  animation: mm-pop .2s ease-out;
}
.mm-head { position: relative; background: #0f1f3a; color: #fff; padding: 20px 56px 18px 22px; }
.mm-head h2 { margin: 0; font: 600 24px/1.2 "Fraunces", Georgia, serif; color: #fff; letter-spacing: -.01em; }
.mm-head p { margin: 6px 0 0; font-size: 14px; color: #cfdcf3; line-height: 1.4; }
.mm-close {
  position: absolute; top: 12px; right: 12px; width: 40px; height: 40px;
  display: grid; place-items: center; border: 0; border-radius: 10px;
  background: rgba(255, 255, 255, .12); color: #fff; cursor: pointer; font-size: 22px; line-height: 1;
}
.mm-close:hover { background: rgba(255, 255, 255, .22); }

.mm-body { flex: 1; overflow-y: auto; padding: 20px 22px 8px; -webkit-overflow-scrolling: touch; }
.mm-main {
  display: flex; align-items: center; justify-content: center; gap: 10px; width: 100%;
  padding: 16px 18px; border-radius: 12px; box-sizing: border-box;
  background: #f4b43c; color: #1b1300; text-decoration: none; text-align: center;
  font-weight: 700; font-size: 17px; line-height: 1.25;
  box-shadow: 0 2px 0 #c98d1c;
}
.mm-main:hover { background: #ffc65a; color: #1b1300; }
.mm-main svg { width: 22px; height: 22px; flex: none; }
.mm-alt { margin: 8px 0 0; text-align: center; font-size: 14px; color: #5b6780; }
.mm-alt a { color: #17489f; font-weight: 600; }

.mm-sec { margin: 22px 0 6px; font-size: 13px; font-weight: 700; letter-spacing: .05em; text-transform: uppercase; color: #33415c; }
.mm-list { list-style: none; margin: 0; padding: 0; }
.mm-list li + li { margin-top: 6px; }
.mm-item {
  display: flex; align-items: center; gap: 12px; padding: 10px 12px;
  border: 1px solid #d9e1ee; border-radius: 12px; background: #fff;
  color: #0f1f3a; text-decoration: none; transition: background .2s;
}
.mm-item:hover { background: #f0f5fd; color: #0f1f3a; }
.mm-item.mm-neu { animation: mm-neu 3s ease-out; }
.mm-ico {
  flex: none; width: 44px; height: 44px; border-radius: 10px;
  display: grid; place-items: center; font-size: 11px; font-weight: 800; letter-spacing: .03em;
  background: #e7f0fd; color: #17489f;
}
.mm-ico.t-pdf { background: #fde8e6; color: #c0352b; }
.mm-ico.t-bild { background: #e3f5ec; color: #1d8a55; }
.mm-ico.t-office { background: #fff1dc; color: #a65a00; }
.mm-ico.t-zip { background: #e9edf5; color: #33415c; }
.mm-txt { min-width: 0; flex: 1; }
.mm-titel { display: block; font-weight: 600; font-size: 15px; line-height: 1.3; overflow-wrap: anywhere; }
.mm-info { display: block; font-size: 13px; color: #5b6780; margin-top: 2px; }
.mm-dl { flex: none; width: 20px; height: 20px; color: #1f5fd1; }
.mm-leer, .mm-fehler { margin: 0; padding: 14px; border: 1px dashed #d9e1ee; border-radius: 12px; font-size: 14px; color: #5b6780; text-align: center; }
.mm-fehler { border-style: solid; color: #33415c; }

.mm-foot { display: flex; flex-wrap: wrap; gap: 8px 18px; padding: 14px 22px 18px; border-top: 1px solid #d9e1ee; font-size: 14px; }
.mm-foot a { color: #17489f; font-weight: 600; text-decoration: none; }
.mm-foot a:hover { text-decoration: underline; }

@keyframes mm-fade { from { opacity: 0; } }
@keyframes mm-pop { from { transform: translateY(10px) scale(.98); opacity: 0; } }
@keyframes mm-up { from { transform: translateY(100%); } }
@keyframes mm-neu { 0%, 40% { background: #fff4dc; border-color: #f4b43c; } }

@media (max-width: 640px) {
  .mm-fab { top: 64px; right: 12px; }
  .mm-root { padding: 0; align-items: flex-end; }
  .mm-card {
    max-width: none; height: 100%; max-height: none; border-radius: 16px 16px 0 0;
    animation: mm-up .25s ease-out;
  }
  .mm-head { padding-top: max(18px, env(safe-area-inset-top)); }
  .mm-foot { padding-bottom: max(18px, env(safe-area-inset-bottom)); }
}
@media (prefers-reduced-motion: reduce) {
  .mm-root, .mm-card, .mm-item.mm-neu { animation: none; }
}
@media print {
  .mm-fab, .mm-root { display: none !important; }
}