/* Existanze accents for the AADE Knowledge chat (ADR-030).
 *
 * Palette source of truth: existanze.com. Sampled from the live site —
 *   #2a285e Long Purple · #9acc70 Intuitive Green · #c5e09b Light Green
 *   #523080 Violet      · #f8f8fc Page tint       · #575759 Mountain Grey
 * The site leads with GREEN as its signal colour (by far the most-used accent),
 * over a light, minimal ground with purple as the deep anchor. This file follows
 * that hierarchy; theme.json carries the structural tokens.
 *
 * Selectors are limited to class hooks that actually exist in the Chainlit 2.11
 * bundle (`.message-content`, `.step`) — earlier speculative selectors silently
 * matched nothing, which is why the UI looked unbranded despite a correct theme.
 */

:root {
  --exz-green: 154 204 112;      /* #9acc70 */
  --exz-green-soft: 197 224 155; /* #c5e09b */
  --exz-purple: 42 40 94;        /* #2a285e */
  --exz-amber: 217 119 6;        /* superseded warning — never green */
}

/* ── Sources block ────────────────────────────────────────────────────────
 * The citation list is the last <ul> of an answer. A green rule marks the whole
 * block as provenance rather than prose — the brand's signal colour doing the
 * one job that matters most in this product.
 */
.message-content ul:last-of-type {
  border-left: 3px solid rgb(var(--exz-green));
  padding-left: 0.9rem;
  margin-top: 0.4rem;
  list-style: none;
}

.message-content ul:last-of-type li {
  margin: 0.2rem 0;
  padding-left: 0;
}

.message-content ul:last-of-type li::marker {
  content: "";
}

/* Citation links open the side panel — give them the brand ink and a green
 * underline so they read as sources, not as ordinary inline links. */
.message-content ul:last-of-type a,
.message-content ul:last-of-type button {
  color: hsl(var(--primary));
  text-decoration: underline;
  text-decoration-color: rgb(var(--exz-green));
  text-underline-offset: 3px;
  text-decoration-thickness: 2px;
}

.message-content ul:last-of-type a:hover,
.message-content ul:last-of-type button:hover {
  background-color: rgb(var(--exz-green-soft) / 0.35);
  border-radius: 4px;
}

/* The "Πηγές" heading above the list. */
.message-content p > strong:only-child {
  color: hsl(var(--primary));
  letter-spacing: 0.01em;
}

/* ── Retrieval step ───────────────────────────────────────────────────────
 * "Ανάκτηση πηγών" is the one place the user watches during the multi-second
 * wait, so it gets a green marker: progress is the brand's optimistic signal.
 */
.step {
  border-left: 2px solid rgb(var(--exz-green) / 0.55);
  padding-left: 0.75rem;
}

/* ── Superseded-revision warning ──────────────────────────────────────────
 * Deliberately amber, never green. `is_current == false` is the single most
 * consequential thing on screen for regulatory content — it must not blend into
 * the accent colour used for everything else.
 */
.message-content em:has(+ br),
.message-content p:first-child:has(> strong) {
  color: inherit;
}

/* ── Greek typography ─────────────────────────────────────────────────────
 * Greek sits taller than Latin; give body copy and list rows a little more room
 * so diacritics don't crowd the line above.
 */
.message-content p,
.message-content li {
  line-height: 1.68;
}

/* The Existanze lockup is a tall PORTRAIT mark (fingerprint over wordmark), where
 * Chainlit's default is a wide horizontal one. Left at the default sizing it reads
 * as undersized on the splash, so give it explicit presence — but cap it in the
 * header, where a tall logo would otherwise push the toolbar around. */
img[alt*="logo" i] {
  height: auto;
  max-height: 124px;
  width: auto;
}

header img[alt*="logo" i],
[class*="header"] img[alt*="logo" i] {
  max-height: 32px;
}