/* ============================================================
   TSM AI Studio — proxy-injected theme overlay for LibreChat
   Non-destructive: overrides brand accent colors, background,
   input glow, and header surface. Tuned to be layout-safe.
   Full component redesign (custom selector / quick cards) needs
   the from-source build.
   ============================================================ */
:root {
  --tsm-bg: #050914;
  --tsm-card: #111827;
  --tsm-primary: #7c3cff;
  --tsm-primary-2: #7c4dff;
  --tsm-secondary: #00aaff;
  --tsm-text: #ffffff;
  --tsm-glass: rgba(15, 20, 35, 0.85);
  --tsm-border: rgba(124, 77, 255, 0.35);
}

/* Map LibreChat's dark surface/brand tokens onto TSM palette where they exist */
html.dark, :root {
  --brand-purple: var(--tsm-primary);
  --surface-submit: var(--tsm-primary);
  --surface-submit-hover: var(--tsm-primary-2);
  --text-secondary-alt: var(--tsm-secondary);
}

/* App background — deep TSM gradient */
body,
#root,
.dark body {
  background:
    radial-gradient(1200px 600px at 80% -10%, rgba(124, 77, 255, 0.10), transparent 60%),
    radial-gradient(900px 500px at -10% 110%, rgba(0, 170, 255, 0.08), transparent 60%),
    var(--tsm-bg) !important;
}

/* Primary/send buttons → TSM neon */
button[data-testid="send-button"],
.btn-primary,
button[type="submit"].bg-green-500 {
  background: linear-gradient(135deg, var(--tsm-primary), var(--tsm-secondary)) !important;
  border: none !important;
  box-shadow: 0 0 18px rgba(124, 77, 255, 0.45) !important;
}

/* Chat input surface → rounded neon glow (targets the composer form) */
form textarea,
form[role="search"],
.composer,
div[class*="composer"] textarea {
  caret-color: var(--tsm-primary);
}
form:has(textarea) {
  border-radius: 26px !important;
  border: 1px solid var(--tsm-primary-2) !important;
  box-shadow: 0 0 22px rgba(124, 77, 255, 0.35) !important;
  background: rgba(20, 25, 45, 0.80) !important;
}

/* Header surface → subtle glassmorphism */
header, nav[aria-label], div[role="banner"] {
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

/* Accent links / active states */
a, .text-token-text-secondary:hover {
  color: var(--tsm-secondary);
}

/* Scrollbar accent */
* {
  scrollbar-color: var(--tsm-primary) transparent;
}
::-webkit-scrollbar-thumb {
  background: linear-gradient(var(--tsm-primary), var(--tsm-secondary));
  border-radius: 8px;
}
