/*
 * Nieman Predictions Explorer — CUNY J-School brand theme
 *
 * Light gray bg (#F8F8F8), dark gray text (#323232), CUNY orange (#fe8807).
 * Uses both CSS variable overrides AND direct !important styles to beat
 * Chainlit's built-in theme (which loads after custom CSS).
 */

@import url('https://fonts.googleapis.com/css2?family=PT+Serif:ital,wght@0,400;0,700;1,400&display=swap');

/* ===== Chainlit theme variable overrides ===== */
/* Higher specificity selector to beat Chainlit's :root definitions */

:root:root {
  --background: 0 0% 100%;
  --foreground: 0 0% 20%;
  --primary: 31 99% 51%;
  --primary-foreground: 0 0% 100%;
  --ring: 31 99% 51%;
  --card: 0 0% 100%;
  --card-foreground: 0 0% 20%;
  --popover: 0 0% 100%;
  --popover-foreground: 0 0% 20%;
  --accent: 30 15% 94%;
  --accent-foreground: 0 0% 20%;
  --muted: 0 0% 93%;
  --muted-foreground: 0 0% 40%;
  --border: 0 0% 85%;
  --input: 0 0% 85%;
  --secondary: 30 8% 95%;
  --secondary-foreground: 0 0% 20%;
  --destructive: 0 84% 60%;
  --destructive-foreground: 0 0% 100%;
  --sidebar-background: 0 0% 97%;
  --sidebar-foreground: 0 0% 20%;
  --sidebar-accent: 30 15% 94%;
  --sidebar-accent-foreground: 0 0% 20%;
  --sidebar-border: 0 0% 85%;
  --sidebar-primary: 31 99% 51%;
  --sidebar-primary-foreground: 0 0% 100%;
  --sidebar-ring: 31 99% 51%;
}

/* ===== Direct overrides (belt + suspenders) ===== */

body {
  background-color: #FFFFFF !important;
  color: #323232 !important;
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
  font-size: 16px !important;
}

main, section, article {
  background-color: #FFFFFF !important;
  color: #323232 !important;
}

p, li, td, th, label, h1, h2, h3, h4, h5, h6 {
  color: #323232 !important;
}

/* ===== Typography ===== */

h1, h2, h3, h4, h5, h6 {
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif !important;
  font-weight: 700 !important;
}

/* ===== Message text sizing ===== */

[data-testid="assistant-message"] p,
[data-testid="assistant-message"] li,
[data-testid="assistant-message"] span {
  font-size: 14px !important;
}

[data-testid="assistant-message"] h2 {
  font-size: 22px !important;
  margin-bottom: 12px !important;
}

/* ===== Header bar ===== */

header {
  background-color: #323232 !important;
  border-bottom: 3px solid #fe8807 !important;
}

header,
header p,
header span,
header a,
header button {
  color: #FFFFFF !important;
}

/* ===== User message bubbles — dark gray with white text ===== */

[data-testid="user-message"] {
  background-color: #323232 !important;
  color: #FFFFFF !important;
  border-radius: 8px !important;
}

[data-testid="user-message"] p,
[data-testid="user-message"] span {
  color: #FFFFFF !important;
}

/* ===== Input / composer ===== */

textarea {
  background-color: #F5F5F5 !important;
  color: #323232 !important;
  border: 1px solid #D0D0D0 !important;
  border-radius: 8px !important;
  font-family: 'PT Serif', Georgia, 'Times New Roman', serif !important;
}

textarea::placeholder {
  color: #888888 !important;
}

textarea:focus {
  border-color: #999999 !important;
  outline: none !important;
  box-shadow: none !important;
}

/* ===== Links ===== */

a {
  color: #fe8807 !important;
}

a:hover {
  color: #e07500 !important;
}

header a {
  color: #FFFFFF !important;
}

/* ===== Scrollbar ===== */

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

::-webkit-scrollbar-track {
  background: #f0f0f0;
}

::-webkit-scrollbar-thumb {
  background: #CCCCCC;
  border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
  background: #fe8807;
}