/* Polymind: camada de marca sobre o LibreChat (montada em /assets/polymind.css, carregada pelo branding/index.html).
   Só variáveis do tema e poucos seletores estáveis (#send-button, #prompt-textarea), para sobreviver a atualizações. */

:root {
  --pm-mint: 124 245 200;
  --pm-mint-deep: 13 128 98;
  --pm-ink: 8 9 13;
  --font-sans: 'Space Grotesk', system-ui, -apple-system, 'Segoe UI', sans-serif;
}

html, body, button, input, textarea, select {
  font-family: var(--font-sans) !important;
}
code, pre, kbd, samp, .font-mono { font-family: 'Roboto Mono', ui-monospace, Menlo, monospace !important; }

/* Escuro: cinzas neutros do LibreChat trocados por tinta azulada, a mesma base da landing. */
.dark {
  --gray-100: 236 239 245;
  --gray-200: 222 226 235;
  --gray-300: 196 202 216;
  --gray-400: 150 158 177;
  --gray-500: 92 101 120;
  --gray-600: 52 59 75;
  --gray-650: 40 46 60;
  --gray-700: 31 36 48;
  --gray-800: 21 25 34;
  --gray-850: 14 17 24;
  --gray-875: 12 14 20;
  --gray-900: 8 9 13;
  --presentation: var(--gray-900);
  --surface-code: var(--gray-800);
  --accent-primary: var(--pm-mint);
  --accent-primary-hover: 168 250 219;
  --ring-primary: var(--pm-mint);
  --link: var(--pm-mint);
  --link-hover: 168 250 219;
  --surface-submit: var(--pm-mint-deep);
  --surface-submit-hover: 10 104 80;
  --surface-chat: 18 22 30;
  --border-light: 36 42 56;
}

/* Claro: mantém o claro do LibreChat, com o verde da marca nos acentos. */
html:not(.dark) {
  --accent-primary: var(--pm-mint-deep);
  --accent-primary-hover: 10 104 80;
  --link: var(--pm-mint-deep);
  --link-hover: 10 104 80;
  --surface-submit: var(--pm-mint-deep);
  --surface-submit-hover: 10 104 80;
}

/* Tela inicial: o mesmo brilho menta da landing, só atrás da conversa nova. */
.dark main:has(#prompt-textarea:placeholder-shown) {
  background:
    radial-gradient(60% 45% at 50% 38%, rgb(var(--pm-mint) / .09), transparent 70%),
    rgb(var(--gray-900));
}
.dark main:has(#prompt-textarea:placeholder-shown) .bg-presentation { background: transparent; }

/* Caixa de mensagem: borda que acende em menta no foco, sombra com direção. */
div:has(> div > div > #prompt-textarea) {
  border-color: rgb(var(--border-light)) !important;
  box-shadow: 0 10px 30px -12px rgb(0 0 0 / .55);
  transition: border-color .2s cubic-bezier(.22, 1, .36, 1), box-shadow .2s cubic-bezier(.22, 1, .36, 1);
}
div:has(> div > div > #prompt-textarea:focus) {
  border-color: rgb(var(--pm-mint) / .55) !important;
  box-shadow: 0 12px 34px -12px rgb(0 0 0 / .6), 0 0 0 3px rgb(var(--pm-mint) / .12);
}
#prompt-textarea { caret-color: rgb(var(--pm-mint)); }
html:not(.dark) #prompt-textarea { caret-color: rgb(var(--pm-mint-deep)); }

/* Botão enviar: menta com seta escura (contraste 13:1). */
#send-button:not(:disabled) {
  background: rgb(var(--pm-mint)) !important;
  color: rgb(var(--pm-ink)) !important;
  transition: transform .15s cubic-bezier(.22, 1, .36, 1), background-color .15s;
}
#send-button:not(:disabled):hover { background: rgb(168 250 219) !important; transform: translateY(-1px); }
#send-button:not(:disabled):active { transform: translateY(0); }

/* Ícones das IAs (ladrilhos de /assets/ia): canto da marca em vez do círculo, que cortava o ladrilho. */
div:has(> img[src*="/assets/ia/"]) { border-radius: 24% !important; }
img[src*="/assets/ia/"] { border-radius: 24%; }
[role="menu"] div:has(> img[src*="/assets/ia/"]),
[role="listbox"] div:has(> img[src*="/assets/ia/"]) { width: 30px !important; height: 30px !important; }
[role="menu"] div.flex-shrink-0:has(img[src*="/assets/ia/"]) { width: 30px; height: 30px; }

/* Superfícies do navegador também na marca. */
::selection { background: rgb(var(--pm-mint) / .3); color: inherit; }
:focus-visible { outline-color: rgb(var(--pm-mint)); }
* { scrollbar-color: rgb(var(--gray-600)) transparent; scrollbar-width: thin; }

@media (prefers-reduced-motion: reduce) {
  #send-button, div:has(> div > div > #prompt-textarea) { transition: none !important; }
}