/**
 * RichMarkdown CSS
 * Companion stylesheet for richmd.js
 * Override defaults via CSS custom properties on :root or any ancestor element.
 */

/* ─── Variables ──────────────────────────────────────────────────────────────── */

:root {
  --mdw-font-family:        inherit;
  --mdw-font-size:          1rem;
  --mdw-line-height:        1.5em;
  --mdw-color:              inherit;

  --mdw-heading-font:       inherit;
  --mdw-heading-weight:     bold;
  --mdw-h1-size:            2em;
  --mdw-h2-size:            1.5em;
  --mdw-h3-size:            1.25em;
  --mdw-h4-size:            1.1em;
  --mdw-h5-size:            1em;
  --mdw-h6-size:            0.9em;

  --mdw-code-font:          monospace;
  --mdw-code-bg:            rgba(0,0,0,0.06);
  --mdw-code-radius:        3px;
  --mdw-pre-bg:             rgba(0,0,0,0.04);
  --mdw-pre-radius:         4px;
  --mdw-pre-padding:        1em;

  --mdw-blockquote-border:  3px solid currentColor;
  --mdw-blockquote-opacity: 0.6;
  --mdw-blockquote-padding: 0 0 0 1em;

  --mdw-link-color:         inherit;
  --mdw-link-decoration:    underline;

  --mdw-hr-border:          1px solid currentColor;
  --mdw-hr-opacity:         0.2;
  --mdw-hr-margin:          1.5em 0;

  --mdw-table-border:       1px solid rgba(0,0,0,0.15);
  --mdw-table-cell-padding: 0.4em 0.75em;
  --mdw-th-bg:              rgba(0,0,0,0.05);

  --mdw-task-gap:           0.4em;
  --mdw-task-done-opacity:  0.5;

  --mdw-collapse-bg-opacity: 0.1;

  --mdw-en-size:            0.85em;
  --mdw-en-opacity:         0.75;
  --mdw-en-divider-margin:  2em 0 1em;
}

/* ─── Paragraphs ─────────────────────────────────────────────────────────────── */

.mdw-p {
  margin: 0;
  padding: 0;
  font-family: var(--mdw-font-family);
  font-size: var(--mdw-font-size);
  line-height: var(--mdw-line-height);
  color: var(--mdw-color);
}

.mdw-empty {
  display: block;
  height: var(--mdw-line-height);
}

/* ─── Headings ───────────────────────────────────────────────────────────────── */

.mdw-h1, .mdw-h2, .mdw-h3,
.mdw-h4, .mdw-h5, .mdw-h6 {
  font-family: var(--mdw-heading-font);
  font-weight: var(--mdw-heading-weight);
  line-height: 1.2;
  margin: 0;
  padding: 0;
}

.mdw-h1 { font-size: var(--mdw-h1-size); }
.mdw-h2 { font-size: var(--mdw-h2-size); }
.mdw-h3 { font-size: var(--mdw-h3-size); }
.mdw-h4 { font-size: var(--mdw-h4-size); }
.mdw-h5 { font-size: var(--mdw-h5-size); }
.mdw-h6 { font-size: var(--mdw-h6-size); }

/* ─── Inline formatting ──────────────────────────────────────────────────────── */

.mdw-b  { font-weight: bold; }
.mdw-i  { font-style: italic; }
.mdw-u  { text-decoration: underline; }
.mdw-s  { text-decoration: line-through; }
.mdw-del { text-decoration: line-through; color: var(--mdw-del-color, #e06c75); background: var(--mdw-del-bg, rgba(224, 108, 117, 0.1)); }
.mdw-ins { text-decoration: none; color: var(--mdw-ins-color, #61afef); background: var(--mdw-ins-bg, rgba(97, 175, 239, 0.1)); }
.mdw-mark { background: var(--mdw-mark-bg, rgba(229, 192, 123, 0.3)); }
.mdw-sup, .mdw-sub { font-size: 0.75em; line-height: 0; position: relative; vertical-align: baseline; }
.mdw-sup { top: -0.5em; }
.mdw-sub { bottom: -0.25em; }

/* ─── Code ───────────────────────────────────────────────────────────────────── */

.mdw-code {
  font-family: var(--mdw-code-font);
  font-size: 0.9em;
  background: var(--mdw-code-bg);
  border-radius: var(--mdw-code-radius);
  padding: 0.1em 0.3em;
}

.mdw-pre {
  font-family: var(--mdw-code-font);
  font-size: 0.9em;
  background: var(--mdw-pre-bg);
  border-radius: var(--mdw-pre-radius);
  padding: var(--mdw-pre-padding);
  overflow-x: auto;
  margin: 0;
  white-space: pre;
}

.mdw-pre .mdw-code {
  background: none;
  border-radius: 0;
  padding: 0;
  font-size: inherit;
}

/* ─── Links ──────────────────────────────────────────────────────────────────── */

.mdw-a {
  color: var(--mdw-link-color);
  text-decoration: var(--mdw-link-decoration);
}

.mdw-anchor {
  font-size: 0.75em;
  color: var(--mdw-anchor-color, rgba(128,128,128,0.6));
  text-decoration: none;
  font-family: var(--mdw-code-font);
  vertical-align: super;
}

/* ─── Blockquote ─────────────────────────────────────────────────────────────── */

.mdw-blockquote {
  margin: 0;
  padding: var(--mdw-blockquote-padding);
  border-left: var(--mdw-blockquote-border);
  opacity: var(--mdw-blockquote-opacity);
  font-style: italic;
}

/* ─── Alignment ─────────────────────────────────────────────────────────────── */

.mdw-align-center { text-align: center; }
.mdw-align-right  { text-align: right; }

/* ─── Horizontal rule ────────────────────────────────────────────────────────── */

.mdw-hr {
  border: none;
  border-top: var(--mdw-hr-border);
  opacity: var(--mdw-hr-opacity);
  margin: var(--mdw-hr-margin);
}

/* ─── Lists ──────────────────────────────────────────────────────────────────── */

.mdw-ul, .mdw-ol {
  margin: 0;
  padding-left: 1.5em;
}

.mdw-li {
  line-height: var(--mdw-line-height);
  margin: 0;
  padding: 0;
}

/* ─── Task lists ─────────────────────────────────────────────────────────────── */

.mdw-task, .mdw-task-done {
  margin: 0;
  padding: 0;
  display: flex;
  align-items: baseline;
  gap: var(--mdw-task-gap);
  line-height: var(--mdw-line-height);
  list-style: none;
}

.mdw-task::before {
  content: "☐";
  flex-shrink: 0;
}

.mdw-task.mdw-task-done::before {
  content: "☑";
}

.mdw-task.mdw-task-done {
  opacity: var(--mdw-task-done-opacity);
  text-decoration: line-through;
}

/* ─── Tables ─────────────────────────────────────────────────────────────────── */

.mdw-table {
  border-collapse: collapse;
  width: 100%;
  margin: 0;
  font-size: var(--mdw-font-size);
}

.mdw-caption {
  font-weight: bold;
  margin-bottom: 0.5em;
  text-align: left;
}

/* PM schema uses data-caption attr (content hole can't have siblings) */
.mdw-table[data-caption]::before {
  content: attr(data-caption);
  display: table-caption;
  caption-side: top;
  font-weight: bold;
  margin-bottom: 0.5em;
  text-align: left;
}

.mdw-th, .mdw-td {
  border: var(--mdw-table-border);
  padding: var(--mdw-table-cell-padding);
  text-align: left;
  vertical-align: top;
}

.mdw-th {
  background: var(--mdw-th-bg);
  font-weight: bold;
}

/* Table styles */
.mdw-table-layout,
.mdw-table-layout .mdw-th,
.mdw-table-layout .mdw-td {
  border: none;
}
.mdw-table-layout .mdw-th {
  background: none;
  font-weight: normal;
}

.mdw-table-striped .mdw-th {
  background: var(--mdw-th-bg);
}
.mdw-table-striped tbody tr:nth-child(even) .mdw-td {
  background: rgba(0,0,0,0.03);
}

/* ─── Collapse ───────────────────────────────────────────────────────────────── */

.mdw-collapse {
  margin: 0;
}

.mdw-collapse summary {
  list-style: none;
  cursor: pointer;
  user-select: none;
}

.mdw-collapse summary::-webkit-details-marker {
  display: none;
}

.mdw-collapse-summary::before {
  content: "";
  display: inline-block;
  width: 1.8em;
  height: 1em;
  margin-right: 0.4em;
  vertical-align: middle;
  background-color: currentColor;
  -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 19'%3E%3Cg transform='translate(-8.44 -194.91)'%3E%3Cpath opacity='0.15' d='M9.57 204.44l1.06-7.41 14.81-.92 16.27 1.17 1.2 7.06-1.13 7.24-16.19 1.06-14.59-1.24z'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='0.6' d='M9.57 204.44l1.06-7.41 14.81-.92 16.27 1.17 1.2 7.06-1.13 7.24-16.19 1.06-14.59-1.24z'/%3E%3Cpath d='M13.35 212.9c-2.48-.02-3.84-1.3-3.86-3.6-.03-2.3 0-8.13-.05-9.67-.04-1.54 1.23-3.69 3.6-3.68 2.37.01 25.09-.04 26.8-.05 1.71-.01 3.6 1.33 3.58 3.01-.01 1.68.02 7.36.01 10.82.04 2.3-1.93 3.16-4.03 3.16-2.11 0-23.57.03-26.05.01zm28.38-12.59c-.03-1.42-.16-2.8-3.15-2.82-2.99-.02-22.69-.03-24.86-.02-2.17.01-2.53.78-2.55 2.96-.02 2.19.02 6.23-.03 8.28-.05 2.06 1.02 2.47 2.84 2.52 1.82.05 15.39.05 24.99.01 1.86-.01 2.71-.64 2.72-2.31 0-1.67.08-5.93.03-8.64zm-28.51 9.42c-.03-.03-.06-1.48-.06-3.21 0-2.34.03-3.18.1-3.25.14-.14 1.04-.13 1.16.01.07.08.09 1.01.07 3.29l-.02 3.17-.6.02c-.33.01-.62 0-.65-.03zm4.55-.41c-.04-.06-.63-1.24-1.39-2.86-.96-2.06-1.37-3.02-1.35-3.18.02-.18.12-.28.44-.46.5-.27 1.39-1.16 1.59-1.6.16-.35.47-.52.84-.44.29.06 6.23 2.63 6.5 2.81.29.14.15.26.05.52-.08.21-.21.47-.29.56-.14.17-.17.16-3.43-1.26-1.81-.79-3.33-1.42-3.37-1.4-.04.01 1.26 1.26 2.89 2.77 1.63 1.51 2.56 2.42 2.56 2.45 0 .02-.16.23-.35.46-.22.26-.41.41-.5.39-.08-.01-1-.85-2.55-2.28-1.54-1.43-2.86-2.63-2.92-2.66-.07-.04-.11-.03-.11.04 0 .06.61 1.39 1.34 2.95.73 1.57 1.26 2.69 1.24 2.74-.03.09-.9.57-1.03.54-.12-.03-.11-.05-.15-.1zm10.31-3.76c-1.4-.5-.82-2.79.71-2.26 1.53.53.7 2.72-.71 2.26zm4.9-.08c-1.4-.5-.82-2.79.71-2.26 1.53.53.7 2.72-.71 2.26zm5.07 0c-1.4-.5-.82-2.79.71-2.26 1.53.53.7 2.72-.71 2.26zm-24.85-4.19c-.03-.07-.05-.45-.05-.85 0-1.22.4-1.61 1.63-1.61 1.01 0 .99-.01.99.71 0 .7-.01.71-.77.71h-.5v.45c0 .7-.02.72-.68.72-.45 0-.59-.03-.63-.13zm4.36-1.14c-.14-.14-.13-1.11.01-1.23.08-.07 1.23-.09 4.12-.07l4.01.02v.67.67l-4.02.02c-3.06.02-4.04 0-4.12-.08z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 36 19'%3E%3Cg transform='translate(-8.44 -194.91)'%3E%3Cpath opacity='0.15' d='M9.57 204.44l1.06-7.41 14.81-.92 16.27 1.17 1.2 7.06-1.13 7.24-16.19 1.06-14.59-1.24z'/%3E%3Cpath fill='none' stroke='%23000' stroke-width='0.6' d='M9.57 204.44l1.06-7.41 14.81-.92 16.27 1.17 1.2 7.06-1.13 7.24-16.19 1.06-14.59-1.24z'/%3E%3Cpath d='M13.35 212.9c-2.48-.02-3.84-1.3-3.86-3.6-.03-2.3 0-8.13-.05-9.67-.04-1.54 1.23-3.69 3.6-3.68 2.37.01 25.09-.04 26.8-.05 1.71-.01 3.6 1.33 3.58 3.01-.01 1.68.02 7.36.01 10.82.04 2.3-1.93 3.16-4.03 3.16-2.11 0-23.57.03-26.05.01zm28.38-12.59c-.03-1.42-.16-2.8-3.15-2.82-2.99-.02-22.69-.03-24.86-.02-2.17.01-2.53.78-2.55 2.96-.02 2.19.02 6.23-.03 8.28-.05 2.06 1.02 2.47 2.84 2.52 1.82.05 15.39.05 24.99.01 1.86-.01 2.71-.64 2.72-2.31 0-1.67.08-5.93.03-8.64zm-28.51 9.42c-.03-.03-.06-1.48-.06-3.21 0-2.34.03-3.18.1-3.25.14-.14 1.04-.13 1.16.01.07.08.09 1.01.07 3.29l-.02 3.17-.6.02c-.33.01-.62 0-.65-.03zm4.55-.41c-.04-.06-.63-1.24-1.39-2.86-.96-2.06-1.37-3.02-1.35-3.18.02-.18.12-.28.44-.46.5-.27 1.39-1.16 1.59-1.6.16-.35.47-.52.84-.44.29.06 6.23 2.63 6.5 2.81.29.14.15.26.05.52-.08.21-.21.47-.29.56-.14.17-.17.16-3.43-1.26-1.81-.79-3.33-1.42-3.37-1.4-.04.01 1.26 1.26 2.89 2.77 1.63 1.51 2.56 2.42 2.56 2.45 0 .02-.16.23-.35.46-.22.26-.41.41-.5.39-.08-.01-1-.85-2.55-2.28-1.54-1.43-2.86-2.63-2.92-2.66-.07-.04-.11-.03-.11.04 0 .06.61 1.39 1.34 2.95.73 1.57 1.26 2.69 1.24 2.74-.03.09-.9.57-1.03.54-.12-.03-.11-.05-.15-.1zm10.31-3.76c-1.4-.5-.82-2.79.71-2.26 1.53.53.7 2.72-.71 2.26zm4.9-.08c-1.4-.5-.82-2.79.71-2.26 1.53.53.7 2.72-.71 2.26zm5.07 0c-1.4-.5-.82-2.79.71-2.26 1.53.53.7 2.72-.71 2.26zm-24.85-4.19c-.03-.07-.05-.45-.05-.85 0-1.22.4-1.61 1.63-1.61 1.01 0 .99-.01.99.71 0 .7-.01.71-.77.71h-.5v.45c0 .7-.02.72-.68.72-.45 0-.59-.03-.63-.13zm4.36-1.14c-.14-.14-.13-1.11.01-1.23.08-.07 1.23-.09 4.12-.07l4.01.02v.67.67l-4.02.02c-3.06.02-4.04 0-4.12-.08z'/%3E%3C/g%3E%3C/svg%3E") no-repeat center / contain;
  transition: transform 0.15s;
}

.mdw-collapse[open] .mdw-collapse-summary::before {
  transform: rotate(90deg);
}

.mdw-collapse-body {
  padding-left: 1.2em;
  display: none;
}

.mdw-collapse[open] > .mdw-collapse-body {
  display: block;
}

/* ─── Endnotes ──────────────────────────────────────────────────────────────── */

.mdw-en-ref {
  text-decoration: none;
  font-size: 0.75em;
  vertical-align: super;
}

.mdw-endnotes {
  font-size: var(--mdw-en-size);
  opacity: var(--mdw-en-opacity);
}

.mdw-en {
  margin: 0;
  padding: 0;
  line-height: var(--mdw-line-height);
}

/* In WYSIWYG, PM toDOM only outputs the content hole — use pseudo-elements
   to display the endnote number and return arrow visually. */
.mdw-en[data-en]::before {
  content: attr(data-en);
  font-size: 0.75em;
  vertical-align: super;
  font-weight: bold;
  margin-right: 0.3em;
}

.mdw-en[data-en]::after {
  content: ' \21A9';
  font-size: 0.85em;
  opacity: 0.5;
  margin-left: 0.3em;
}

.mdw-en-back {
  text-decoration: none;
  margin-left: 0.3em;
}

.mdw-hr.mdw-en-separator {
  margin: var(--mdw-en-divider-margin);
  width: 30%;
  margin-left: 0;
}

/* ─── Callout ────────────────────────────────────────────────────────────────── */

.mdw-callout {
  display: block;
  padding: 0.75em 1em;
  margin: 0.5em 0;
  background: var(--mdw-callout-bg, rgba(0,0,0,0.04));
  border-left: 3px solid var(--mdw-callout-border, currentColor);
  border-radius: var(--mdw-code-radius);
}

/* Block callouts show their type as a label */
div.mdw-callout::before {
  display: block;
  font-weight: bold;
  font-size: 0.85em;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  margin-bottom: 0.3em;
}

.mdw-callout-note    { --mdw-callout-border: #4a90d9; --mdw-callout-bg: rgba(74,144,217,0.08); }
.mdw-callout-note::before    { content: "Note";    color: #4a90d9; }

.mdw-callout-warning { --mdw-callout-border: #e0a030; --mdw-callout-bg: rgba(224,160,48,0.08); }
.mdw-callout-warning::before { content: "Warning"; color: #e0a030; }

.mdw-callout-tip     { --mdw-callout-border: #50b060; --mdw-callout-bg: rgba(80,176,96,0.08); }
.mdw-callout-tip::before     { content: "Tip";     color: #50b060; }

.mdw-callout-caution { --mdw-callout-border: #d04040; --mdw-callout-bg: rgba(208,64,64,0.08); }
.mdw-callout-caution::before { content: "Caution"; color: #d04040; }

.mdw-callout-important { --mdw-callout-border: #8b5cf6; --mdw-callout-bg: rgba(139,92,246,0.08); }
.mdw-callout-important::before { content: "Important"; color: #8b5cf6; }

/* ─── Page break (print) ─────────────────────────────────────────────────────── */

.mdw-hr.mdw-page-break {
  display: none;
}

@media print {
  .mdw-hr.mdw-page-break {
    display: block;
    page-break-after: always;
    border: none;
    opacity: 0;
    margin: 0;
  }
}
