/* Aroneu — white-label instance (FEAT-14), Brandbook 2 "Home theme".
 *
 * Source of truth: the Aroneu brandbook (Oct 2026) and its developer brief.
 * App UIs wear the Home theme in light and dark (Ali, 2026-10-27): Porcelain
 * base, Prussian ink, Ivory, Cherry as the one highlight. No other accent, no
 * invented shades: every value below is a token from the brief.
 *
 * Overrides LibreChat's theme custom properties (html{} light, .dark{} dark),
 * loaded after the bundle, so no rebuild. Contrast, checked: Prussian on
 * Porcelain 13.6:1, Body on White 7.8:1, Ivory on Cherry 8.6:1, Fog on
 * Prussian 7.5:1, Fog on Deep card 6.0:1. Slate on Linen is 4.35:1, so
 * secondary text uses Body, which passes on every light surface.
 */
@font-face {
  font-family: "Maven Pro";
  font-style: normal;
  font-weight: 400 600;
  font-display: swap;
  src: url("/assets/brand-font-maven-pro.woff2") format("woff2");
}

html {
  --brand-purple:          #940000;  /* Cherry: the one highlight */
  --presentation:          #FDFAF6;  /* Porcelain */
  --text-primary:          #0E2D47;  /* Prussian ink */
  --text-secondary:        #3D5568;  /* Body */
  --text-secondary-alt:    #3D5568;
  --text-tertiary:         #5A6D7B;  /* Slate: captions, metadata */
  --text-warning:          #342D18;  /* Umber */
  --text-destructive:      #940000;
  --ring-primary:          #940000;
  --header-primary:        #FDFAF6;
  --header-hover:          #EAE7DF;  /* Linen */
  --header-button-hover:   #EAE7DF;
  --surface-active:        #EAE7DF;
  --surface-active-alt:    #D5D5D0;  /* Hairline */
  --surface-hover:         #EAE7DF;
  --surface-hover-alt:     #D5D5D0;
  --surface-primary:       #FDFAF6;
  --surface-primary-alt:   #EAE7DF;  /* sidebar band */
  --surface-primary-contrast: #EAE7DF;
  --surface-secondary:     #EAE7DF;
  --surface-secondary-alt: #D5D5D0;
  --surface-tertiary:      #EAE7DF;
  --surface-tertiary-alt:  #FFFFFF;  /* white is for cards on light only */
  --surface-dialog:        #FFFFFF;
  --surface-chat:          #FFFFFF;
  --surface-submit:        #940000;
  --surface-submit-hover:  #940000;
  --surface-destructive:   #940000;
  --surface-destructive-hover: #940000;
  --border-light:          #D5D5D0;
  --border-medium:         #D5D5D0;
  --border-medium-alt:     #D5D5D0;
  --border-heavy:          #7B8992;  /* Steel */
  --border-xheavy:         #5A6D7B;
  --border-destructive:    #940000;
  /* The shadcn-style tokens LibreChat reads as "H S% L%". */
  --background:            34 63.6% 97.8%;   /* Porcelain */
  --foreground:            207 67.1% 16.7%;  /* Prussian */
  --card:                  0 0% 100%;
  --card-foreground:       207 67.1% 16.7%;
  --primary:               207 67.1% 16.7%;
  --primary-foreground:    39 68% 95.1%;     /* Ivory */
  --secondary:             44 20.8% 89.6%;   /* Linen */
  --secondary-foreground:  207 67.1% 16.7%;
  --muted:                 44 20.8% 89.6%;
  --muted-foreground:      205 15.5% 41.8%;  /* Slate */
  --accent:                44 20.8% 89.6%;
  --accent-foreground:     207 67.1% 16.7%;
  --destructive:           0 100% 29%;       /* Cherry */
  --destructive-foreground: 39 68% 95.1%;
  --border:                60 5.6% 82.5%;    /* Hairline */
  --input:                 60 5.6% 82.5%;
  --ring:                  0 100% 29%;
}

.dark {
  /* Never Cherry text or icons on Prussian (1.5:1): the brand colour turns
   * Ivory here, and Cherry stays only as a filled button with an Ivory label
   * and an Ivory outline (below). */
  --brand-purple:          #FBF5EA;
  --presentation:          #0E2D47;  /* Prussian ink */
  --text-primary:          #FBF5EA;  /* Ivory */
  --text-secondary:        #B9BDBC;  /* Fog */
  --text-secondary-alt:    #B9BDBC;
  --text-tertiary:         #B9BDBC;
  --text-warning:          #FAECC2;  /* Champagne */
  --text-destructive:      #F3B4AE;
  --ring-primary:          #FBF5EA;
  --header-primary:        #0E2D47;
  --header-hover:          #213D54;  /* Deep card */
  --header-button-hover:   #213D54;
  --surface-active:        #213D54;
  --surface-active-alt:    #2C4A62;  /* Dark hairline */
  --surface-hover:         #213D54;
  --surface-hover-alt:     #2C4A62;
  --surface-primary:       #0E2D47;
  --surface-primary-alt:   #091D2E;  /* Night: sidebar band */
  --surface-primary-contrast: #091D2E;
  --surface-secondary:     #091D2E;
  --surface-secondary-alt: #213D54;
  --surface-tertiary:      #213D54;
  --surface-tertiary-alt:  #213D54;
  --surface-dialog:        #213D54;
  --surface-chat:          #213D54;
  --surface-submit:        #940000;
  --surface-submit-hover:  #940000;
  --surface-destructive:   #940000;
  --surface-destructive-hover: #940000;
  --border-light:          #2C4A62;
  --border-medium:         #2C4A62;
  --border-medium-alt:     #2C4A62;
  --border-heavy:          #7B8992;
  --border-xheavy:         #B9BDBC;
  --border-destructive:    #F3B4AE;
  --background:            207 67.1% 16.7%;
  --foreground:            39 68% 95.1%;
  --card:                  207 43.6% 22.9%;  /* Deep card */
  --card-foreground:       39 68% 95.1%;
  --primary:               39 68% 95.1%;
  --primary-foreground:    207 67.1% 16.7%;
  --secondary:             207 43.6% 22.9%;
  --secondary-foreground:  39 68% 95.1%;
  --muted:                 208 67.3% 10.8%;  /* Night */
  --muted-foreground:      165 2.9% 73.3%;   /* Fog */
  --accent:                207 43.6% 22.9%;
  --accent-foreground:     39 68% 95.1%;
  --destructive:           0 100% 29%;
  --destructive-foreground: 39 68% 95.1%;
  --border:                207 38% 27.8%;    /* Dark hairline */
  --input:                 207 38% 27.8%;
  --ring:                  39 68% 95.1%;
}

/* Cherry buttons carry an Ivory label, and in dark mode an Ivory outline. */
.bg-surface-submit, .bg-surface-destructive { color: #FBF5EA !important; }
.dark .bg-surface-submit, .dark .bg-surface-destructive { box-shadow: 0 0 0 1px #FBF5EA; }

/* Maven Pro for everything but code; never heavier than 600. */
html, body, button, input, textarea, select, .font-sans {
  font-family: "Maven Pro", system-ui, -apple-system, "Segoe UI", sans-serif !important;
}
.font-bold, .font-extrabold, .font-black, b, strong, h1, h2, h3 { font-weight: 600 !important; }