/* Inference Cooperative brand layer for the documentation site.
 *
 * Design-system source of truth: the co-op's chat/dashboard/portal/panel
 * palette, carried in two places and kept identical there —
 *   repos/librechat-custom/assets/custom.css  (html.light / html.dark RGB triples)
 *   repos/member-dashboard/app/main.py        (the dashboard's :root palette)
 * This file reuses those exact values so the documentation reads as the same
 * organisation in both schemes, not a default Material theme.
 *
 * Standing constraint: everything here is local. No third-party font service,
 * no CDN, no other external host.
 */

:root {
  /* -- the co-op's light palette (dashboard/portal/panel design system) -- */
  --cream: #faf8f5;          /* page background */
  --white: #ffffff;          /* cards */
  --ink: #2d3327;            /* primary text (warm, not near-black) */
  --muted: #6b7a62;          /* secondary text */
  --light-muted: #94a08c;    /* tertiary text */
  --green-deep: #5b8c5a;
  --green-mid: #6ba86b;
  --green-light: #7ab87a;
  --green-link: #4e7a4d;     /* dashboard link green — 4.7:1 on cream */
  --green-ink: #2f5c30;
  --border: #e4e0d8;         /* warm neutral border (design-system value) */
  --wash: #eaf3ea;           /* the dashboard's green wash, used sparingly */
  --chip: #f4f2ec;           /* warm chip / code background */
  --hover: #f0ede6;          /* warm hover */
  --bar-track: #eef0ea;      /* neutral track for meters */
  --earth-red: #a04b3a;
  --earth-red-wash: #f3e6e1;
  --bronze: #a97a4a;
  --bronze-wash: #f1e8da;

  /* -- the co-op's dark palette: the deep-pine family from the chat overlay -- */
  --pine: #22271f;           /* 34 39 31  — page background */
  --pine-2: #2a3027;         /* 42 48 39  — raised surface (footer, cards) */
  --pine-3: #343b30;         /* 52 59 48  — chips / code background */
  --pine-hover: #2d3327;     /* --ink reused as the hover band */
  --dark-border: #4a5240;    /* 74 82 64  — warm dark border */
  --dark-text: #e8f5e8;      /* 232 245 232 — light warm text */
  --dark-muted: #94a08c;     /* 148 160 140 — muted text */
}

/* ---------- Material for MkDocs: map the palette onto the theme ---------- */

/* Light scheme: the header is a pale green WASH with dark text, not a saturated green
 * bar. The colour is the homepage's "open source" pill (#e8f5e8). The deep greens stay
 * for ACCENTS -- links, active navigation, rules -- rather than as large background fills.
 */

:root,
[data-md-color-scheme="default"] {
  --md-default-bg-color: var(--cream);
  --md-default-fg-color: var(--ink);
  --md-default-fg-color--light: var(--muted);
  --md-default-fg-color--lighter: var(--light-muted);
  --md-default-fg-color--lightest: var(--border);

  --md-primary-fg-color: #e8f5e8;
  --md-primary-fg-color--light: #eef4ea;
  --md-primary-fg-color--dark: var(--green-deep);
  --md-primary-bg-color: var(--ink);
  --md-primary-bg-color--light: rgba(250, 248, 245, 0.7);

  --md-accent-fg-color: var(--earth-red);
  --md-typeset-a-color: var(--green-link);
  --md-typeset-color: var(--ink);
  --md-typeset-table-color: var(--border);

  --md-code-bg-color: var(--chip);
  --md-code-fg-color: var(--ink);

  --md-footer-bg-color: var(--wash);
  --md-footer-fg-color: var(--ink);
  --md-footer-fg-color--light: var(--muted);

  --md-admonition-bg-color: var(--wash);
}

/* Dark scheme: the co-op's own deep pine, not Material's cold blue-grey slate.
 * The old page background measured #1e2129 (a blue-grey); this scheme is the
 * chat overlay's dark palette (--surface-primary #22271f and its family), so a
 * dark screen reads as the co-op's green identity, not stock Material. */
[data-md-color-scheme="slate"] {
  --md-default-bg-color: var(--pine);
  --md-default-fg-color: var(--dark-text);
  --md-default-fg-color--light: var(--dark-muted);
  --md-default-fg-color--lighter: #6f7a68;
  --md-default-fg-color--lightest: rgba(148, 160, 140, 0.12);

  /* Header bar now matches the chat overlay's dark menu: #171717 with white
   * text (operator request 2026-11-09) — neutral dark, not green. */
  --md-primary-fg-color: #171717;
  --md-primary-fg-color--light: #171717;
  --md-primary-fg-color--dark: #171717;
  --md-primary-bg-color: #ffffff;
  --md-primary-bg-color--light: rgba(255, 255, 255, 0.7);

  --md-accent-fg-color: var(--green-light);
  --md-typeset-a-color: var(--green-light);
  --md-typeset-color: var(--dark-text);
  --md-typeset-table-color: var(--dark-border);

  --md-code-bg-color: var(--pine-3);
  --md-code-fg-color: var(--dark-text);

  --md-footer-bg-color: var(--pine-2);
  --md-footer-fg-color: var(--dark-text);
  --md-footer-fg-color--light: var(--dark-muted);

  --md-admonition-bg-color: var(--pine-2);
}

/* ---------- Typography: Figtree, self-hosted (SIL OFL 1.1) ---------- */

@font-face {
  font-family: "Figtree";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/figtree-400.woff2") format("woff2");
}
@font-face {
  font-family: "Figtree";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/figtree-500.woff2") format("woff2");
}
@font-face {
  font-family: "Figtree";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/figtree-600.woff2") format("woff2");
}
@font-face {
  font-family: "Figtree";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/figtree-700.woff2") format("woff2");
}

:root {
  --md-text-font-family: "Figtree", system-ui, -apple-system, "Segoe UI",
    Roboto, "Helvetica Neue", Arial, sans-serif;
  --md-code-font-family: ui-monospace, "SFMono-Regular", "Cascadia Mono",
    "Segoe UI Mono", Menlo, Consolas, monospace;
}

/* ---------- Friendly details ---------- */

/* Links read like the website's: brand green, semibold, underline on hover. */
.md-typeset a {
  font-weight: 600;
}
.md-typeset a:hover,
.md-typeset a:focus {
  text-decoration: underline;
}

/* Rounder cards and tables; a warm neutral border, never a near-black one. */
.md-typeset .grid.cards > ul > li,
.md-typeset .grid > .card,
.md-typeset table:not([class]) {
  border-radius: 0.6rem;
}
.md-typeset table:not([class]) {
  border: 1px solid var(--md-typeset-table-color);
}

/* Header: co-op green with the cream wordmark. */
.md-header {
  box-shadow: none;
  border-bottom: 1px solid rgba(255, 255, 255, 0.25);
}
[data-md-color-scheme="slate"] .md-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.22);
}
.md-header .md-header__title {
  font-weight: 600;
}

/* The menu-bar (tab) strip. In light it is the same pale green WASH as the
 * header — #e8f5e8, the homepage's "open source" pill — not a saturated fill:
 * the deep greens are accents (links, active navigation, rules), and a large
 * --green-deep bar clashed with the rest of the light palette. A warm hairline
 * separates the wash from the cream page below it. Dark is unchanged. */
.md-tabs {
  background-color: #e8f5e8;
  border-bottom: 1px solid var(--border);
}
/* In dark, the tab row drops to the sheet's dark warm-green (dark-border
 * #4a5240): quieter than green-mid, white labels still clear 7:1. */
[data-md-color-scheme="slate"] .md-tabs {
  background-color: var(--dark-border);
  border-bottom: none;
}
/* Search input: the white field is a light-mode choice only. In dark mode the
 * search surfaces use the pine family — input on the chips tone, light text. */
html:not([data-md-color-scheme="slate"]) .md-search__input {
  background-color: rgba(255, 255, 255, 0.92);
}
[data-md-color-scheme="slate"] .md-search__form,
[data-md-color-scheme="slate"] .md-search__input {
  background-color: var(--pine-3);
  color: var(--dark-text);
}
[data-md-color-scheme="slate"] .md-search__form .md-icon,
[data-md-color-scheme="slate"] .md-search__input::placeholder {
  color: var(--dark-muted);
}
[data-md-color-scheme="slate"] .md-search__scrollwrap,
[data-md-color-scheme="slate"] .md-search-result__article {
  background-color: var(--pine-2);
}
[data-md-color-scheme="slate"] .md-search-result__meta {
  color: var(--dark-muted);
}

/* Admonitions get the co-op's washes instead of stock greys. */
.md-typeset .admonition,
.md-typeset details {
  border-radius: 0.6rem;
}
.md-typeset .admonition.tip,
.md-typeset .admonition.note {
  border-color: var(--green-mid);
}
.md-typeset .admonition.warning {
  border-color: var(--earth-red);
}

/* ---------- Typography: make Figtree actually apply ----------
 * Material renders body and headings with var(--md-text-font-family) and defines that
 * variable on <body>, so a :root definition loses to it by proximity in the DOM -- the
 * same way the colours lost to the palette. Declare the font on the elements themselves
 * as well. Sizing lives in publishing/typography.css, which loads after this file.
 */
body,
.md-typeset,
.md-nav,
.md-header,
.md-tabs {
  font-family: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, sans-serif;
}

.md-typeset h1,
.md-typeset h2,
.md-typeset h3,
.md-typeset h4,
.md-typeset h5,
.md-typeset h6,
.md-header__title {
  font-family: "Figtree", system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue",
    Arial, sans-serif;
}