/* ══════════════════════════════════════════
   PROMPTS — /prompts, /prompts/<topic>, /prompts/<platform>
   Loaded after site.css and guides.css (same reading column, crumbs, byline, FAQ and CTA).
   Source: docs-generator/static/prompts.css, copied by docs-generator/src/prompts.ts.
   ══════════════════════════════════════════ */

.visually-hidden {
  position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px;
  overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ── Prompt cards: ruled entries in the column, not boxes ── */
.prompt-list { border-bottom: 1px solid var(--rule-light); }

.prompt-card {
  padding: 32px 0 28px;
  border-top: 1px solid var(--rule-light);
  scroll-margin-top: 24px;
}
.prompt-list .prompt-card:first-child { border-top: 3px solid var(--ox); }
.prompt-card:target {
  background: linear-gradient(var(--peach), var(--peach)) no-repeat left top / 4px 100%;
  padding-left: 20px;
}

.prompt-platform {
  font-family: var(--mono);
  font-size: 13px;
  color: var(--ink-soft);
}
.guide-body a.prompt-platform { color: var(--ink-soft); text-decoration-color: var(--rule-light); }
.guide-body a.prompt-platform:hover { color: var(--ox); text-decoration-color: var(--coral); }

.guide-body .prompt-card h3 {
  margin: 6px 0 6px;
  font-size: 21px;
  line-height: 1.3;
  letter-spacing: -0.01em;
  color: var(--ox);
}

.guide-body .prompt-get { margin-bottom: 14px; }

.prompt-text {
  margin: 0 0 14px;
  padding: 16px 18px;
  font-family: var(--mono);
  font-size: 14px;
  line-height: 1.65;
  color: var(--ink);
  white-space: pre-wrap;
  overflow-wrap: anywhere;
  background: rgba(242, 214, 206, 0.32);
  border: 1px solid var(--rule-light);
  border-radius: 6px;
}
.prompt-text mark {
  background: var(--peach);
  color: var(--ox);
  padding: 0 3px;
  border-radius: 3px;
}
.prompt-text::selection, .prompt-text *::selection { background: var(--peach); color: var(--ox); }

.prompt-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 20px;
  margin-bottom: 18px;
}
.prompt-copy {
  font: 500 15px/1 var(--sans);
  color: var(--ox);
  background: transparent;
  border: 1px solid var(--ox);
  border-radius: 6px;
  padding: 10px 14px;
  cursor: pointer;
  transition: background-color .2s var(--ease), color .2s var(--ease);
}
.prompt-copy:hover { background: var(--ox); color: var(--chalk); }
.prompt-copy:focus-visible { outline: 2px solid var(--ox); outline-offset: 3px; }
.prompt-copy[data-copied] { background: var(--peach); color: var(--ox); border-color: var(--peach); }
.guide-body .prompt-open { font-weight: 500; font-size: 15px; }

.prompt-meta {
  display: grid;
  gap: 10px 32px;
  margin: 0;
  font-size: 15px;
  line-height: 1.55;
}
@media (min-width: 720px) {
  .prompt-meta { grid-template-columns: 1fr 1fr; }
}
.prompt-meta dt {
  font-family: var(--mono);
  font-size: 12px;
  color: var(--ink-soft);
  margin-bottom: 2px;
}
.prompt-meta dd { margin: 0; color: var(--ink); }
.prompt-meta code { font-size: 13px; }

/* ── Index lists (hub, platform pages) ── */
.guide-body ol.prompt-index {
  list-style: none;
  padding: 0;
  border-top: 3px solid var(--ox);
}
.prompt-index li {
  margin: 0;
  padding: 18px 0;
  border-bottom: 1px solid var(--rule-light);
}
.guide-body .prompt-index a {
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.01em;
  text-decoration-color: var(--rule-light);
}
.guide-body .prompt-index a:hover { text-decoration-color: var(--coral); }
.guide-body .prompt-index p { margin: 4px 0 0; font-size: 16px; color: var(--ink-soft); }
.prompt-index-topic {
  font-family: var(--mono);
  font-size: 12px;
  white-space: nowrap;
  margin-left: 6px;
}

.guide-body ul.prompt-platforms {
  list-style: none;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}
.prompt-platforms li { margin: 0; }
.guide-body .prompt-platforms a {
  display: inline-block;
  padding: 8px 14px;
  border: 1px solid var(--rule-light);
  border-radius: 999px;
  text-decoration: none;
  font-size: 16px;
}
.guide-body .prompt-platforms a:hover { border-color: var(--ox); }

/* ── Sibling topics and method note ── */
.guide-body .prompts-siblings h2,
.guide-body .prompts-method h2 { font-size: 20px; margin-top: 40px; }
.prompts-siblings ul { list-style: none; padding: 0; }
.prompts-siblings li { margin: 0; padding: 8px 0; border-bottom: 1px solid var(--rule-light); }
.prompts-method p { font-size: 15px; color: var(--ink-soft); }

@media (max-width: 600px) {
  .prompt-actions { flex-direction: column; align-items: stretch; }
  .prompt-copy { width: 100%; padding: 12px 14px; }
  .guide-body .prompt-open { text-align: center; padding: 6px 0; }
}

/* The closing "Use the Hopkin MCP for … (hopkin.ai)" sentence: part of the prompt, set back a step. */
.prompt-source { color: var(--ink-soft); }
.prompt-text .prompt-source a { color: inherit; text-decoration-color: var(--coral); }
