/* ==========================================================================
   Exolynk → Scalar Theme Bridge
   --------------------------------------------------------------------------
   This is the ONLY file that knows about Scalar's internals. It maps Scalar's
   public theming variables (--scalar-*) onto the Exolynk brand tokens defined
   in ../colors.css (the single source of truth for corporate colors).

   Maintenance rules:
   • Want to change a brand colour?      -> edit ../colors.css only.
   • Updated Scalar (npm update)?         -> nothing to do here, unless Scalar
                                             renames a --scalar-* variable.
   • Scalar applies its mode classes (.light-mode / .dark-mode) on the same
     element that carries .scalar-app, so we target both classes to win over
     Scalar's bundled default theme regardless of stylesheet order.
   ========================================================================== */

/* --------------------------------------------------------------------------
   LIGHT MODE
   -------------------------------------------------------------------------- */
.scalar-app.light-mode,
.light-mode {
  /* Surfaces */
  --scalar-background-1: var(--surface-primary);     /* page / cards   */
  --scalar-background-2: var(--neutral-50);          /* panels         */
  --scalar-background-3: var(--neutral-100);          /* hover / inset  */
  --scalar-background-accent: color-mix(in srgb, var(--primary-500) 12%, transparent);

  /* Text */
  --scalar-color-1: var(--neutral-950);              /* primary text   */
  --scalar-color-2: var(--secondary-500);            /* secondary text */
  --scalar-color-3: var(--neutral-400);              /* muted text     */
  --scalar-color-accent: var(--primary-600);         /* brand accent   */

  /* Borders */
  --scalar-border-color: var(--neutral-200);

  /* Links */
  --scalar-link-color: var(--primary-600);
  --scalar-link-color-hover: var(--primary-700);

  /* Primary button (Authorize / Send) */
  --scalar-button-1: var(--primary-700);
  --scalar-button-1-hover: var(--primary-600);
  --scalar-button-1-color: #ffffff;

  /* Semantic / HTTP-method colours */
  --scalar-color-green: var(--success-600);
  --scalar-color-red: var(--error-600);
  --scalar-color-yellow: var(--warning-600);
  --scalar-color-orange: var(--copper-500);
  --scalar-color-blue: var(--info-600);
  --scalar-color-purple: var(--plum-500);

  /* Sidebar — kept light & subtle for docs readability */
  --scalar-sidebar-background-1: var(--neutral-50);
  --scalar-sidebar-color-1: var(--neutral-900);
  --scalar-sidebar-color-2: var(--secondary-500);
  --scalar-sidebar-border-color: var(--neutral-200);
  --scalar-sidebar-item-hover-background: var(--neutral-100);
  --scalar-sidebar-item-hover-color: var(--primary-700);
  --scalar-sidebar-item-active-background: var(--primary-100);
  --scalar-sidebar-color-active: var(--primary-800);
  --scalar-sidebar-search-background: var(--surface-primary);
  --scalar-sidebar-search-border-color: var(--neutral-200);
  --scalar-sidebar-search-color: var(--neutral-900);
}

/* --------------------------------------------------------------------------
   DARK MODE
   -------------------------------------------------------------------------- */
.scalar-app.dark-mode,
.dark-mode {
  /* Surfaces */
  --scalar-background-1: var(--neutral-950);
  --scalar-background-2: var(--neutral-900);
  --scalar-background-3: var(--neutral-800);
  --scalar-background-accent: color-mix(in srgb, var(--primary-400) 16%, transparent);

  /* Text */
  --scalar-color-1: var(--neutral-50);
  --scalar-color-2: var(--neutral-400);
  --scalar-color-3: var(--neutral-600);
  --scalar-color-accent: var(--primary-300);

  /* Borders */
  --scalar-border-color: var(--neutral-700);

  /* Links */
  --scalar-link-color: var(--primary-300);
  --scalar-link-color-hover: var(--primary-200);

  /* Primary button */
  --scalar-button-1: var(--primary-500);
  --scalar-button-1-hover: var(--primary-400);
  --scalar-button-1-color: #ffffff;

  /* Semantic / HTTP-method colours (lighter weights for dark bg) */
  --scalar-color-green: var(--success-400);
  --scalar-color-red: var(--error-400);
  --scalar-color-yellow: var(--warning-400);
  --scalar-color-orange: var(--copper-400);
  --scalar-color-blue: var(--info-400);
  --scalar-color-purple: var(--plum-400);

  /* Sidebar */
  --scalar-sidebar-background-1: var(--neutral-950);
  --scalar-sidebar-color-1: var(--neutral-100);
  --scalar-sidebar-color-2: var(--neutral-400);
  --scalar-sidebar-border-color: var(--neutral-800);
  --scalar-sidebar-item-hover-background: var(--neutral-800);
  --scalar-sidebar-item-hover-color: var(--primary-200);
  --scalar-sidebar-item-active-background: var(--primary-900);
  --scalar-sidebar-color-active: var(--primary-100);
  --scalar-sidebar-search-background: var(--neutral-900);
  --scalar-sidebar-search-border-color: var(--neutral-700);
  --scalar-sidebar-search-color: var(--neutral-100);
}

/* --------------------------------------------------------------------------
   Typography & shape — mode-independent, mapped to birei look & feel
   -------------------------------------------------------------------------- */
.scalar-app,
.light-mode,
.dark-mode {
  --scalar-font: "Instrument Sans", "Helvetica Neue", Arial, sans-serif;
  --scalar-font-code: "JetBrains Mono", ui-monospace, SFMono-Regular, Menlo,
    Consolas, monospace;

  /* birei uses tight radii (see colors.css --birei-radius-*) */
  --scalar-radius: 0.25rem;
  --scalar-radius-lg: 0.3rem;
  --scalar-radius-xl: 0.375rem;
}