/* Meridian-Companion (Wave 3) — Ergänzungen zur asst-Basis aus design-system.css.
   Eigene Klassen sind mer-* (kollisionsfrei); Farben über Design-Tokens. */

/* Kopfzeilen-Buttons sitzen rechts */
#asst .asst-head { gap: 6px; }
#asst .asst-head .asst-id { flex: 1 1 auto; min-width: 0; }

/* Toolcall-Detailkarten */
.mer-tools { display: flex; flex-direction: column; gap: 6px; margin-top: 10px; }
.mer-tool {
  border: 1px solid var(--border-2, rgba(255,255,255,.08));
  border-radius: 10px;
  background: var(--surface-2, rgba(255,255,255,.03));
  font-size: 12px;
  overflow: hidden;
}
.mer-tool summary {
  display: flex; align-items: center; gap: 8px;
  padding: 7px 10px; cursor: pointer; list-style: none; user-select: none;
}
.mer-tool summary::-webkit-details-marker { display: none; }
.mer-tool-name { font-weight: 600; color: var(--text, #e7e2d6); flex: 1 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mer-tool-state { color: var(--mist, #98a2ad); font-size: 11px; }
.mer-tool-dot { width: 8px; height: 8px; border-radius: 50%; flex: 0 0 auto; }
.mer-tool-dot.run { background: var(--gold, #C9A24B); animation: merPulse 1.1s ease-in-out infinite; }
.mer-tool-dot.ok { background: #30d158; }
.mer-tool-dot.err { background: var(--red, #e5484d); }
@keyframes merPulse { 0%,100% { opacity: .35; } 50% { opacity: 1; } }
.mer-tool-body { padding: 0 10px 10px; }
.mer-tool-sec { font-size: 10px; text-transform: uppercase; letter-spacing: .08em; color: var(--mist-dim, #6c757f); margin: 8px 0 4px; }
.mer-tool-body pre {
  margin: 0; padding: 8px; border-radius: 8px;
  background: var(--bg, #0E141B); color: var(--mist, #b9c2cb);
  font-size: 11px; line-height: 1.45; white-space: pre-wrap; word-break: break-word;
  max-height: 180px; overflow: auto;
}

/* Quellen-Links unter einer Antwort */
.mer-refs { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin-top: 10px; }
.mer-refs-lbl { font-size: 11px; color: var(--mist-dim, #6c757f); }
.mer-ref {
  border: 1px solid var(--border-2, rgba(255,255,255,.1)); background: transparent;
  color: var(--gold-soft, #d9b86b); border-radius: 999px; padding: 3px 10px;
  font-size: 11.5px; cursor: pointer;
}
.mer-ref:hover { background: var(--surface-2, rgba(255,255,255,.05)); }

/* Einstellungs-Menü + Historie */
.mer-menu {
  position: absolute; top: 52px; right: 10px; z-index: 40;
  background: var(--surface, #161F2A); border: 1px solid var(--border-2, rgba(255,255,255,.1));
  border-radius: 12px; padding: 10px; box-shadow: var(--shadow, 0 12px 32px rgba(0,0,0,.4));
  width: 240px;
}
.mer-menu-item {
  width: 100%; display: flex; justify-content: space-between; align-items: center;
  background: transparent; border: 1px solid transparent; border-radius: 8px;
  color: var(--text, #e7e2d6); padding: 8px 10px; cursor: pointer; font-size: 12.5px;
}
.mer-menu-item:hover { background: var(--surface-2, rgba(255,255,255,.05)); }
.mer-onoff { width: 30px; height: 16px; border-radius: 999px; background: var(--border-2, #333); position: relative; transition: background .15s; }
.mer-onoff::after { content: ""; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: var(--mist, #98a2ad); transition: left .15s, background .15s; }
.mer-menu-item.on .mer-onoff { background: var(--gold, #C9A24B); }
.mer-menu-item.on .mer-onoff::after { left: 16px; background: var(--on-gold, #14110a); }
.mer-menu-hint { font-size: 11px; color: var(--mist-dim, #6c757f); margin-top: 8px; line-height: 1.4; }

.mer-history {
  position: absolute; top: 52px; right: 10px; left: 10px; bottom: 64px; z-index: 39;
  background: var(--surface, #161F2A); border: 1px solid var(--border-2, rgba(255,255,255,.1));
  border-radius: 12px; display: flex; flex-direction: column; overflow: hidden;
  box-shadow: var(--shadow, 0 12px 32px rgba(0,0,0,.4));
}
.mer-history-head { display: flex; justify-content: space-between; align-items: center; padding: 10px 12px; border-bottom: 1px solid var(--border-2, rgba(255,255,255,.08)); font-size: 12.5px; font-weight: 600; }
.mer-history-list { overflow: auto; padding: 6px; }
.mer-hist-item { display: flex; align-items: stretch; gap: 4px; }
.mer-hist-item.cur .mer-hist-open { border-color: var(--gold, #C9A24B); }
.mer-hist-open {
  flex: 1 1 auto; min-width: 0; text-align: left; background: transparent; cursor: pointer;
  border: 1px solid transparent; border-radius: 8px; padding: 8px 10px; color: var(--text, #e7e2d6);
}
.mer-hist-open:hover { background: var(--surface-2, rgba(255,255,255,.05)); }
.mer-hist-open .t { display: block; font-size: 12.5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.mer-hist-open .m { display: block; font-size: 11px; color: var(--mist-dim, #6c757f); margin-top: 2px; }
.mer-hist-del { background: transparent; border: none; color: var(--mist-dim, #6c757f); cursor: pointer; border-radius: 8px; padding: 0 8px; }
.mer-hist-del:hover { color: var(--red, #e5484d); }
.mer-hist-empty { padding: 14px; font-size: 12px; color: var(--mist-dim, #6c757f); }

/* Drag&Drop-Overlay */
.mer-drop { position: absolute; inset: 0; display: none; z-index: 50; background: rgba(14,20,27,.78); backdrop-filter: blur(2px); }
.mer-drop.show { display: grid; place-items: center; }
.mer-drop-inner { border: 2px dashed var(--gold, #C9A24B); color: var(--gold-soft, #d9b86b); border-radius: 14px; padding: 22px 28px; font-size: 13px; }

/* Panel braucht position:relative für Overlays */
#asst { position: relative; }

/* Composer-Buttons */
#asst .asst-input { align-items: flex-end; gap: 6px; }
#asst .asst-input .asst-ibtn { flex: 0 0 auto; }
#asst .asst-input textarea { max-height: 180px; }

/* Objektfotos (Verwaltung · Objekte) */
.ob .ph { position: relative; overflow: hidden; }
.ob .ph img.ob-foto {
  position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; border-radius: inherit; z-index: 0;
}
.ob .ph .dot { z-index: 2; }
.detail .hero.has-foto { background-size: cover !important; background-position: center !important; position: relative; }
.detail .hero.has-foto::before {
  content: ""; position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(14,20,27,.30), rgba(14,20,27,.80));
  border-radius: inherit; z-index: 0;
}
.detail .hero.has-foto .inner, .detail .hero.has-foto .acts { position: relative; z-index: 1; }

/* CRM: durchsuchbares Objekt-Dropdown (Combobox) */
.mer-combo { position: relative; }
.mer-combo-list {
  position: absolute; top: 100%; left: 0; right: 0; z-index: 30; margin-top: 4px;
  background: var(--surface, #161F2A); border: 1px solid var(--border-2, rgba(255,255,255,.12));
  border-radius: 10px; max-height: 240px; overflow: auto; box-shadow: var(--shadow, 0 12px 32px rgba(0,0,0,.4));
}
.mer-combo-list[hidden] { display: none; }
.mer-combo-opt {
  display: block; width: 100%; text-align: left; padding: 8px 10px; font-size: 12.5px;
  background: transparent; border: none; color: var(--text, #e7e2d6); cursor: pointer;
}
.mer-combo-opt:hover, .mer-combo-opt.hl { background: var(--surface-2, rgba(255,255,255,.06)); }
.mer-combo-opt .sub { display: block; font-size: 11px; color: var(--mist-dim, #6c757f); }
.mer-combo-empty { padding: 10px; font-size: 12px; color: var(--mist-dim, #6c757f); }