/*
 * Vireborn application stylesheet.
 * Propshaft serves this as /assets/application-<hash>.css.
 * The Tailwind build is generated to app/assets/builds/tailwind.css; we inline it here.
 */

/* Global Dark Mode Theme */
html, body {
  background-color: #0f172a; /* slate-950 */
  color: #e2e8f0; /* slate-200 */
  margin: 0;
  padding: 0;
}

/* Chat UI Smooth Scrolling + Column Reverse */
#chat-messages {
  display: flex;
  flex-direction: column;
  scroll-behavior: smooth;
  background-color: #0f172a;
}

/* Chat container layout */
.chat-container {
  display: flex;
  flex-direction: column;
  overflow-y: scroll;
  height: 80vh;
}

/* Webkit scrollbar styling for chat */
#chat-messages::-webkit-scrollbar {
  width: 8px;
}

#chat-messages::-webkit-scrollbar-track {
  background: rgba(15, 23, 42, 0.3);
  border-radius: 4px;
}

#chat-messages::-webkit-scrollbar-thumb {
  background: rgba(71, 85, 105, 0.5);
  border-radius: 4px;
}

#chat-messages::-webkit-scrollbar-thumb:hover {
  background: rgba(71, 85, 105, 0.7);
}

/* Ensure last message anchor is at the bottom */
#last-message {
  height: 1px;
  visibility: hidden;
}

/* ═══════════════════════════════════════════════════════════════════════════
   CHAIRMAN DIRECTIVE: THE SELECTOR STRIKE
   Nuclear option — force-overwrite all light colors globally with !important
   ══════════════════════════════════════════════════════════════════════════ */

/* Kill all white/light backgrounds */
.bg-white,
.bg-slate-50,
.bg-slate-100,
.bg-orange-50,
.bg-gray-50 {
  background-color: #0A0A0A !important;
}

/* Force all dark text to white */
.text-slate-900,
.text-gray-900,
.text-slate-800,
.text-gray-800 {
  color: #FFFFFF !important;
}

/* Override body text to light colors */
.text-slate-600,
.text-slate-700,
.text-gray-600 {
  color: #CBD5E1 !important; /* slate-300 */
}

/* Dark borders everywhere */
.border-gray-200,
.border-slate-200,
.border-gray-300 {
  border-color: #1E293B !important; /* slate-800 */
}

/* Kill shadow on light cards */
.shadow-lg,
.shadow-xl,
.shadow-2xl {
  box-shadow: 0 10px 30px rgba(0, 0, 0, 0.5) !important;
}

