/* ==========================================================================
   Code blocks — terminal style panels with window chrome.
   ========================================================================== */

.code {
  border-radius: var(--radius-lg);
  border: 1px solid var(--code-border);
  background: var(--code-bg);
  overflow: hidden;
  box-shadow: var(--shadow-2);
}

.code__bar {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  padding: 0.7rem 1rem;
  border-bottom: 1px solid rgba(255, 255, 255, 0.07);
  background: rgba(255, 255, 255, 0.03);
}

.code__dot {
  width: 0.65rem;
  height: 0.65rem;
  border-radius: var(--radius-full);
  background: rgba(255, 255, 255, 0.14);
}

.code__dot:nth-child(1) { background: rgba(248, 113, 113, 0.55); }
.code__dot:nth-child(2) { background: rgba(251, 191, 36, 0.55); }
.code__dot:nth-child(3) { background: rgba(52, 211, 153, 0.55); }

.code__title {
  margin-left: 0.5rem;
  font-size: var(--text-xs);
  color: rgba(255, 255, 255, 0.45);
  font-family: var(--font-mono);
}

.code pre {
  margin: 0;
  padding: 1.25rem 1.4rem;
  overflow-x: auto;
  font-size: var(--text-sm);
  line-height: 1.7;
  color: #d7deeb;
}

.code .c-prompt { color: var(--cyan-400); user-select: none; }
.code .c-cmd    { color: #e8ecf4; }
.code .c-flag   { color: var(--accent-300); }
.code .c-str    { color: #7ee2a8; }
.code .c-comment{ color: rgba(255, 255, 255, 0.35); font-style: italic; }
.code .c-key    { color: var(--accent-300); }
.code .c-val    { color: #7ee2a8; }
.code .c-ok     { color: #7ee2a8; }
.code .c-dim    { color: rgba(255, 255, 255, 0.45); }