/* web/src/assets/theme.css */
:root {
  --p-primary-color: #089981;          /* TV green */
  --p-primary-contrast-color: #0f0f0f;
  --p-surface-0:  #0f0f0f;             /* TV bg */
  --p-surface-50: #141414;
  --p-surface-100: #1c1c1c;            /* TV grid lines */
  --p-surface-200: #2e2e2e;            /* TV borders */
  --p-surface-300: #3d3d3d;
  --p-surface-400: #4d4d4d;
  --p-surface-700: #8a8a8a;            /* TV subtext */
  --p-surface-800: #b8b8b8;
  --p-surface-900: #dbdbdb;            /* TV text */

  /* Semantic trading colors */
  --color-bull: #089981;
  --color-bear: #f23645;
  --color-neutral: #8a8a8a;
}

html, body, #app {
  margin: 0;
  padding: 0;
  height: 100vh !important;
  width: 100vw !important;
  overflow: hidden;
  background-color: #0f0f0f !important;
  font-family: 'IBM Plex Sans', sans-serif;
}

vue-advanced-chat {
  font-family: 'IBM Plex Sans', sans-serif;
}

.dark {
  background-color: #0f0f0f !important;
  color: #dbdbdb !important;
}

/* Ensure dark background for main containers */
.app-container,
.main-splitter,
.p-splitter,
.p-splitter-panel {
  background-color: #0f0f0f !important;
}