/* Overrides for what Payload's rich text emits that the site's own stylesheet
   never had to describe.
 *
 * `site.css` is the source for everything else and is synced from `web/`, so
 * nothing that belongs there is repeated here. This file is only the join.
 */

/* Lexical wraps a table in its own container and writes inline borders on
   every cell. The site's table look is `.post table` — one hairline per row,
   monospace in the first and last column — so the container is made to behave
   like `.post .rows` and the inline borders are taken off again. */
.post .lexical-table-container {
  overflow-x: auto;
  margin: 1.5rem 0;
}
.post table.lexical-table {
  width: 100%;
  border-collapse: collapse;
}
.post .lexical-table-cell {
  border: 0 !important;
  border-bottom: 1px solid var(--rule) !important;
}

/* A copy line is clickable here — the landing's `site.js`, which adds the
   button, is 83KB this page has no other use for. */
.post .paste {
  cursor: pointer;
  position: relative;
}
.post .paste[data-copied]::after {
  content: 'copied';
  position: absolute;
  right: 0.7rem;
  top: 50%;
  transform: translateY(-50%);
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.55;
}

/* Payload names its own wrapper; the site styles `.post > *`. */
.post .payload-richtext > :first-child {
  margin-top: 0;
}

/* A named file listing. The site had no multi-line code idiom — `.paste` is
   one line with a copy button — so this is the one addition, built out of the
   same tokens rather than a new palette. */
.post figure.file {
  margin: 1.5rem 0;
  border: 1px solid var(--rule);
  border-radius: 6px;
  background: var(--panel);
  overflow: hidden;
}
.post figure.file figcaption {
  font-family: var(--mono);
  font-size: 10.5px;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  opacity: 0.55;
  padding: 0.55rem 0.8rem;
  border-bottom: 1px solid var(--rule);
}
.post figure.file pre {
  margin: 0;
  padding: 0.85rem 0.8rem;
  overflow-x: auto;
}
.post figure.file code {
  font-family: var(--mono);
  font-size: 0.82rem;
  line-height: 1.7;
  white-space: pre;
  background: none;
  padding: 0;
}
