/* Chroma -> Octopress bridge.
 *
 * screen.css is frozen byte-for-byte from the Octopress build and styles the
 * Pygments line-number table: td.gutter + pre.line-numbers + span.line-number.
 * Chroma emits div.chroma > table.lntable > td.lntd, with span.lnt for the
 * numbers, so the gutter loses its background, border and padding and the code
 * column picks up Chroma's own spacing.
 *
 * These rules map Chroma's classes onto the same appearance. Token colours
 * already match: Chroma uses Pygments' class names.
 *
 * Delete this file when the styles are rewritten in Phase 9.
 */

/* Chroma's extra wrapper must not introduce a box of its own. */
figure.code .highlight .chroma {
  background: none;
  border: 0;
  margin: 0;
  padding: 0;
  border-radius: 0;
}

figure.code .highlight .lntable {
  margin-bottom: 0;
  border: 0;
  width: 100%;
  border-collapse: collapse;
}

figure.code .highlight .lntable td.lntd {
  padding: 0;
  border: 0;
  vertical-align: top;
}

/* Gutter cell: mirror .gutter + pre.line-numbers. */
figure.code .highlight .lntable td.lntd:first-child {
  width: 1%;
  white-space: nowrap;
}

figure.code .highlight .lntable td.lntd:first-child pre {
  text-align: right;
  font-size: 13px;
  line-height: 1.45em;
  background: #073642 url('/images/noise.png') top left !important;
  border: 0;
  border-right: 1px solid #00232c !important;
  -moz-box-shadow: #083e4b -1px 0 inset;
  -webkit-box-shadow: #083e4b -1px 0 inset;
  box-shadow: #083e4b -1px 0 inset;
  text-shadow: #021014 0 -1px;
  padding: .8em !important;
  margin: 0;
  border-radius: 0;
  overflow: visible;
}

/* screen.css styles `.highlight code` with padding, a dark background and
 * overflow:scroll — meant for the code column. Octopress's gutter was a bare
 * <pre class="line-numbers"> with no <code>, so it never matched. Chroma wraps
 * the numbers in <code>, which double-padded the gutter (pushing the numbers
 * ~10px below their lines) and added a stray scrollbar strip. Undo it here. */
figure.code .highlight .lntable td.lntd:first-child code {
  display: block;
  padding: 0 !important;
  margin: 0;
  background: none !important;
  overflow: visible !important;
  line-height: inherit;
}

figure.code .highlight .lntable td.lntd:first-child .lnt {
  color: #586e75 !important;
  margin: 0;
  padding: 0;
  display: inline;
  -webkit-user-select: none;
  user-select: none;
}

/* Code cell: mirror td.code. */
figure.code .highlight .lntable td.lntd:last-child {
  width: 100%;
}

figure.code .highlight .lntable td.lntd:last-child pre {
  margin: 0;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}