/*
 * StoneBeam theme — overrides LibreChat's design tokens to the blue product
 * palette so the embedded chat matches its host app (dev.lumitech.co.za).
 *
 * This is the BLUE product palette, NOT the INK/GOLD document house style.
 * See deploy/chat/README.md and the memory note on StoneBeam's two palettes.
 *
 * How this works
 * --------------
 * LibreChat is fully token-driven: every accent resolves through a CSS custom
 * property. So a reskin is a variable override, not a selector war — we only
 * need to redefine the handful of tokens that carry brand colour.
 *
 * This file is injected by patch_brand.cjs as the LAST stylesheet in <head>,
 * after LibreChat's own build. Two things make the override reliable:
 *   1. !important on the custom-property declarations. LibreChat defines the
 *      same token under a mix of selectors (html, .dark, .gizmo.dark) of
 *      differing specificity; !important on a custom property wins the cascade
 *      regardless, so we do not have to out-specify each one.
 *   2. We list both the light-context selectors and the dark ones, so the
 *      brand colour is identical in either theme (a blue accent reads fine on
 *      both grounds).
 *
 * Deliberately minimal: only accent/brand tokens are touched. Surface, text
 * and border tokens are left as LibreChat's, which already match the host
 * app's clean white/grey chrome — repainting them would be a larger, more
 * upgrade-fragile change for no visible gain.
 */

:root {
  --sb-blue: #3080ff;        /* host-app primary */
  --sb-blue-hover: #205fe0;  /* pressed/hover */
}

/* Primary action colour. In stock LibreChat the send button is GREEN
 * (--surface-submit: var(--green-700)); this is the single most visible
 * off-brand element. Route it, its hover, the generic brand accent and the
 * focus ring to StoneBeam blue, in both light and dark themes. */
:root,
html,
.light,
.dark,
.gizmo,
.gizmo.dark {
  --surface-submit: #3080ff !important;
  --surface-submit-hover: #205fe0 !important;
  --brand-purple: #3080ff !important;
  --ring-primary: #3080ff !important;
}

/* shadcn semantic layer (space-separated HSL triplets). #3080ff = 217 100% 59%.
 * Only the focus ring is repointed — leaving --primary alone avoids disturbing
 * text/contrast on the many components that pair it with --primary-foreground. */
:root,
.light {
  --ring: 217 100% 59% !important;
}
.dark,
.gizmo.dark {
  --ring: 217 100% 59% !important;
}

/* The composer send button — the single most-used control. In this build it
 * uses --text-primary (near-black #212121), NOT --surface-submit, so a token
 * override cannot reach it; it is repointed here, scoped to its stable
 * aria-label, to the product blue that the host app uses for primary CTAs. The
 * icon is forced white for contrast on the blue.
 *
 * English-only UI (registration is limited to a few domains), so the label is
 * stable; if it were ever localised this rule simply stops matching and the
 * button falls back to the default dark — a safe degradation, never a broken
 * one. The :not(:disabled) guard leaves the faded empty-composer state alone,
 * and the "Stop" button during generation has a different label so it is
 * untouched. */
button[aria-label="Send message"]:not(:disabled) {
  background-color: #3080ff !important;
  color: #ffffff !important;
}
button[aria-label="Send message"]:not(:disabled):hover {
  background-color: #205fe0 !important;
}