/* FanTrad — thème A v5 « premium sobre ». Refonte UI opérateur.
   Stratégie : surcharge des variables shadcn de Chainlit (palette v3, HSL) → recolore le DOM
   sans cibler de classes dynamiques fragiles ; + Hanken Grotesk, scrollbars fines, raffinements sûrs. */
@import url("https://fonts.googleapis.com/css2?family=Hanken+Grotesk:wght@400;500;600;700&display=swap");

/* ---- palette v3 (dark) — HSL composantes, consommées par hsl(var(--x)).
   !important : Chainlit définit ces variables dans son bundle (même spécificité, chargé après)
   → on force la surcharge sur la valeur de la custom property. ---- */
html.dark, html:root, .dark, :root {
  --background: 216 28% 7% !important;          /* #0d1117 */
  --foreground: 210 33% 96% !important;         /* #f1f5fa */
  --card: 215 22% 11% !important;               /* #161b22 */
  --card-foreground: 210 33% 96% !important;
  --popover: 215 22% 11% !important;
  --popover-foreground: 210 33% 96% !important;
  --primary: 208 100% 81% !important;           /* accent #9cd1ff */
  --primary-foreground: 207 74% 12% !important; /* #082236 — texte sur accent */
  --secondary: 222 26% 15% !important;          /* #1c2230 */
  --secondary-foreground: 210 33% 96% !important;
  --muted: 215 22% 11% !important;
  --muted-foreground: 213 16% 70% !important;   /* #a6b1be */
  --accent: 222 26% 15% !important;             /* hover surface */
  --accent-foreground: 210 33% 96% !important;
  --border: 213 24% 18% !important;             /* #222c38 */
  --input: 213 24% 18% !important;
  --ring: 208 100% 81% !important;
  --radius: 0.6rem !important;
}

/* ---- typo ---- */
html, body, button, input, textarea, select,
[class*="cl-"], .markdown-body, [data-radix-popper-content-wrapper] {
  font-family: "Hanken Grotesk", ui-sans-serif, system-ui, -apple-system, sans-serif !important;
}
body { -webkit-font-smoothing: antialiased; letter-spacing: -0.005em; }

/* ---- scrollbars fines (corrige l'ascenseur gris) ---- */
* { scrollbar-width: thin; scrollbar-color: #2a3543 transparent; }
*::-webkit-scrollbar { width: 8px; height: 8px; }
*::-webkit-scrollbar-track { background: transparent; }
*::-webkit-scrollbar-thumb {
  background: #26313f; border-radius: 999px;
  border: 2px solid hsl(var(--background)); background-clip: padding-box;
}
*::-webkit-scrollbar-thumb:hover { background: #33414f; background-clip: padding-box; }

/* ---- FI héros : réponse FanTrad = grande, blanc pur, lecture soirée + rail accent ----
   DOM réel Chainlit 2.11.1 (inspecté) : .ai-message > … > .message-content > .prose > .leading-7.
   On rehausse le texte assistant et on ajoute le rail accent à gauche (distinction You/FanTrad). */
.ai-message .message-content {
  border-left: 2px solid hsl(var(--primary));
  padding-left: 14px;
}
.ai-message .prose .leading-7 {
  font-size: 17.5px;
  font-weight: 500;
  line-height: 1.55;
  color: #ffffff;
}
/* sous-titre EN inline : Chainlit rend cl.Text inline comme une Card shadcn (titre = name).
   On l'aplatit en légende discrète : masquer le titre (name), retirer bordure/padding, muter l'EN. */
.ai-message .message-content .rounded-lg.border.bg-card {
  border: none !important;
  background: transparent !important;
}
.ai-message .message-content .rounded-lg .p-6 { padding: 6px 0 0 !important; }
.ai-message .message-content .text-2xl { display: none !important; }   /* cache le label "subtitle" */
.ai-message .message-content .italic, .ai-message .prose em {
  color: #c8d2de !important;
  font-size: 14px;
  font-style: normal;
}
/* bulle You = surface grise pleine (vs rail accent FanTrad) */
[class*="px-5"][class*="py-2"].relative {
  background: hsl(var(--secondary));
  border: 1px solid hsl(var(--border));
  border-radius: 12px;
}

/* ---- pills de ton (commands) : accent net sur l'état sélectionné ---- */
#command-buttons button[data-selected="true"],
.command-buttons button[aria-pressed="true"] {
  border-color: hsl(var(--primary)) !important;
}

/* ---- sidebar droite (ElementSidebar) : surface card, séparée ---- */
[class*="element-sidebar"], aside { background: hsl(var(--card)); }

/* ---- input bar : liseré accent discret ---- */
[contenteditable="true"], .composer, #message-composer {
  border-color: hsl(var(--border));
}

/* ---- footer Chainlit (watermark) discret ---- */
a[href*="chainlit"] { opacity: 0.5; }