/* Code: pre, code, kbd, samp */

pre,
code,
kbd,
samp {
  --pico-font-family: var(--pico-font-family-monospace);
  border-radius: var(--pico-border-radius);
  background: var(--pico-code-background-color);
  color: var(--pico-code-color);
  font-weight: var(--pico-font-weight);
  font-size: 0.875em;
  font-family: var(--pico-font-family);
  line-height: initial;
}

kbd {
  --pico-font-weight: 500;
}

pre code,
pre samp {
  font-size: inherit;
  font-family: inherit;
}

code,
kbd,
samp {
  display: inline;
  padding: 0.125em 0.25em;
  border-radius: calc(var(--pico-border-radius) * 0.75);
  line-height: inherit;
  -webkit-box-decoration-break: clone;
  box-decoration-break: clone;
}

pre {
  display: block;
  margin-bottom: var(--pico-spacing);
  overflow: auto;

  & > code,
  & > samp {
    display: block;
    padding: var(--pico-spacing);
    background: none;
    line-height: var(--pico-line-height);
  }
}

kbd {
  padding: 0.2em 0.45em;
  background-color: var(--pico-code-kbd-background-color);
  color: var(--pico-code-kbd-color);
  vertical-align: baseline;
}