/* Lightweight lexxy-content styles for public pages.
   Covers rich text output without loading the full lexxy editor bundle. */

:where(.lexxy-content) {
  color: inherit;
  line-height: 1.6;

  h1, h2, h3, h4, h5, h6 {
    display: block;
    font-weight: bold;
    margin-block: 0 1rem;
    overflow-wrap: break-word;
    text-wrap: balance;
  }

  h1 { font-size: 2rem; }
  h2 { font-size: 1.5rem; }
  h3 { font-size: 1.25rem; }
  h4 { font-size: 1rem; }
  h5 { font-size: 0.875rem; }
  h6 { font-size: 0.75rem; }

  p, ul, ol, dl, blockquote, figure {
    margin-block: 0 1rem;
    overflow-wrap: break-word;
  }

  a {
    color: oklch(57% 0.19 260);
    text-decoration: underline;
  }

  blockquote {
    border-inline-start: 0.25em solid #d4d4d8;
    font-style: italic;
    margin: 1rem 0;
    padding: 0.5lh 2ch;

    p:last-child {
      margin-block-end: 0;
    }
  }

  p:empty {
    display: none;
  }

  img, video {
    inline-size: auto;
    margin-inline: auto;
    max-inline-size: 100%;
    height: auto;
  }

  code, pre {
    background-color: #f5f5f4;
    border-radius: 0.5ch;
    font-family: ui-monospace, "Menlo", "Monaco", Consolas, monospace;
    font-size: 0.9em;
    padding: 0.25ch 0.5ch;
  }

  pre, code[data-language] {
    display: block;
    margin-block: 0 1rem;
    overflow-x: auto;
    padding: 1ch;
    tab-size: 2;
    white-space: pre;
  }

  ul, ol {
    padding-inline-start: 1.5em;
  }

  li {
    list-style-type: disc;
  }

  li.lexxy-nested-listitem {
    list-style-type: none;

    ol, ul {
      margin: 0;
    }
  }

  > :last-child {
    margin-block-end: 0;
  }

  /* Tables */
  :where(.lexxy-content__table-wrapper) {
    margin: 0;
    margin-block: 1ch;
    overflow-x: auto;
  }

  table {
    border-collapse: collapse;
    border-spacing: 0;
    inline-size: 100%;

    th, td {
      border: 1px solid #d4d4d8;
      padding: 1ch;
      text-align: start;

      *:last-child {
        margin-block-end: 0;
      }
    }

    th, td.lexxy-content__table-cell--header {
      background-color: #f5f5f4;
      font-weight: bold;
    }
  }
}

/* Attachments */
:where(.attachment) {
  display: block;
  inline-size: fit-content;
  max-inline-size: 100%;
  margin-inline: auto;
  text-align: center;
}

:where(.attachment--preview) {
  border-radius: 0.5ch;

  img, video {
    display: block;
    margin-inline: auto;
    max-inline-size: 100%;
    height: auto;
  }
}

:where(.attachment__caption) {
  color: #78716c;
  font-size: 0.875rem;
  margin-block-start: 1ch;
}

:where(.attachment--file) {
  align-items: center;
  display: flex;
  gap: 1ch;
  inline-size: auto;
}

/* Horizontal divider */
:where(.horizontal-divider) {
  margin: 0;
  margin-block-end: 0.5em;
  padding: 1.5em 0 0.5em;

  hr {
    border: 0;
    border-block-end: 1px solid currentColor;
    inline-size: 20%;
    margin: 0;
  }
}
