/* Shared styles for the docs pages. Each environment's index.html sets the
   accent palette (see :root in docs/index.html and docs/stage/index.html):
   --pinc-accent      the fill colour (buttons, focus, response accent)
   --pinc-accent-ink  text ON an accent fill
   --pinc-accent-text accent-coloured text on white (notes, hovers)
   --pinc-run         resting tint of the Run button (its bar carries opacity .7) */

body {
  margin: 0;
  padding: 0;
}

/* Hide the "API docs by Redocly" attribution. Verified empirically on
   redoc@2.5.3: it renders as <a href="https://redocly.com/redoc/"> at
   the bottom of the sidebar menu; !important is required because
   Redoc's styled-components sheet (display: flex) is injected after
   this one and would win the cascade. */
a[href*="redocly.com/redoc"] {
  display: none !important;
}

/* Hide the big "Pinnacle API (1.0.0)" heading. Verified empirically on
   redoc@2.5.3: the info section renders as <div class="api-info"> with
   the title as its only <h1>; the description is a sibling of the h1,
   so it stays visible. */
.api-info h1 {
  display: none;
}

/* Credential form, mounted into the #pinc-try marker that the backend
   embeds in info.description. Styled to sit in Redoc's typography. */
#pinc-try .pinc-row {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 4px 0 8px;
}
#pinc-try input {
  padding: 7px 10px;
  border: 1px solid #d5d5d5;
  border-radius: 4px;
  font-size: 14px;
  font-family: inherit;
  width: 150px;
}
#pinc-try input:focus {
  outline: none;
  border-color: var(--pinc-accent);
}
#pinc-try button {
  padding: 8px 16px;
  border: none;
  border-radius: 4px;
  background: var(--pinc-accent);
  color: var(--pinc-accent-ink);
  font-size: 14px;
  font-weight: 600;
  font-family: inherit;
  cursor: pointer;
}
#pinc-try button:disabled {
  opacity: 0.6;
  cursor: default;
}
#pinc-try .pinc-status {
  font-size: 14px;
}
#pinc-try .pinc-status.ok {
  color: #1d8348;
}
#pinc-try .pinc-status.err {
  color: #c0392b;
}

/* Environment note (the stage page sets one via PINC_DOCS.noteHtml). */
#pinc-try .pinc-env-note {
  margin: 2px 0 10px;
  font-size: 13px;
  color: var(--pinc-accent-text);
}
#pinc-try .pinc-env-note a {
  color: inherit;
}

/* "Run" button, injected next to Redoc's Copy button in every curl
   sample's button bar (see injectRunButtons for the anchor). The bar
   itself carries opacity: .7, so the resting tint is lightened. */
.pinc-run {
  padding: 2px 10px;
  border: 0;
  background: transparent;
  color: var(--pinc-run);
  font-size: 14px;
  font-family: inherit;
  cursor: pointer;
}
.pinc-run:hover {
  color: var(--pinc-accent);
}

/* Blur for the junk credentials shown in code samples. The span only
   ever contains random [a-zA-Z0-9] junk — the real value is never in
   the DOM — so the blur is presentation, not the protection. Syntax
   color is inherited from the Prism token span the junk sits inside. */
.pinc-blur {
  filter: blur(3.5px);
  letter-spacing: 1px;
  /* Unselectable: a hand-made selection would otherwise copy the junk
     (or a fragment of it, which the copy rewrite cannot map back).
     The copy listener refills the skipped credentials, so a manual
     copy still yields a working command. */
  -webkit-user-select: none;
  user-select: none;
}

/* Live-response panel rendered under a sample after Run. Dark to match
   Redoc's right column; the accent stays the environment's. */
.pinc-resp {
  margin-top: 10px;
  border: 1px solid rgba(255, 255, 255, 0.14);
  border-left: 3px solid var(--pinc-accent);
  border-radius: 4px;
  background: #11171a;
  font-family: Courier, monospace;
  font-size: 13px;
}
.pinc-resp-head {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  padding: 6px 10px;
  color: #8be9a8;
}
.pinc-resp-head.neutral {
  color: #d5dee5;
}
.pinc-resp-head.err {
  color: #ff8f80;
  background: rgba(255, 60, 40, 0.08);
}
.pinc-resp-close {
  background: none;
  border: 0;
  color: rgba(255, 255, 255, 0.55);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  padding: 0 2px;
}
.pinc-resp-close:hover {
  color: #fff;
}
.pinc-resp pre {
  margin: 0;
  padding: 10px;
  border-top: 1px solid rgba(255, 255, 255, 0.08);
  max-height: 300px;
  overflow: auto;
  color: #fff;
  white-space: pre-wrap;
  word-break: break-word;
}