/* Zweck: Nichtmodale Termindetails für Hover, Fokus und Touch | Schicht: Content-Komponente | Ladende Seiten: Kalender-LEGO und /kalender/ */
.calendar-event-hovercard {
  position: fixed;
  z-index: 480;
  display: grid;
  width: min(440px, calc(100vw - 24px));
  max-height: calc(100vh - 24px);
  gap: 14px;
  overflow: auto;
  padding: 18px;
  border: 1px solid var(--amg-line);
  border-radius: 12px;
  background: var(--amg-paper);
  color: var(--amg-ink);
  box-shadow: 0 18px 48px rgb(17 30 42 / .24);
}

.calendar-event-hovercard[hidden] { display: none; }
.calendar-event-hovercard.is-inline {
  position: static;
  grid-column: 1 / -1;
  width: 100%;
  max-height: none;
  margin-top: 4px;
}

.calendar-event-hovercard__title { margin: 0; font-size: 1rem; line-height: 1.3; }
.calendar-event {
  display: grid;
  gap: 8px;
  padding-top: 14px;
  border-top: 1px solid var(--amg-line);
}

.calendar-event h3 { margin: 0; font-size: 1rem; line-height: 1.35; }
.calendar-event__description {
  color: var(--amg-ink);
  font-size: .84rem;
  line-height: 1.52;
  white-space: pre-line;
}

.calendar-event__livestream-stub {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 1px solid var(--amg-line);
  border-radius: 10px;
  background: var(--amg-slate-pale);
  object-fit: cover;
}

.calendar-event__link {
  width: max-content;
  max-width: 100%;
  color: var(--amg-slate);
  font-size: .88rem;
  font-weight: 850;
  line-height: 1.35;
}

.calendar-event__reminder { padding: 0; border: 0; background: transparent; cursor: pointer; text-align: left; }

.calendar-event__link-note,
.calendar-event__empty { color: var(--amg-muted); font-size: .86rem; line-height: 1.4; }

html[data-theme="dark"] .calendar-event-hovercard { background: var(--amg-paper); color: var(--amg-ink); }

@media (max-width: 760px) {
  .calendar-event-hovercard.is-inline { padding: 14px; }
}

@media (forced-colors: active) {
  .calendar-event-hovercard {
    border-color: ButtonText;
    background: Canvas;
    color: CanvasText;
  }
}

@media (prefers-reduced-motion: reduce) {
  .calendar-event-hovercard * { animation: none !important; scroll-behavior: auto !important; transition: none !important; }
}