/* Gedeelde documentopmaak: dezelfde regels worden gebruikt in de editor,
   in opgeslagen .notes.html-bestanden en bij afdrukken naar PDF. */
.editor-content,
.notes-document {
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  font-size: 17px;
  line-height: 1.62;
  color: #1f1f1f;
  background: #fff;
}
.editor-content > *:first-child,
.notes-document > *:first-child { margin-top: 0; }
.editor-content > *:last-child,
.notes-document > *:last-child { margin-bottom: 0; }
.editor-content p,
.notes-document p { margin: 0 0 1.15em; }
.editor-content h1, .editor-content h2, .editor-content h3, .editor-content h4,
.notes-document h1, .notes-document h2, .notes-document h3, .notes-document h4 {
  font-family: inherit;
  font-weight: 700;
  line-height: 1.2;
  letter-spacing: -.015em;
  color: #171717;
}
.editor-content h1, .notes-document h1 { font-size: 2em; margin: 1.45em 0 .7em; }
.editor-content h2, .notes-document h2 { font-size: 1.48em; margin: 1.55em 0 .72em; }
.editor-content h3, .notes-document h3 { font-size: 1.2em; margin: 1.4em 0 .62em; }
.editor-content h4, .notes-document h4 { font-size: 1.05em; margin: 1.3em 0 .55em; }
.editor-content ul, .editor-content ol,
.notes-document ul, .notes-document ol { padding-left: 1.55em; margin: .75em 0 1.15em; }
.editor-content li, .notes-document li { margin: .2em 0; padding-left: .08em; }
.editor-content ul ul, .editor-content ol ol, .editor-content ul ol, .editor-content ol ul,
.notes-document ul ul, .notes-document ol ol, .notes-document ul ol, .notes-document ol ul { margin-top: .25em; margin-bottom: .25em; }
.editor-content strong, .notes-document strong { font-weight: 700; }
.editor-content em, .notes-document em { font-style: italic; }
.editor-content blockquote, .notes-document blockquote { border-left: 3px solid #949494; margin: 1.2em 0; padding: .2em 0 .2em 1em; color: #3c434a; }
.editor-content a, .notes-document a { color: #1d4ed8; text-decoration: underline; text-underline-offset: 2px; }
.editor-content code, .notes-document code { font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; font-size: .9em; background: #f0f0f1; padding: .08em .28em; border-radius: 3px; }
.editor-content pre, .notes-document pre { overflow: auto; padding: 16px; background: #1e1e1e; color: #f5f5f5; border-radius: 6px; line-height: 1.45; }
.editor-content pre code, .notes-document pre code { background: transparent; padding: 0; }
/* v4.7.0: één tabelstijl voor editor, boekweergave, HTML- en PDF-export.
   Aparte buitenrand blijft ook onder de laatste rij zichtbaar. */
.editor-content table, .notes-document table {
  width: 100%; max-width: 100%;
  border: 1px solid #909090;
  border-collapse: separate;
  border-spacing: 0;
  table-layout: auto;
  box-sizing: border-box;
  margin: 1.05em 0 1.55em;
  font-family: inherit;
  font-size: 1em;
  line-height: 1.48;
}
.editor-content th, .editor-content td,
.notes-document th, .notes-document td {
  border: 0;
  border-right: 1px solid #c5c5c5;
  border-bottom: 1px solid #c5c5c5;
  padding: 7px 9px;
  vertical-align: top;
  text-align: left;
  background: transparent;
  overflow-wrap: anywhere;
  hyphens: auto;
}
.editor-content th, .notes-document th { font-weight: 650; color: #111; }
.editor-content tr > :last-child, .notes-document tr > :last-child {border-right: 0;}
.editor-content tbody tr:last-child > *, .notes-document tbody tr:last-child > * {border-bottom: 0;}
.editor-content table:not(:has(tbody)) thead tr:last-child > *,
.notes-document table:not(:has(tbody)) thead tr:last-child > * {border-bottom: 0;}
/* Gebruik de tabel zelf als expliciete onderrand, ook bij 2/5 kolommen. */
.editor-content ol, .notes-document ol { list-style: decimal outside; }
.editor-content ol > li, .notes-document ol > li {display:list-item;list-style-type:decimal;}
.editor-content hr, .notes-document hr { border: 0; border-top: 1px solid #d7d7d7; margin: 2em 0; }
.editor-content img, .notes-document img { max-width: 100%; height: auto; }
.editor-content figure, .notes-document figure { margin: 1.25em 0; }
.editor-content figcaption, .notes-document figcaption { color: #646970; font-size: .86em; line-height: 1.4; margin-top: .45em; }

@media print {
  @page { size: A4; margin: 18mm 17mm 20mm; }
  .notes-document { font-size: 11pt; line-height: 1.58; print-color-adjust: exact; -webkit-print-color-adjust: exact; }
  .notes-document p, .notes-document li { orphans: 3; widows: 3; }
  .notes-document table { break-inside: auto; page-break-inside: auto; }
  .notes-document thead { display: table-header-group; }
  .notes-document tfoot { display: table-footer-group; }
  .notes-document tr { break-inside: avoid; page-break-inside: avoid; }
  .notes-document figure, .notes-document blockquote, .notes-document pre { break-inside: avoid; page-break-inside: avoid; }
  .notes-document h1, .notes-document h2, .notes-document h3, .notes-document h4 { break-after: avoid-page; page-break-after: avoid; }
  .notes-document h1 + *, .notes-document h2 + *, .notes-document h3 + *, .notes-document h4 + * { break-before: avoid-page; page-break-before: avoid; }
  .notes-document img { max-height: 245mm; object-fit: contain; }
  .notes-document a { color: inherit; text-decoration: none; }
}

/* v0.2.4: expliciete pagina-einden en robuustere smalle tabellen. */
.editor-content .notes-page-break,
.notes-document .notes-page-break {
  position: relative;
  display: block;
  height: 34px;
  margin: 1.8em 0;
  border: 0;
  border-top: 1px dashed #a7aaad;
  background: transparent;
  color: #646970;
  text-align: center;
  user-select: none;
}
.editor-content .notes-page-break > span,
.notes-document .notes-page-break > span {
  position: relative;
  top: -0.8em;
  display: inline-block;
  padding: 0 .7em;
  background: #fff;
  font-size: 12px;
  line-height: 1.4;
  letter-spacing: .02em;
}
.notes-document table {
  max-width: 100%;
}
.notes-document th,
.notes-document td {
  overflow-wrap: anywhere;
  word-break: normal;
  hyphens: auto;
}

@media print {
  .notes-document .notes-page-break {
    height: 0 !important;
    margin: 0 !important;
    padding: 0 !important;
    border: 0 !important;
    break-after: page !important;
    page-break-after: always !important;
  }
  .notes-document .notes-page-break > span { display: none !important; }
  .notes-document table { max-width: 100% !important; }
  .notes-document th,
  .notes-document td { overflow-wrap: anywhere !important; }
}

/* v0.2.6: visuele kaders blijven intern platte, afzonderlijk selecteerbare blokken.
   Aaneengesloten blokken met hetzelfde data-notes-frame vormen samen één kader. */
.editor-content > .notes-frame-item,
.notes-document > .notes-frame-item {
  --notes-frame-bg: #f5f5f5;
  --notes-frame-border: 1px solid #c7c7c7;
  --notes-frame-radius: 0px;
  --notes-frame-padding: 18px;
  --notes-frame-margin: 22px 0;
  box-sizing: border-box;
  background: var(--notes-frame-bg) !important;
  border-left: var(--notes-frame-border);
  border-right: var(--notes-frame-border);
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  padding: .34em 1.55em !important;
}
.editor-content > .notes-frame-first,
.notes-document > .notes-frame-first {
  border-top: var(--notes-frame-border);
  margin-top: var(--notes-frame-margin);
  border-radius: var(--notes-frame-radius) var(--notes-frame-radius) 0 0;
  margin-top: 1.35em !important;
  padding-top: 1.25em !important;
}
.editor-content > .notes-frame-last,
.notes-document > .notes-frame-last {
  border-bottom: var(--notes-frame-border);
  margin-bottom: var(--notes-frame-margin);
  border-radius: 0 0 var(--notes-frame-radius) var(--notes-frame-radius);
  margin-bottom: 1.35em !important;
  padding-bottom: 1.25em !important;
}
.editor-content > .notes-frame-single,
.notes-document > .notes-frame-single {
  border: var(--notes-frame-border);
  margin-top: var(--notes-frame-margin);
  margin-bottom: var(--notes-frame-margin);
  border-radius: var(--notes-frame-radius);
  margin: 1.35em 0 !important;
  padding: 1.25em 1.55em !important;
}
.editor-content > h1.notes-frame-item,
.editor-content > h2.notes-frame-item,
.editor-content > h3.notes-frame-item,
.editor-content > h4.notes-frame-item,
.notes-document > h1.notes-frame-item,
.notes-document > h2.notes-frame-item,
.notes-document > h3.notes-frame-item,
.notes-document > h4.notes-frame-item {
  padding-top: .8em !important;
  padding-bottom: .35em !important;
}
.editor-content > .notes-frame-item[data-block-selected="true"] {
  background: var(--notes-frame-bg) !important;
}
@media print {
  .notes-document > .notes-frame-item {
    -webkit-print-color-adjust: exact;
    print-color-adjust: exact;
  }
}

/* v0.3 — hoofdstukblok en boekproductie. */
.editor-content > .notes-chapter,
.notes-document > .notes-chapter {
  display: block;
  margin: 2.2em 0 1.7em;
  padding: 1.15em 0 .25em;
  border-top: 1px solid #dcdcde;
  background: transparent;
}
.editor-content > .notes-chapter > .notes-chapter-number,
.editor-content > .notes-chapter > div:first-child,
.notes-document > .notes-chapter > .notes-chapter-number,
.notes-document > .notes-chapter > div:first-child {
  margin: 0 0 .45em;
  color: #646970;
  font-size: .78em;
  font-weight: 650;
  letter-spacing: .08em;
  text-transform: uppercase;
}
.editor-content > .notes-chapter > h1,
.notes-document > .notes-chapter > h1 {
  margin: 0 0 .35em;
  font-size: 2.05em;
  line-height: 1.08;
  letter-spacing: -.025em;
}
.editor-content > .notes-chapter > .notes-chapter-subtitle,
.editor-content > .notes-chapter > p:last-child,
.notes-document > .notes-chapter > .notes-chapter-subtitle,
.notes-document > .notes-chapter > p:last-child {
  margin: 0;
  color: #50575e;
  font-size: 1em;
  line-height: 1.45;
}
.editor-content > .notes-chapter[data-block-selected="true"] {
  outline: 2px solid #8ea0ff;
  outline-offset: 5px;
}
@media print {
  .notes-document > .notes-chapter {
    break-before: page;
    page-break-before: always;
    border-top: 0;
    margin-top: 0;
    padding-top: 0;
  }
  .notes-document > .notes-chapter:first-child {
    break-before: auto;
    page-break-before: auto;
  }
}

/* Zelfstandige vectorformules: ook zichtbaar in HTML-export en afdruk/PDF. */
.notes-math{display:inline-block;vertical-align:middle;max-width:100%;font-size:1em;line-height:1.2;cursor:default;}
.notes-math svg{max-width:100%;height:auto;overflow:visible;vertical-align:middle;}
.notes-math-display{display:block;text-align:center;margin:1.15em 0;break-inside:avoid;page-break-inside:avoid;}
.notes-math-display svg{display:inline-block;}
.editor-content .notes-math:hover{outline:1px dotted #999;outline-offset:3px;}

/* v0.4.6.1 — leeg afbeeldingsblok, onderdeel van de blokeditor en van HTML/PDF. */
.editor-content figure.notes-image-placeholder,
.notes-document figure.notes-image-placeholder {
  display:block; margin:1.4em 0; padding:0; break-inside:avoid; page-break-inside:avoid;
}
.editor-content .notes-image-placeholder-area,
.notes-document .notes-image-placeholder-area {
  min-height:145px; display:flex; align-items:center; justify-content:center;
  border:2px dashed #a7afb8; background:#f7f8fa; color:#64707d;
  padding:16px; text-align:center; font-size:.83em; font-weight:650;
  letter-spacing:.04em; box-sizing:border-box;
}
.editor-content .notes-image-placeholder figcaption,
.notes-document .notes-image-placeholder figcaption {
  color:#4e5965; font-size:.9em; line-height:1.5; margin:.65em 0 0; text-align:center;
}
@media print {
  .notes-document .notes-image-placeholder-area { min-height:35mm; -webkit-print-color-adjust:exact; print-color-adjust:exact; }
}

/* v0.4.6.2: duidelijk gemarkeerde plek, ook in zelfstandig HTML/PDF. */
.editor-content figure.notes-image-placeholder,
.notes-document figure.notes-image-placeholder {
  margin: 1.8em 0 !important;
  padding: 13px !important;
  border: 3px solid #b45309 !important;
  border-radius: 10px;
  background: #fff8e9 !important;
  box-sizing: border-box;
  break-inside: avoid;
  page-break-inside: avoid;
}
.editor-content .notes-image-placeholder-area,
.notes-document .notes-image-placeholder-area {
  display:flex; flex-direction:column; gap:10px;
  min-height: 190px;
  padding: 22px 16px;
  border: 3px dashed #d97706 !important;
  border-radius: 7px;
  background: #fffbeb !important;
  color: #92400e !important;
  justify-content:center;
  align-items:center;
  text-align:center;
  letter-spacing:0;
}
.editor-content .notes-image-placeholder-area strong,
.notes-document .notes-image-placeholder-area strong {font-size:1.07em;letter-spacing:.025em;}
.editor-content .notes-image-placeholder-area span,
.notes-document .notes-image-placeholder-area span {font-size:.82em;font-weight:400;}
.editor-content .notes-image-placeholder figcaption,
.notes-document .notes-image-placeholder figcaption {
  padding: 10px 4px 1px; margin:0;
  text-align:center; font-size:.98em; font-weight:700; color:#713f12;
}
@media print {
 .notes-document figure.notes-image-placeholder {print-color-adjust:exact!important;-webkit-print-color-adjust:exact!important;}
 .notes-document .notes-image-placeholder-area {min-height:45mm!important;print-color-adjust:exact!important;-webkit-print-color-adjust:exact!important;}
}

/* v0.4.6.3: compacte aaneengesloten blokken, blijven los bewerkbaar. */
.editor-content > p.notes-tight-next, .notes-document > p.notes-tight-next { margin-bottom:0 !important; }
.editor-content figure.notes-image-placeholder .notes-image-placeholder-area { cursor:pointer; }
.editor-content figure.notes-image-placeholder .notes-image-placeholder-area:hover { background:#fef3c7 !important; border-color:#b45309 !important; }
.notes-selection-action { display:inline-flex; align-items:center; gap:6px; }
.notes-selection-action select { max-width:225px; }

/* Op mobiel moet een tabel nog steeds een echte tabel blijven.
   'display:block' maakte de rijlijnen slechts zo breed als de tekst. */
@media screen and (max-width: 900px) {
  .editor-content table {
    display: table;
    width: 100%;
    min-width: 0;
    max-width: 100%;
    overflow: visible;
    table-layout: fixed;
  }
  .editor-content th, .editor-content td {
    padding: 6px 5px;
    font-size: .91em;
    overflow-wrap: anywhere;
  }
}

/* v4.7.2: two verified native Gutenberg background colours (Bosch post).
   Apply also in Notities preview and saved .notes.html/PDF documents. */
.editor-content p.has-pale-cyan-blue-background-color,
.notes-document p.has-pale-cyan-blue-background-color { background-color: #8ed1fc; }
.editor-content p.has-pale-pink-background-color,
.notes-document p.has-pale-pink-background-color { background-color: #f78da7; }
.editor-content p.has-background, .notes-document p.has-background {
  padding: 0.7em 1em;
  -webkit-print-color-adjust: exact;
  print-color-adjust: exact;
}
