/* PGG AI Library theme on top of LibreChat v0.8.8 — loaded after LibreChat's own CSS (librechat/patch-index.mjs).
   Only variables and a few selectors; LibreChat's colours are bare "R G B" triplets (rgb(var(--x) / alpha)).
   PGG colours from phonggiagroup.com: maroon #8a1538, orange #f08a33. */

html {
  --pgg-maroon: 138 21 56;
  --pgg-maroon-dark: 112 14 44;
  --pgg-orange: 240 138 51;

  --surface-submit: var(--pgg-maroon);
  --surface-submit-hover: var(--pgg-maroon-dark);
  --brand-purple: var(--pgg-maroon);
  --ring-primary: var(--pgg-orange);
}

.dark {
  /* Lighter maroon so the send button still reads on dark grey; white text stays above 7:1. */
  --surface-submit: 163 32 74;
  --surface-submit-hover: 181 42 85;
  --brand-purple: var(--pgg-orange);
  --ring-primary: var(--pgg-orange);
}

/* Login and sign-up logo: the PGG mark is wide, give it room. In dark mode the maroon letters need a light card. */
img[src$="assets/logo.svg"] {
  display: block;
  height: 64px !important;
  width: auto !important;
  max-width: 220px;
  margin-left: auto;
  margin-right: auto;
  object-fit: contain;
}
.dark img[src$="assets/logo.svg"] {
  background: #fff;
  border-radius: 12px;
  padding: 6px 10px;
}

/* Keyboard focus in the brand orange. */
:focus-visible {
  outline-color: rgb(var(--pgg-orange));
}