/* Solid Data brand overlay for LibreChat.
 *
 * Mounted and loaded AFTER the compiled app bundle so these custom
 * property redefinitions cascade over LibreChat's defaults
 * (client/src/style.css, selectors `html` / `.dark`) without forking or
 * rebuilding the LibreChat image. Only the semantic tokens LibreChat
 * exposes as CSS variables are covered here, plus the `.btn-primary`
 * component class (send button), which hardcodes rgba() values instead
 * of reading a variable.
 *
 * Known gap: any other hardcoded color (not a variable, not
 * `.btn-primary`) will NOT be caught by this file. Do a visual pass
 * after deploying (light + dark mode) and extend this file if anything
 * still shows LibreChat's default green/purple.
 *
 * Palette source: solid-data-brand skill.
 */

html {
  /* Actions / interactive accent (was ChatGPT purple #ab68ff) */
  --brand-purple: #197ce5;

  /* Body text */
  --text-primary: #1a2b49;
  --text-warning: #fbc00e;
  --text-destructive: #ef4444;

  /* Borders / subtle surfaces (Stroke/Border + Background share this hex) */
  --border-light: #dfe6ec;
  --border-medium: #dfe6ec;
  --surface-secondary: #dfe6ec;

  /* Send button / primary CTA surface (was ChatGPT green) */
  --surface-submit: #197ce5;
  --surface-submit-hover: #1568c2;
  --surface-destructive: #ef4444;
  --surface-destructive-hover: #dc2626;
  --border-destructive: #ef4444;

  /* shadcn/ui primitives (dialogs, dropdowns, focus rings) - HSL triples */
  --primary: 211 80% 50%;
  --primary-foreground: 0 0% 100%;
  --accent: 211 80% 96%;
  --accent-foreground: 211 80% 30%;
  --ring: 211 80% 50%;
}

.dark {
  --brand-purple: #197ce5;
  --text-warning: #fbc00e;
  --text-destructive: #ef4444;

  --surface-submit: #197ce5;
  --surface-submit-hover: #1568c2;
  --surface-destructive: #ef4444;
  --surface-destructive-hover: #dc2626;
  --border-destructive: #ef4444;

  /* Lighter than the light-theme value on purpose - contrast against the
     dark surfaces defined in client/src/style.css's .dark block. */
  --primary: 211 80% 60%;
  --primary-foreground: 0 0% 9%;
  --accent: 211 40% 22%;
  --accent-foreground: 0 0% 98%;
  --ring: 211 80% 60%;
}

/* .btn-primary hardcodes rgba() instead of reading a variable, so the
   send button and similar primary actions need direct overrides. */
.btn-primary {
  background-color: #197ce5 !important;
}
.btn-primary:hover {
  background-color: #1568c2 !important;
}
.btn-primary:focus-visible,
.btn-primary.focus-visible {
  --tw-ring-color: rgba(25, 124, 229, var(--tw-ring-opacity, 1)) !important;
}
.btn-primary:disabled:hover {
  background-color: #197ce5 !important;
}
