/* Nexa Solar-Orakel – Chat-First customer journey */
.nexa-runtime,
.nexa-runtime-lock,
#nexaRuntimePanel,
#nexaSessionOverlay {
  display: none !important;
}

.nexa-chat-card-row {
  align-items: flex-start;
}

.nexa-chat-card {
  width: min(560px, 100%);
  padding: 14px;
  border: 1px solid var(--line, #30333d);
  border-radius: 14px;
  background: color-mix(in srgb, var(--bg-elev, #141722) 94%, transparent);
  box-shadow: 0 14px 36px rgba(0, 0, 0, .24);
}

.nexa-chat-card h4 {
  margin: 0 0 7px;
  font-size: 16px;
}

.nexa-chat-card p {
  margin: 0 0 11px;
  color: var(--muted, #9ca3af);
  font-size: 13px;
  line-height: 1.45;
}

.nexa-chat-field {
  display: flex;
  flex-direction: column;
  gap: 5px;
  margin-top: 9px;
}

.nexa-chat-field span {
  color: var(--muted, #9ca3af);
  font-size: 12px;
}

.nexa-chat-field input {
  width: 100%;
  padding: 10px 11px;
  border: 1px solid var(--line, #30333d);
  border-radius: 9px;
  background: var(--bg, #0c0f16);
  color: var(--fg, #f5f7fb);
}

.nexa-chat-check {
  display: flex;
  gap: 9px;
  align-items: flex-start;
  margin-top: 10px;
  font-size: 13px;
  line-height: 1.4;
}

.nexa-chat-check input {
  width: auto;
  margin-top: 3px;
}

.nexa-chat-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 12px;
}

.nexa-chat-actions a.btn {
  text-decoration: none;
}

.nexa-chat-notice {
  min-height: 18px;
  margin-top: 9px;
  color: var(--muted, #9ca3af);
  font-size: 12px;
}

.nexa-chat-card.is-busy {
  opacity: .76;
}

.nexa-chat-card.is-complete {
  border-color: rgba(34, 197, 94, .45);
}

.nexa-chat-card.is-complete::after {
  display: block;
  margin-top: 9px;
  color: #86efac;
  font-size: 12px;
  content: "Schritt gespeichert";
}

.visual {
  transition: opacity .2s ease, transform .2s ease;
}

.visual:not(.nexa-visual-active) {
  opacity: .82;
}

.visual.nexa-visual-active {
  opacity: 1;
}

@media (max-width: 720px) {
  .nexa-chat-card {
    width: 100%;
  }

  .nexa-chat-actions {
    flex-direction: column;
  }

  .nexa-chat-actions .btn {
    width: 100%;
  }
}

/* ================================================================
   TASK 11 – eindeutige Rollenanzeige und vollständig deckende Karte
   ================================================================ */

.msg.user,
.msg-user {
  justify-content: flex-end;
}

.msg.assistant,
.msg-assistant {
  justify-content: flex-start;
}

.msg.user .bubble,
.msg-user .bubble {
  width: fit-content;
  max-width: min(84%, 760px);
  margin-left: auto;
  border-color: rgba(74, 126, 255, .58);
  border-bottom-right-radius: 4px;
  background:
    linear-gradient(
      145deg,
      rgba(35, 66, 143, .96),
      rgba(21, 36, 78, .98)
    );
  color: #f7f9ff;
  box-shadow:
    0 10px 28px rgba(8, 20, 52, .30),
    inset 0 1px 0 rgba(255, 255, 255, .08);
}

.msg.assistant .bubble,
.msg-assistant .bubble {
  width: fit-content;
  max-width: min(84%, 760px);
  margin-right: auto;
  border-color: rgba(61, 220, 151, .46);
  border-bottom-left-radius: 4px;
  background:
    linear-gradient(
      145deg,
      rgba(18, 44, 39, .98),
      rgba(13, 28, 31, .98)
    );
  color: #f5fff9;
  box-shadow:
    0 10px 28px rgba(4, 28, 22, .28),
    inset 0 1px 0 rgba(255, 255, 255, .07);
}

.nexa-message-role {
  display: block;
  margin-bottom: 5px;
  font-size: 11px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .09em;
  text-transform: uppercase;
}

.msg.user .nexa-message-role,
.msg-user .nexa-message-role {
  color: #b9cbff;
  text-align: right;
}

.msg.assistant .nexa-message-role,
.msg-assistant .nexa-message-role {
  color: #8cf2bd;
  text-align: left;
}

.nexa-message-text {
  display: block;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}

.nexa-chat-card-row {
  position: relative;
  justify-content: flex-start;
}

.nexa-chat-card-row::before {
  position: absolute;
  top: 7px;
  left: 14px;
  z-index: 1;
  color: #8cf2bd;
  font-size: 10px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: .09em;
  text-transform: uppercase;
  content: "Nexa";
}

.nexa-chat-card-row .nexa-chat-card {
  padding-top: 28px;
}

/* Karte bleibt immer vollständig deckend. */
.visual,
.visual:not(.nexa-visual-active),
.visual.nexa-visual-active {
  opacity: 1;
}

.visual:not(.nexa-visual-active) {
  transform: none;
  border-color: var(--line, #30333d);
}

.visual.nexa-visual-active {
  border-color: rgba(61, 220, 151, .55);
  box-shadow:
    var(--shadow),
    0 0 0 1px rgba(61, 220, 151, .12);
}

#mapsBlock,
#solar-map {
  position: relative;
  isolation: isolate;
  opacity: 1;
  background-color: #0e1118;
}

@media (max-width: 720px) {
  .msg.user .bubble,
  .msg-user .bubble,
  .msg.assistant .bubble,
  .msg-assistant .bubble {
    max-width: 92%;
  }
}