/*
  Markdown preview themes.
  This is intentionally local, readable CSS rather than a copied generated bundle.

  Notes:
  - This stylesheet is loaded inside the preview iframe, which does not load
    styles.css. So variables that originate there (--shadow, --mono, --font)
    are referenced with explicit fallbacks below.
*/

.preview-pane {
  background: var(--md-shell, #ffffff);
}

.markdown-body {
  --md-bg: #ffffff;
  --md-text: #1f2937;
  --md-muted: #667085;
  --md-border: #d9e0e7;
  --md-soft: #f6f8fa;
  --md-softer: #fbfcfd;
  --md-accent: #2563eb;
  --md-accent-2: #0f766e;
  --md-code-bg: #1f2937;
  --md-code-text: #e5e7eb;
  --md-inline-code-bg: #eef2f7;
  --md-inline-code-text: #a33400;
  --md-table-stripe: #f8fafc;
  --md-callout-bg: #f8fbff;
  --md-callout-border: #93c5fd;
  background: var(--md-bg);
  color: var(--md-text);
  font-size: 15.5px;
  line-height: 1.72;
  max-width: none;
}

.markdown-body > * {
  max-width: 920px;
}

.markdown-body h1,
.markdown-body h2,
.markdown-body h3,
.markdown-body h4,
.markdown-body h5,
.markdown-body h6 {
  color: var(--md-heading, var(--md-text));
  font-weight: 720;
  line-height: 1.25;
  letter-spacing: 0;
  scroll-margin-top: 16px;
}

.markdown-body h1 {
  margin: 0 0 1rem;
  padding-bottom: 0.55rem;
  border-bottom: 2px solid var(--md-border);
  font-size: 2.15rem;
}

.markdown-body h2 {
  margin-top: 2rem;
  padding-bottom: 0.35rem;
  border-bottom: 1px solid var(--md-border);
  font-size: 1.55rem;
}

.markdown-body h3 {
  margin-top: 1.65rem;
  font-size: 1.25rem;
}

.markdown-body h4 {
  margin-top: 1.35rem;
  font-size: 1.08rem;
}

.markdown-body h5,
.markdown-body h6 {
  margin-top: 1.15rem;
  color: var(--md-muted);
  font-size: 0.98rem;
}

.markdown-body p {
  margin: 0 0 1rem;
}

.markdown-body strong {
  font-weight: 720;
}

.markdown-body a {
  color: var(--md-accent);
  font-weight: 560;
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

.markdown-body a:hover {
  color: var(--md-accent-2);
}

.markdown-body hr {
  height: 1px;
  margin: 2rem 0;
  border: 0;
  background: var(--md-border);
}

.markdown-body ul,
.markdown-body ol {
  margin: 0 0 1.1rem;
  padding-left: 1.35rem;
}

.markdown-body ul {
  list-style: disc;
}

.markdown-body ol {
  list-style: decimal;
}

.markdown-body li {
  margin: 0.28rem 0;
  padding-left: 0.18rem;
}

.markdown-body li > ul,
.markdown-body li > ol {
  margin: 0.35rem 0;
}

.markdown-body li:has(input[type="checkbox"]) {
  list-style: none;
  margin-left: -1.2rem;
}

.markdown-body input[type="checkbox"] {
  width: 1rem;
  height: 1rem;
  margin: 0 0.45rem 0 0;
  vertical-align: -0.16rem;
  accent-color: var(--md-accent-2);
}

.markdown-body blockquote {
  max-width: 920px;
  margin: 1.25rem 0;
  border-left: 4px solid var(--md-accent);
  border-radius: 0 7px 7px 0;
  padding: 0.85rem 1rem;
  background: var(--md-soft);
  color: var(--md-quote-text, var(--md-text));
  font-style: normal;
}

.markdown-body blockquote > :last-child {
  margin-bottom: 0;
}

.markdown-body .callout {
  border: 1px solid var(--md-callout-border);
  border-left-width: 5px;
  background: var(--md-callout-bg);
}

.markdown-body .callout-title {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  margin-bottom: 0.2rem;
  color: var(--md-callout-title, var(--md-accent));
  font-weight: 760;
}

.markdown-body .callout-title::before {
  content: "";
  width: 0.55rem;
  height: 0.55rem;
  border-radius: 50%;
  background: currentColor;
}

.markdown-body .callout-tip {
  --md-callout-bg: #f0fdf4;
  --md-callout-border: #86efac;
  --md-callout-title: #15803d;
}

.markdown-body .callout-important {
  --md-callout-bg: #faf5ff;
  --md-callout-border: #d8b4fe;
  --md-callout-title: #7e22ce;
}

.markdown-body .callout-warning {
  --md-callout-bg: #fffbeb;
  --md-callout-border: #facc15;
  --md-callout-title: #a16207;
}

.markdown-body .callout-caution {
  --md-callout-bg: #fef2f2;
  --md-callout-border: #fca5a5;
  --md-callout-title: #b91c1c;
}

.markdown-body code {
  border-radius: 5px;
  padding: 0.14em 0.38em;
  background: var(--md-inline-code-bg);
  color: var(--md-inline-code-text);
  font-family: var(--mono, "Cascadia Mono", "Consolas", "SFMono-Regular", monospace);
  font-size: 0.9em;
}

.markdown-body pre {
  position: relative;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  margin: 1.35rem 0;
  border: 1px solid var(--md-code-border, #111827);
  border-radius: 8px;
  padding: 1rem;
  background: var(--md-code-bg);
  color: var(--md-code-text);
  white-space: pre-wrap;
  overflow-x: hidden;
  overflow-wrap: anywhere;
  word-break: break-word;
  box-shadow: 0 10px 22px rgba(15, 23, 42, 0.08);
}

.markdown-body pre[data-language]::before {
  content: attr(data-language);
  position: absolute;
  top: 0.55rem;
  right: 2.85rem;
  color: rgba(229, 231, 235, 0.7);
  font-family: var(--font, "Segoe UI", system-ui, -apple-system, BlinkMacSystemFont, sans-serif);
  font-size: 0.72rem;
  font-weight: 700;
}

.markdown-body pre code {
  display: block;
  box-sizing: border-box;
  width: 100%;
  min-width: 0;
  max-width: 100%;
  padding: 0;
  background: transparent;
  color: inherit;
  font-size: 0.9rem;
  line-height: 1.65;
  white-space: inherit;
  overflow-wrap: inherit;
  word-break: inherit;
}

.markdown-body table {
  display: table;
  width: 100%;
  max-width: 100%;
  margin: 1.35rem 0;
  border-collapse: separate;
  border-spacing: 0;
  border: 1px solid var(--md-border);
  border-radius: 8px;
  overflow: hidden;
  font-size: 0.93rem;
}

.markdown-body thead {
  background: var(--md-table-head, var(--md-soft));
}

.markdown-body th,
.markdown-body td {
  border: 0;
  border-right: 1px solid var(--md-border);
  border-bottom: 1px solid var(--md-border);
  padding: 0.72rem 0.86rem;
  text-align: left;
  vertical-align: top;
}

.markdown-body th:last-child,
.markdown-body td:last-child {
  border-right: 0;
}

.markdown-body tr:last-child td {
  border-bottom: 0;
}

.markdown-body th {
  background: var(--md-table-head, var(--md-soft));
  color: var(--md-heading, var(--md-text));
  font-weight: 720;
}

.markdown-body tbody tr:nth-child(even) {
  background: var(--md-table-stripe);
}

.markdown-body tbody tr:hover {
  background: var(--md-table-hover, var(--md-soft));
}

.markdown-body img,
.markdown-body video {
  max-width: 100%;
  height: auto;
  margin: 1.25rem 0;
  border-radius: 8px;
}

.markdown-body kbd {
  border: 1px solid var(--md-border);
  border-bottom-width: 2px;
  border-radius: 5px;
  padding: 0.12rem 0.35rem;
  background: var(--md-soft);
  color: var(--md-text);
  font-family: var(--mono, "Cascadia Mono", "Consolas", "SFMono-Regular", monospace);
  font-size: 0.85em;
}

body[data-theme="smartpad"] {
  --md-shell: #f4f7fb;
}

body[data-theme="smartpad"] .markdown-body {
  --md-bg: #ffffff;
  --md-text: #273244;
  --md-heading: #0f172a;
  --md-muted: #667085;
  --md-border: #d8e0ea;
  --md-soft: #f4f7fb;
  --md-softer: #fbfdff;
  --md-accent: #2563eb;
  --md-accent-2: #4f46e5;
  --md-inline-code-bg: #eef4ff;
  --md-inline-code-text: #1d4ed8;
  --md-table-head: #eef4ff;
  --md-table-stripe: #f8fbff;
  --md-code-bg: #282c34;
  --md-code-border: #20242b;
  max-width: 980px;
  margin: 0 auto;
  padding: 34px 42px 90px;
}

body[data-theme="paper"] {
  --md-shell: #ece8dd;
}

body[data-theme="paper"] .markdown-body,
body[data-theme="paper"] .prose {
  --md-bg: #fffdf7;
  --md-text: #2b2822;
  --md-heading: #211d17;
  --md-muted: #766d5f;
  --md-border: #ded7c8;
  --md-soft: #faf4e7;
  --md-accent: #7c3f14;
  --md-accent-2: #0f766e;
  --md-inline-code-bg: #f2eadb;
  --md-inline-code-text: #8a3d12;
  --md-code-bg: #3c1400;
  --md-code-text: #e5e7eb;
  --md-code-border: #6f2d10;
  --md-table-head: #f1eadc;
  --md-table-stripe: #fff8ea;
}

body[data-theme="paper"] .markdown-body {
  max-width: 820px;
  height: calc(100% - 40px);
  margin: 20px auto;
  border: 1px solid var(--md-border);
  padding: 42px 48px 90px;
  box-shadow: var(--shadow, 0 12px 30px rgba(32, 36, 42, 0.08));
}

body[data-theme="paper"] .markdown-body pre,
body[data-theme="paper"] .prose pre,
body[data-theme="paper"] .markdown-body .code-block,
body[data-theme="paper"] .prose .code-block {
  border-color: #6f2d10 !important;
  background: #3c1400 !important;
  background-color: #3c1400 !important;
  background-image: none !important;
  color: #e5e7eb !important;
}

body[data-theme="paper"] .markdown-body pre code,
body[data-theme="paper"] .prose pre code {
  background: transparent !important;
  color: inherit !important;
}

body[data-theme="paper"] .markdown-body pre[data-language]::before,
body[data-theme="paper"] .prose pre[data-language]::before {
  color: #8f806b;
}

body[data-theme="paper"] .markdown-body .code-block .token.comment,
body[data-theme="paper"] .prose .code-block .token.comment,
body[data-theme="paper"] .markdown-body .code-block .token.prolog,
body[data-theme="paper"] .prose .code-block .token.prolog,
body[data-theme="paper"] .markdown-body .code-block .token.doctype,
body[data-theme="paper"] .prose .code-block .token.doctype,
body[data-theme="paper"] .markdown-body .code-block .token.cdata,
body[data-theme="paper"] .prose .code-block .token.cdata,
body[data-theme="paper"] .markdown-body .code-block .token.title,
body[data-theme="paper"] .prose .code-block .token.title {
  color: #9ca3af !important;
}

body[data-theme="paper"] .markdown-body .code-block .token.keyword,
body[data-theme="paper"] .prose .code-block .token.keyword,
body[data-theme="paper"] .markdown-body .code-block .token.atrule,
body[data-theme="paper"] .prose .code-block .token.atrule,
body[data-theme="paper"] .markdown-body .code-block .token.important,
body[data-theme="paper"] .prose .code-block .token.important {
  color: #ff79ff !important;
}

body[data-theme="paper"] .markdown-body .code-block .token.function,
body[data-theme="paper"] .prose .code-block .token.function {
  color: #7dd3fc !important;
}

body[data-theme="paper"] .markdown-body .code-block .token.attr-name,
body[data-theme="paper"] .prose .code-block .token.attr-name,
body[data-theme="paper"] .markdown-body .code-block .token.property,
body[data-theme="paper"] .prose .code-block .token.property,
body[data-theme="paper"] .markdown-body .code-block .token.selector,
body[data-theme="paper"] .prose .code-block .token.selector,
body[data-theme="paper"] .markdown-body .code-block .token.url,
body[data-theme="paper"] .prose .code-block .token.url {
  color: #22d3ee !important;
}

body[data-theme="paper"] .markdown-body .code-block .token.string,
body[data-theme="paper"] .prose .code-block .token.string,
body[data-theme="paper"] .markdown-body .code-block .token.char,
body[data-theme="paper"] .prose .code-block .token.char,
body[data-theme="paper"] .markdown-body .code-block .token.attr-value,
body[data-theme="paper"] .prose .code-block .token.attr-value,
body[data-theme="paper"] .markdown-body .code-block .token.inserted,
body[data-theme="paper"] .prose .code-block .token.inserted {
  color: #9cff87 !important;
}

body[data-theme="paper"] .markdown-body .code-block .token.number,
body[data-theme="paper"] .prose .code-block .token.number,
body[data-theme="paper"] .markdown-body .code-block .token.boolean,
body[data-theme="paper"] .prose .code-block .token.boolean,
body[data-theme="paper"] .markdown-body .code-block .token.constant,
body[data-theme="paper"] .prose .code-block .token.constant {
  color: #f7b267 !important;
}

body[data-theme="paper"] .markdown-body .code-block .token.regex,
body[data-theme="paper"] .prose .code-block .token.regex,
body[data-theme="paper"] .markdown-body .code-block .token.variable,
body[data-theme="paper"] .prose .code-block .token.variable,
body[data-theme="paper"] .markdown-body .code-block .token.entity,
body[data-theme="paper"] .prose .code-block .token.entity {
  color: #e8ba8c !important;
}

body[data-theme="paper"] .markdown-body .code-block .token.operator,
body[data-theme="paper"] .prose .code-block .token.operator,
body[data-theme="paper"] .markdown-body .code-block .token.punctuation,
body[data-theme="paper"] .prose .code-block .token.punctuation {
  color: #d4d4d4 !important;
}

body[data-theme="paper"] .markdown-body .code-block .token.tag,
body[data-theme="paper"] .prose .code-block .token.tag,
body[data-theme="paper"] .markdown-body .code-block .token.deleted,
body[data-theme="paper"] .prose .code-block .token.deleted {
  color: #ff7b72 !important;
}

body[data-theme="compact"] .markdown-body {
  max-width: none;
  padding: 16px 20px 64px;
  font-size: 13.25px;
  line-height: 1.5;
}

body[data-theme="compact"] .markdown-body h1 {
  font-size: 1.55rem;
}

body[data-theme="compact"] .markdown-body h2 {
  font-size: 1.22rem;
}

body[data-theme="compact"] .markdown-body pre,
body[data-theme="compact"] .markdown-body table,
body[data-theme="compact"] .markdown-body blockquote {
  margin: 0.85rem 0;
}

body[data-theme="report"] {
  --md-shell: #f2f4f7;
}

body[data-theme="report"] .markdown-body {
  --md-bg: #ffffff;
  --md-text: #24303f;
  --md-heading: #111827;
  --md-muted: #5f6b7a;
  --md-border: #cfd6df;
  --md-soft: #f5f7fa;
  --md-accent: #1e3a8a;
  --md-accent-2: #1d4ed8;
  --md-inline-code-bg: #eef4ff;
  --md-inline-code-text: #1e3a8a;
  --md-table-head: #eef4ff;
  max-width: 860px;
  margin: 0 auto;
  padding: 46px 54px 96px;
}

body[data-theme="report"] .markdown-body h1 {
  text-align: center;
  border-bottom: 0;
}

body[data-theme="report"] .markdown-body h2 {
  border-bottom: 2px solid var(--md-accent);
}

@media (max-width: 720px) {
  body[data-theme="smartpad"] .markdown-body,
  body[data-theme="paper"] .markdown-body,
  body[data-theme="report"] .markdown-body {
    max-width: none;
    height: auto;
    margin: 0;
    border: 0;
    padding: 18px;
    box-shadow: none;
  }

  .markdown-body {
    font-size: 14.5px;
  }
}

@media print {
  .markdown-body {
    --md-bg: #ffffff !important;
    --md-text: #000000 !important;
    --md-heading: #000000 !important;
    --md-border: #c8c8c8 !important;
    --md-soft: #f5f5f5 !important;
    --md-code-bg: #f5f5f5 !important;
    --md-code-text: #000000 !important;
  }

  .markdown-body pre {
    box-shadow: none !important;
  }
}
