/**
 * Developers / API docs — CoralBold color alignment only
 * Cream paper #FAF6F1 · ink #2A211C · coral #FF6B4A · teal #14806E
 * Scoped to .lx-dc-api / .api-docs-section
 */

.lx-dc-api,
.lx-dc-api .api-docs-section {
  --api-bg: #FAF6F1;
  --api-paper: #fff;
  --api-ink: #2A211C;
  --api-muted: #756A60;
  --api-line: rgba(42, 33, 28, 0.1);
  --api-coral: #FF6B4A;
  --api-coral-deep: #E85535;
  --api-teal: #14806E;
  --api-code-bg: #1C1714;
}

.lx-dc-api .api-docs-section,
[data-scheme="light"] .lx-dc-api .api-docs-section {
  background: var(--api-bg);
  color: var(--api-ink);
}

.lx-dc-api .api-content,
[data-scheme="light"] .lx-dc-api .api-content {
  background: transparent;
}

.lx-dc-api .api-title,
.lx-dc-api .api-block h2,
.lx-dc-api .api-block h4,
.lx-dc-api .endpoint-category-title,
.lx-dc-api .endpoint-header h4,
.lx-dc-api .endpoint-header h5,
.lx-dc-api .response-title,
.lx-dc-api .param-name,
[data-scheme="light"] .lx-dc-api .api-title,
[data-scheme="light"] .lx-dc-api .api-block h2,
[data-scheme="light"] .lx-dc-api .api-block h4,
[data-scheme="light"] .lx-dc-api .endpoint-category-title,
[data-scheme="light"] .lx-dc-api .endpoint-header h5,
[data-scheme="light"] .lx-dc-api .response-title,
[data-scheme="light"] .lx-dc-api .param-name {
  color: var(--api-ink);
}

.lx-dc-api .api-block h2 i,
.lx-dc-api .api-sidebar .sidebar-header h5 i {
  color: var(--api-coral);
}

.lx-dc-api .api-block p,
.lx-dc-api .api-block ul,
.lx-dc-api .api-block ol,
.lx-dc-api .endpoint-category-desc,
.lx-dc-api .endpoint-desc,
.lx-dc-api .params-table td,
[data-scheme="light"] .lx-dc-api .api-block p,
[data-scheme="light"] .lx-dc-api .api-block ul,
[data-scheme="light"] .lx-dc-api .api-block ol,
[data-scheme="light"] .lx-dc-api .endpoint-category-desc,
[data-scheme="light"] .lx-dc-api .endpoint-desc,
[data-scheme="light"] .lx-dc-api .params-table td {
  color: var(--api-muted);
}

.lx-dc-api .api-section,
[data-scheme="light"] .lx-dc-api .api-section {
  border-color: var(--api-line);
}

/* Sidebar */

.lx-dc-api .api-sidebar,
[data-scheme="light"] .lx-dc-api .api-sidebar {
  background: var(--api-paper);
  border-right: 1px solid var(--api-line);
  box-shadow: none;
}

.lx-dc-api .api-sidebar .sidebar-header,
.lx-dc-api .api-sidebar .nav-group,
[data-scheme="light"] .lx-dc-api .api-sidebar .sidebar-header,
[data-scheme="light"] .lx-dc-api .api-sidebar .nav-group {
  border-color: var(--api-line);
}

.lx-dc-api .api-sidebar .sidebar-header h5,
[data-scheme="light"] .lx-dc-api .api-sidebar .sidebar-header h5 {
  color: var(--api-ink);
}

.lx-dc-api .api-sidebar .nav-link,
[data-scheme="light"] .lx-dc-api .api-sidebar .nav-link {
  color: var(--api-muted);
}

.lx-dc-api .api-sidebar .nav-link:hover,
.lx-dc-api .api-sidebar .nav-link.active,
[data-scheme="light"] .lx-dc-api .api-sidebar .nav-link:hover,
[data-scheme="light"] .lx-dc-api .api-sidebar .nav-link.active {
  color: var(--api-coral);
  background: color-mix(in srgb, var(--api-coral) 8%, transparent);
}

.lx-dc-api .api-sidebar .nav-link i {
  color: inherit;
}

/* Inline code & cards */

.lx-dc-api .api-block code,
[data-scheme="light"] .lx-dc-api .api-block code {
  background: color-mix(in srgb, var(--api-coral) 12%, transparent);
  color: var(--api-coral-deep);
}

.lx-dc-api .api-key-card,
.lx-dc-api .endpoint-block,
[data-scheme="light"] .lx-dc-api .api-key-card,
[data-scheme="light"] .lx-dc-api .endpoint-block {
  background: var(--api-paper);
  border: 1px solid var(--api-line);
  box-shadow: 0 12px 32px -28px rgba(42, 33, 28, 0.45);
}

.lx-dc-api .api-key-card h6,
[data-scheme="light"] .lx-dc-api .api-key-card h6 {
  color: var(--api-muted);
}

.lx-dc-api .api-key-display,
.lx-dc-api .code-inline,
[data-scheme="light"] .lx-dc-api .api-key-display,
[data-scheme="light"] .lx-dc-api .code-inline {
  background: color-mix(in srgb, var(--api-ink) 5%, var(--api-bg));
  color: var(--api-ink);
}

.lx-dc-api .api-key-display code {
  color: var(--api-coral-deep);
}

/* Endpoint method bar — was white-on-translucent (dark theme); illegible on cream */

.lx-dc-api .endpoint-method,
[data-scheme="light"] .lx-dc-api .endpoint-method {
  background: color-mix(in srgb, var(--api-ink) 4%, var(--api-bg));
  border: 1px solid var(--api-line);
}

.lx-dc-api .endpoint-method code,
[data-scheme="light"] .lx-dc-api .endpoint-method code {
  background: none;
  color: var(--api-ink);
  font-family: "Space Mono", ui-monospace, monospace;
  font-size: 0.9375rem;
  font-weight: 700;
  letter-spacing: -0.01em;
  word-break: break-all;
}

.lx-dc-api .btn-outline-coral {
  border-color: var(--api-coral);
  color: var(--api-coral-deep);
}

.lx-dc-api .btn-outline-coral:hover {
  background: var(--api-coral);
  border-color: var(--api-coral);
  color: #fff;
}

.lx-dc-api .badge.bg-success {
  background: var(--api-teal) !important;
}

/* Code panels stay dark for contrast; warm charcoal, not purple */

.lx-dc-api .code-card,
[data-scheme="light"] .lx-dc-api .code-card {
  background: var(--api-code-bg);
  border: 1px solid rgba(42, 33, 28, 0.2);
}

.lx-dc-api .code-tabs,
.lx-dc-api .code-lang,
[data-scheme="light"] .lx-dc-api .code-tabs,
[data-scheme="light"] .lx-dc-api .code-lang {
  background: rgba(255, 255, 255, 0.04);
  border-bottom-color: rgba(255, 255, 255, 0.08);
}

.lx-dc-api .code-tab.active,
.lx-dc-api .code-lang a.active {
  background: color-mix(in srgb, var(--api-coral) 22%, transparent) !important;
  color: #fff !important;
}

.lx-dc-api .btn-copy:hover {
  color: var(--api-coral);
}

/* Tables */

.lx-dc-api .params-table th,
[data-scheme="light"] .lx-dc-api .params-table th {
  background: color-mix(in srgb, var(--api-ink) 4%, var(--api-bg));
  color: var(--api-ink);
  border-color: var(--api-line);
}

.lx-dc-api .params-table td,
[data-scheme="light"] .lx-dc-api .params-table td {
  border-color: var(--api-line);
}

.lx-dc-api .param-type,
[data-scheme="light"] .lx-dc-api .param-type {
  color: var(--api-teal);
}

.lx-dc-api .endpoint-category-title a {
  color: var(--api-coral-deep);
}

.lx-dc-api .endpoint-category-title a:hover {
  color: var(--api-coral);
}

/* Alerts */

.lx-dc-api .api-block .alert-info,
[data-scheme="light"] .lx-dc-api .api-block .alert-info {
  background: color-mix(in srgb, var(--api-teal) 12%, transparent);
  color: var(--api-teal);
}

.lx-dc-api .api-block .alert-warning,
[data-scheme="light"] .lx-dc-api .api-block .alert-warning {
  background: color-mix(in srgb, var(--api-coral) 12%, transparent);
  color: var(--api-coral-deep);
}

/* Mobile toggle */

.lx-dc-api ~ .api-mobile-toggle,
body:has(.lx-dc-api) .api-mobile-toggle {
  background: var(--api-coral);
  color: #fff;
}
