/* Accente vizuale RIA peste tema din theme.json.
 *
 * theme.json duce culorile de baza (fundal, text, primary, border) — aici stau
 * doar lucrurile pe care variabilele nu le acopera: pasii de tool, mesajele de
 * acces refuzat, avatarul agentului.
 *
 * Sursa culorilor: ria-ecosystem/frontend/src/app/globals.css.
 *   Brand Blue  #1DA1F2  -> --primary
 *   Accent Blue #00A8FF  -> --secondary
 *   Glacier     #F0F5FA  -> --background
 */

/* Pasii de tool: coloana albastra in stanga, ca sa se distinga de raspuns.
   Fiecare apel de tool e o dovada verificabila, nu decor — merita sa se vada. */
.step,
[class*="step"] > details {
  border-left: 3px solid hsl(var(--primary) / 0.55);
  background: hsl(var(--accent));
  border-radius: var(--radius);
  padding-left: 0.75rem;
}

/* Numele tool-ului, monospace: e un identificator, nu proza. */
.step summary,
[class*="step"] summary {
  font-family: ui-monospace, SFMono-Regular, "SF Mono", Menlo, monospace;
  font-size: 0.85rem;
  color: hsl(var(--muted-foreground));
}

/* Link-urile Odoo din raspunsuri — regula 2 din prompt cere sa fie mereu
   prezente, deci merita sa fie si evidente. */
.markdown-body a,
[class*="message"] a {
  color: hsl(var(--primary));
  text-decoration-color: hsl(var(--primary) / 0.4);
  text-underline-offset: 2px;
}
.markdown-body a:hover,
[class*="message"] a:hover {
  text-decoration-color: hsl(var(--primary));
}

/* Nota „raspuns fara consultarea datelor din Odoo" (semnalul de halucinatie)
   si mesajele de drepturi: italic + accent cald, ca sa nu se confunde cu un
   raspuns normal. */
.markdown-body em:only-child {
  color: hsl(var(--destructive) / 0.85);
}

/* Logo mai aerisit in bara de sus */
header img[alt*="logo" i],
img[src*="logo"] {
  max-height: 28px;
  width: auto;
}

/* Tabelele (agregari cross-tenant) — capul de tabel lizibil pe fundal glacier */
.markdown-body table th {
  background: hsl(var(--muted));
  color: hsl(var(--foreground));
  font-weight: 600;
}
.markdown-body table td,
.markdown-body table th {
  border-color: hsl(var(--border));
}

/* Blocuri de cod: contrast suficient si in light, si in dark */
.markdown-body pre,
.markdown-body code {
  background: hsl(var(--muted));
  border-radius: calc(var(--radius) - 2px);
}

/* Firul de conversatie, mai lat. Tema strange coloana de mesaje la 768px —
   ATENTIE la cache: browserul tine fisierul asta si peste reload; de aceea
   .chainlit/config.toml il refera cu ?v=N — incrementeaza N la orice
   schimbare aici, altfel utilizatorii raman pe versiunea veche. Masurat: —
   masurat: pe un ecran de 1566px, jumatate era margine, iar panoul kanban si
   tabelele agregarilor incapeau doar cu scroll orizontal. min() tine textul
   citibil pe ecrane late fara sa lipeasca mesajele de margini pe cele mici. */
.flex.flex-col.mx-auto.w-full.flex-grow.p-4,      /* firul de mesaje */
.flex.flex-col.mx-auto.w-full.p-4.pt-0 {           /* caseta de scris */
  max-width: min(94vw, 1360px) !important;
}

/* ...si bula din interiorul fiecarui mesaj, care are PROPRIUL plafon de
   768px: fara asta, firul se largeste dar textul omului (aliniat la dreapta
   in bula) pica optic in mijlocul ecranului. Masurat in DOM, nu presupus. */
.step > .flex.flex-col {
  max-width: 100% !important;
}
