/*
 * This is a manifest file that'll be compiled into application.css.
 *
 * With Propshaft, assets are served efficiently without preprocessing steps. You can still include
 * application-wide styles in this file, but keep in mind that CSS precedence will follow the standard
 * cascading order, meaning styles declared later in the document or manifest will override earlier ones,
 * depending on specificity.
 *
 * Consider organizing styles into separate files for maintainability.
 */

/* Shared dark code block — used by case studies and (via docs.css) the docs pages. */

.docs-code-block {
  margin-bottom: 1rem;
  border-radius: 0.75rem;
  background-color: #0f172a;
  box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.docs-code-block pre {
  padding: 1.25rem 1.5rem;
  overflow-x: auto;
  margin: 0;
}

.docs-code-block code {
  font-size: 0.875rem;
  line-height: 1.75rem;
  color: #cbd5e1;
  background: transparent;
  padding: 0;
  border-radius: 0;
  font-weight: 400;
}

/* Rouge syntax highlighting — dark theme matching slate-900 blocks. */

.docs-code-block .highlight .c,
.docs-code-block .highlight .c1,
.docs-code-block .highlight .cm,
.docs-code-block .highlight .cs { color: #64748b; font-style: italic; }

.docs-code-block .highlight .k,
.docs-code-block .highlight .kd,
.docs-code-block .highlight .kn,
.docs-code-block .highlight .kp,
.docs-code-block .highlight .kr,
.docs-code-block .highlight .kc { color: #c084fc; }

.docs-code-block .highlight .kt { color: #38bdf8; }

.docs-code-block .highlight .s,
.docs-code-block .highlight .s1,
.docs-code-block .highlight .s2,
.docs-code-block .highlight .sb,
.docs-code-block .highlight .sc,
.docs-code-block .highlight .sd,
.docs-code-block .highlight .sh { color: #4ade80; }

.docs-code-block .highlight .sr { color: #fb923c; }
.docs-code-block .highlight .si { color: #4ade80; }
.docs-code-block .highlight .sx { color: #4ade80; }
.docs-code-block .highlight .se { color: #fbbf24; }

.docs-code-block .highlight .na,
.docs-code-block .highlight .nb { color: #38bdf8; }

.docs-code-block .highlight .nc,
.docs-code-block .highlight .no { color: #fbbf24; }

.docs-code-block .highlight .nd { color: #38bdf8; }
.docs-code-block .highlight .ni { color: #cbd5e1; }
.docs-code-block .highlight .ne { color: #f87171; }

.docs-code-block .highlight .nf,
.docs-code-block .highlight .fm { color: #38bdf8; }

.docs-code-block .highlight .nl { color: #38bdf8; }
.docs-code-block .highlight .nn { color: #fbbf24; }

.docs-code-block .highlight .nt { color: #2dd4bf; }

.docs-code-block .highlight .nv,
.docs-code-block .highlight .vi,
.docs-code-block .highlight .vg,
.docs-code-block .highlight .vc { color: #f87171; }

.docs-code-block .highlight .o,
.docs-code-block .highlight .ow { color: #cbd5e1; }

.docs-code-block .highlight .p { color: #cbd5e1; }

.docs-code-block .highlight .m,
.docs-code-block .highlight .mi,
.docs-code-block .highlight .mf,
.docs-code-block .highlight .mh,
.docs-code-block .highlight .mo { color: #fb923c; }

.docs-code-block .highlight .ss { color: #2dd4bf; }

.docs-code-block .highlight .err { color: #f87171; }

.docs-code-block .highlight .gd { color: #f87171; }
.docs-code-block .highlight .gi { color: #4ade80; }