/* ── IMAGEN DE FONDO LOGIN ──────────────────────────────────────── */

img.absolute.inset-0 {
  content: url("/public/chat_img.jpg") !important;
}

/* ── LOGIN ─────────────────────────────────────────────────────── */

/* Oculta el img.logo que Chainlit renderiza por defecto */
img.logo {
  display: none !important;
}

/* Muestra logo.png en la pantalla de login */
div:has(> img.logo) {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

div:has(> img.logo)::before {
  content: "";
  display: block;
  width: 220px;
  height: 80px;
  background-image: url("/public/logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* ── HEADER ────────────────────────────────────────────────────── */

/* Oculta el logo/texto original del header */
header img {
  display: none !important;
}

/* Inserta chat_documentador.png en el header */
header > div {
  display: flex !important;
  justify-content: center !important;
  align-items: center !important;
}

header > div::before {
  content: "";
  display: block;
  width: 180px;
  height: 60px;
  background-image: url("/public/logo.png");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* ── TEXTO ─────────────────────────────────────────────────────── */

/* Oculta "Chainlit" solo en el header principal, sin afectar dropdowns */
body > div > header span:has(svg) + span {
  display: none !important;
}

/* Agrega el nombre de la app en el header principal */
body > div > header span:has(svg)::after {
  content: "Chat Documentador";
  font-weight: 700;
  font-size: 1.4rem;
  margin-left: 10px;
}

/* ── BIBLIOTECA: ocultar ícono para que se vea igual que "Léeme" ── */

a[href="/biblioteca"] img {
  display: none !important;
}

a[href="/biblioteca"] {
  gap: 0 !important;
}

/* ── PERFILES DE PROYECTO ──────────────────────────────────────── */

#chat-profile-description {
  display: none !important;
}

/* ── FORMULARIOS / MENSAJES ────────────────────────────────────── */

.MuiPaper-root form {
  border-radius: 16px !important;
}

header {
  border-bottom: 1px solid rgba(129, 140, 248, 0.2) !important;
}

.message-container {
  border-radius: 12px !important;
}

[data-testid="assistant-message"] .message-container {
  background: rgba(79, 70, 229, 0.08) !important;
  border-left: 3px solid #6366F1;
}

#chat-input {
  border-radius: 12px !important;
  border: 1px solid rgba(129, 140, 248, 0.3) !important;
}

#chat-input:focus-within {
  border-color: #818CF8 !important;
  box-shadow: 0 0 0 3px rgba(129, 140, 248, 0.15) !important;
}

/* ── WATERMARK / FOOTER INPUT ───────────────────────────────────── */

[class*="watermark"],
[data-testid="watermark"],
footer,
#chat-input ~ p,
#chat-input ~ div p,
[id*="input"] ~ p,
div[class*="input"] > p,
div[class*="footer"] p,
div[class*="MuiBox"] > p:last-child {
  display: none !important;
}

/* ── SCROLLBAR ─────────────────────────────────────────────────── */

::-webkit-scrollbar {
  width: 6px;
}

::-webkit-scrollbar-track {
  background: transparent;
}

::-webkit-scrollbar-thumb {
  background: rgba(129, 140, 248, 0.3);
  border-radius: 3px;
}

::-webkit-scrollbar-thumb:hover {
  background: rgba(129, 140, 248, 0.6);
}
