/*
 * Tenant theme override template. The frontend boots from index.html, which
 * links this file after the bundle — replace it via the dokploy volume mount
 * (files/customization/theme.css) to re-skin the app without a rebuild.
 *
 * Override the semantic tokens below with raw values — this is the contract a
 * tenant edits (copy, change the hex). The values here are the SAME LabsChat
 * (Capybara) defaults baked into client/src/style.css; keep the resolved
 * colors in lockstep with that file.
 *
 * Use html:root / html.dark selectors (specificity 0,1,1) so overrides win
 * over the bundle's plain :root / .dark regardless of stylesheet load order.
 *
 * Capybara Labs brand palette (extracted from the logo):
 *   Deep Charcoal  #202D37  dark canvas / surfaces
 *   Slate Gray     #6B7E8C  muted text / borders
 *   Capybara Brown #C28455  primary CTA / brand accent
 *   Shadow Brown   #885431  accent hover / active borders / links (light)
 *   Sand Brown     #D9A679  accessible link / accent (dark surfaces)
 *   Tech Blue-Gray #91B3C7  secondary text / icons
 *   Light Ice      #D4E5ED  high-contrast dark text / light surfaces
 *
 * Destructive / warning / green / chart / switch tokens are intentionally
 * left at their defaults — semantic state colors are not rebranded.
 */

html:root {
  /* brand */
  --brand-border: #c28455;
  --brand-footer: #c28455;
  --brand-primary: #c28455;
  --brand-primary-hover: #885431;
  --brand-bg: #c28455;
  --surface-submit: #c28455;
  --surface-submit-hover: #885431;

  /* text — charcoal primary over light ice surfaces */
  --text-primary: #202d37;
  --text-secondary: #4a5a66;
  --text-secondary-alt: #6b7e8c;
  --text-tertiary: #6b7e8c;
  --text-link: #885431;
  --ring-primary: #91b3c7;

  /* surfaces — neutral light with a faint ice tint */
  --presentation: #ffffff;
  --header-hover: #f1f6f9;
  --header-button-hover: #f1f6f9;
  --surface-active: #e8f0f4;
  --surface-active-alt: #dce9ef;
  --surface-hover: #dce9ef;
  --surface-hover-alt: #cfe0e8;
  --surface-primary: #ffffff;
  --surface-primary-alt: #f7fafc;
  --surface-primary-contrast: #eef5f8;
  --surface-secondary: #f1f6f9;
  --surface-secondary-alt: #e8f0f4;
  --surface-tertiary: #eef5f8;
  --surface-tertiary-alt: #ffffff;
  --surface-dialog: #ffffff;
  --surface-chat: #ffffff;

  /* borders — ice → slate ramp */
  --border-light: #d4e5ed;
  --border-medium-alt: #c2d8e2;
  --border-medium: #c2d8e2;
  --border-heavy: #91b3c7;
  --border-xheavy: #6b7e8c;
}

html.dark {
  /* brand */
  --brand-border: #c28455;
  --brand-footer: #c28455;
  --brand-primary: #c28455;
  --brand-primary-hover: #885431;
  --brand-bg: #c28455;
  --surface-submit: #c28455;
  --surface-submit-hover: #885431;

  /* text — light ice primary, blue-gray / slate secondaries */
  --text-primary: #d4e5ed;
  --text-secondary: #91b3c7;
  --text-secondary-alt: #6b7e8c;
  --text-tertiary: #6b7e8c;
  --text-link: #d9a679;
  --ring-primary: #6b7e8c;

  /* surfaces — charcoal scale around #202D37 */
  --presentation: #202d37;
  --header-primary: #19222b;
  --header-hover: #2a3a47;
  --header-button-hover: #2a3a47;
  --surface-active: #33495a;
  --surface-active-alt: #2a3a47;
  --surface-hover: #2a3a47;
  --surface-hover-alt: #33495a;
  --surface-primary: #202d37;
  --surface-primary-alt: #19222b;
  --surface-primary-contrast: #19222b;
  --surface-secondary: #19222b;
  --surface-secondary-alt: #19222b;
  --surface-tertiary: #2a3a47;
  --surface-tertiary-alt: #2a3a47;
  --surface-dialog: #19222b;
  --surface-chat: #202d37;

  /* borders — slate / blue-gray ramp */
  --border-light: #2e3d49;
  --border-medium-alt: #3b4d5c;
  --border-medium: #3b4d5c;
  --border-heavy: #51697b;
  --border-xheavy: #6b7e8c;
}
