/* ==========================================================================
   URL PRINTER - WYSIWYG PRINT ENGINE & PAGINATION STYLES (V4.2)
   Even/Odd Mirror Margins, 3-Slot Protected Headers & Footers,
   List Item Breaking, Universal Alignment, Separators, Note Boxes,
   Multi-column Layout & High-Precision Print Rules
   ========================================================================== */

/* --------------------------------------------------------------------------
   Paper Sheets & Virtual Canvas Dimensions
   -------------------------------------------------------------------------- */
.paper-sheet {
  background: var(--doc-paper-bg, #ffffff);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.08), 0 0 1px rgba(0, 0, 0, 0.15);
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  color: var(--doc-text, #1e293b);
  font-family: var(--doc-font-family, 'Inter', sans-serif);
  font-size: var(--doc-font-size-base, 10.5pt);
  line-height: var(--doc-line-height, 1.55);
  border-radius: 2px;
  flex-shrink: 0;
}

/* Format Sizes */
.paper-sheet[data-format="a4"][data-orientation="portrait"] {
  width: 210mm;
  min-height: 297mm;
  height: 297mm;
}

.paper-sheet[data-format="a4"][data-orientation="landscape"] {
  width: 297mm;
  min-height: 210mm;
  height: 210mm;
}

.paper-sheet[data-format="a5"][data-orientation="portrait"] {
  width: 148mm;
  min-height: 210mm;
  height: 210mm;
}

.paper-sheet[data-format="a5"][data-orientation="landscape"] {
  width: 210mm;
  min-height: 148mm;
  height: 148mm;
}

.paper-sheet[data-format="b5"][data-orientation="portrait"] {
  width: 176mm;
  min-height: 250mm;
  height: 250mm;
}

.paper-sheet[data-format="b5"][data-orientation="landscape"] {
  width: 250mm;
  min-height: 176mm;
  height: 176mm;
}

.paper-sheet[data-format="letter"][data-orientation="portrait"] {
  width: 215.9mm;
  min-height: 279.4mm;
  height: 279.4mm;
}

.paper-sheet[data-format="letter"][data-orientation="landscape"] {
  width: 279.4mm;
  min-height: 215.9mm;
  height: 215.9mm;
}

/* Printable Inner Area */
.sheet-inner {
  box-sizing: border-box;
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  position: relative;
  overflow: hidden;
}

/* --------------------------------------------------------------------------
   Running Header & Footer (With 3-Slot Protected Page Number Layout)
   -------------------------------------------------------------------------- */
.sheet-header,
.sheet-footer {
  min-height: 7.5mm;
  height: 7.5mm;
  max-height: 7.5mm;
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-between;
  font-size: 8pt;
  color: var(--doc-text-muted, #64748b);
  flex-shrink: 0;
  gap: 8px;
  overflow: hidden;
}

.sheet-header {
  border-bottom: 0.75pt solid var(--doc-border, #cbd5e1);
  padding-bottom: 1.2mm;
  margin-bottom: 2.5mm;
}

.sheet-footer {
  border-top: 0.75pt solid var(--doc-border, #cbd5e1);
  padding-top: 1.2mm;
  margin-top: 2.5mm;
  position: relative;
  z-index: 2;
  background-color: var(--doc-paper-bg, #ffffff);
}

.header-slot-left,
.footer-slot-left {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: left;
  line-height: 1.15;
}

.header-slot-center,
.footer-slot-center {
  flex-shrink: 0;
  text-align: center;
  font-weight: 600;
  max-width: 45%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  line-height: 1.15;
  color: var(--doc-headings, #0f172a);
}

.header-slot-right,
.footer-slot-right {
  flex: 1;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: right;
  line-height: 1.15;
}

/* Protected Page Number Slot */
.page-number-display {
  font-weight: 700;
  color: var(--doc-text, #0f172a);
  flex-shrink: 0;
  white-space: nowrap;
  letter-spacing: 0.2px;
}

/* Hide Header / Footer classes */
.hide-header .sheet-header {
  display: none !important;
}

.hide-footer .sheet-footer {
  display: none !important;
}

/* Sheet Main Content Box */
.sheet-body {
  flex: 1;
  min-height: 0;
  box-sizing: border-box;
  position: relative;
  overflow: hidden;
  contain: layout;
  font-family: var(--doc-font-family, 'Inter', sans-serif);
  color: var(--doc-text, #1e293b);
}

.sheet-body > :first-child {
  margin-top: 0 !important;
}

.sheet-body > :last-child,
.sheet-body > :last-child > :last-child {
  margin-bottom: 0 !important;
}

/* Multi-Column Layout (Clean Sazba without Ghost Columns) */
.sheet-body[data-columns="2"] {
  column-count: 2;
  column-gap: var(--sheet-column-gap, 7mm);
  column-rule: 0.5pt solid var(--doc-border, #e2e8f0);
  column-fill: auto;
}

.sheet-body[data-columns="3"] {
  column-count: 3;
  column-gap: var(--sheet-column-gap, 5.5mm);
  column-rule: 0.5pt solid var(--doc-border, #e2e8f0);
  column-fill: auto;
}

/* Multi-Column Containment & Spanning Safety */
.sheet-body[data-columns="2"] > *,
.sheet-body[data-columns="3"] > * {
  max-width: 100% !important;
  box-sizing: border-box !important;
  column-span: none !important;
}

.sheet-body[data-columns="2"] > h1.doc-element:first-child,
.sheet-body[data-columns="3"] > h1.doc-element:first-child,
.sheet-body[data-columns="2"] > h1.doc-element:first-child + .doc-source-meta,
.sheet-body[data-columns="3"] > h1.doc-element:first-child + .doc-source-meta {
  column-span: all !important;
}

.sheet-body[data-columns="2"] figure.doc-table-figure:has(.doc-table-infobox),
.sheet-body[data-columns="3"] figure.doc-table-figure:has(.doc-table-infobox),
.sheet-body[data-columns="2"] .doc-table-infobox,
.sheet-body[data-columns="3"] .doc-table-infobox {
  float: none !important;
  width: 100% !important;
  max-width: 100% !important;
  margin: 0.5em 0 !important;
}

.sheet-body[data-columns="2"] table,
.sheet-body[data-columns="3"] table {
  width: 100% !important;
  max-width: 100% !important;
  table-layout: fixed !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  font-size: 7.5pt !important;
}

.sheet-body[data-columns="2"] th,
.sheet-body[data-columns="2"] td,
.sheet-body[data-columns="3"] th,
.sheet-body[data-columns="3"] td {
  padding: 3px 5px !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
}

.sheet-body[data-columns="2"] .doc-qr-grid,
.sheet-body[data-columns="3"] .doc-qr-grid {
  grid-template-columns: 1fr !important;
}

.sheet-body[data-columns="2"] pre,
.sheet-body[data-columns="3"] pre {
  white-space: pre-wrap !important;
  word-break: break-word !important;
  overflow-wrap: break-word !important;
  max-width: 100% !important;
}


/* --------------------------------------------------------------------------
   Document Content Elements & Typographic Rhythm (H1 to H6)
   -------------------------------------------------------------------------- */
.doc-element {
  position: relative;
  margin-bottom: 0.75em;
  outline: none;
  transition: background 0.15s ease, box-shadow 0.15s ease;
  box-sizing: border-box;
}

.doc-element:hover {
  outline: 1px dashed rgba(2, 132, 199, 0.5);
  background-color: rgba(2, 132, 199, 0.02);
  cursor: pointer;
}

.doc-element.active-selected {
  outline: 2px solid #0284c7 !important;
  background-color: rgba(2, 132, 199, 0.06) !important;
  box-shadow: 0 0 10px rgba(2, 132, 199, 0.15);
}

/* Headings Hierarchy: H1 - H6 */
h1.doc-element, .doc-h1 {
  font-family: var(--doc-font-heading, 'Outfit', sans-serif);
  font-size: calc(1.75 * var(--doc-heading-scale, 1.25) * 1rem);
  font-weight: 800;
  color: var(--doc-headings, #0f172a);
  line-height: 1.2;
  margin-top: var(--doc-heading-margin-top, 0.5em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.35em);
  letter-spacing: var(--doc-letter-spacing, -0.02em);
  break-after: avoid;
}

h2.doc-element, .doc-h2 {
  font-family: var(--doc-font-heading, 'Outfit', sans-serif);
  font-size: calc(1.3 * var(--doc-heading-scale, 1.25) * 1rem);
  font-weight: 700;
  color: var(--doc-primary, #0284c7);
  line-height: 1.25;
  margin-top: var(--doc-heading-margin-top, 0.75em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.3em);
  letter-spacing: var(--doc-letter-spacing, 0px);
  border-bottom: 1.5pt solid var(--doc-primary-border, #bae6fd);
  padding-bottom: 0.15em;
  break-after: avoid;
}

h3.doc-element, .doc-h3 {
  font-family: var(--doc-font-heading, 'Outfit', sans-serif);
  font-size: calc(1.15 * var(--doc-heading-scale, 1.25) * 1rem);
  font-weight: 700;
  color: var(--doc-secondary, #0369a1);
  line-height: 1.3;
  margin-top: var(--doc-heading-margin-top, 0.65em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.25em);
  letter-spacing: var(--doc-letter-spacing, 0px);
  break-after: avoid;
}

h4.doc-element, .doc-h4 {
  font-family: var(--doc-font-heading, 'Outfit', sans-serif);
  font-size: calc(1.02 * var(--doc-heading-scale, 1.25) * 1rem);
  font-weight: 700;
  color: var(--doc-headings, #0f172a);
  line-height: 1.35;
  margin-top: var(--doc-heading-margin-top, 0.55em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.2em);
  letter-spacing: var(--doc-letter-spacing, 0px);
  break-after: avoid;
}

h5.doc-element, .doc-h5 {
  font-family: var(--doc-font-heading, 'Outfit', sans-serif);
  font-size: 0.92rem;
  font-weight: 700;
  color: var(--doc-text-muted, #64748b);
  text-transform: uppercase;
  letter-spacing: calc(var(--doc-letter-spacing, 0px) + 0.5px);
  margin-top: var(--doc-heading-margin-top, 0.5em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.2em);
  break-after: avoid;
}

h6.doc-element, .doc-h6 {
  font-family: var(--doc-font-heading, 'Outfit', sans-serif);
  font-size: 0.85rem;
  font-weight: 600;
  font-style: italic;
  color: var(--doc-text-muted, #64748b);
  margin-top: var(--doc-heading-margin-top, 0.45em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.15em);
  letter-spacing: var(--doc-letter-spacing, 0px);
  break-after: avoid;
}

/* Paragraphs */
p.doc-element {
  font-family: var(--doc-font-family, 'Inter', sans-serif);
  font-size: var(--doc-font-size-base, 11pt);
  line-height: var(--doc-line-height, 1.55);
  letter-spacing: var(--doc-letter-spacing, 0px);
  color: var(--doc-text, #1e293b);
  margin-bottom: var(--doc-paragraph-margin-bottom, 0.65em);
  text-align: justify;
  hyphens: auto;
}

/* --------------------------------------------------------------------------
   THEME ENFORCEMENT RULES (Ensure theme typography & colors override inline styles)
   -------------------------------------------------------------------------- */
body:not([data-theme="web-original"]) .paper-sheet .sheet-body p,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body li,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body td,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body th,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body blockquote,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body ul,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body ol {
  font-family: var(--doc-font-family) !important;
  color: var(--doc-text) !important;
  font-size: var(--doc-font-size-base, 11pt);
  line-height: var(--doc-line-height, 1.55) !important;
  letter-spacing: var(--doc-letter-spacing, 0px);
}

body:not([data-theme="web-original"]) .paper-sheet .sheet-body p span,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body h1 span,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body h2 span,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body h3 span,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body li span {
  font-family: inherit !important;
}

body:not([data-theme="web-original"]) .paper-sheet .sheet-body h1,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body h2,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body h3,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body h4,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body h5,
body:not([data-theme="web-original"]) .paper-sheet .sheet-body h6,
body:not([data-theme="web-original"]) .paper-sheet .doc-h1,
body:not([data-theme="web-original"]) .paper-sheet .doc-h2,
body:not([data-theme="web-original"]) .paper-sheet .doc-h3,
body:not([data-theme="web-original"]) .paper-sheet .doc-h4 {
  font-family: var(--doc-font-heading) !important;
  letter-spacing: var(--doc-letter-spacing, 0px);
}

body:not([data-theme="web-original"]) .paper-sheet .sheet-body h1,
body:not([data-theme="web-original"]) .paper-sheet .doc-h1 {
  color: var(--doc-headings) !important;
  font-size: calc(1.75 * var(--doc-heading-scale, 1.25) * 1rem);
  margin-top: var(--doc-heading-margin-top, 0.5em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.35em);
}

body[data-theme^="bulletin-"] .paper-sheet .sheet-body h1,
body[data-theme^="bulletin-"] .paper-sheet .doc-h1 {
  color: #ffffff !important;
}

body:not([data-theme="web-original"]) .paper-sheet .sheet-body h2,
body:not([data-theme="web-original"]) .paper-sheet .doc-h2 {
  color: var(--doc-primary) !important;
  border-bottom-color: var(--doc-primary-border, var(--doc-border)) !important;
  font-size: calc(1.3 * var(--doc-heading-scale, 1.25) * 1rem);
  margin-top: var(--doc-heading-margin-top, 0.75em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.3em);
}

body:not([data-theme="web-original"]) .paper-sheet .sheet-body h3,
body:not([data-theme="web-original"]) .paper-sheet .doc-h3 {
  color: var(--doc-secondary, var(--doc-headings)) !important;
  font-size: calc(1.15 * var(--doc-heading-scale, 1.25) * 1rem);
  margin-top: var(--doc-heading-margin-top, 0.65em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.25em);
}

body:not([data-theme="web-original"]) .paper-sheet .sheet-body h4,
body:not([data-theme="web-original"]) .paper-sheet .doc-h4 {
  color: var(--doc-headings) !important;
  font-size: calc(1.02 * var(--doc-heading-scale, 1.25) * 1rem);
  margin-top: var(--doc-heading-margin-top, 0.55em);
  margin-bottom: var(--doc-heading-margin-bottom, 0.2em);
}

body:not([data-theme="web-original"]) .paper-sheet .sheet-body p {
  margin-bottom: var(--doc-paragraph-margin-bottom, 0.65em);
}

/* Hyperlink Base Styling */
.sheet-body a {
  color: var(--doc-primary, #0284c7);
  text-decoration: underline;
  text-underline-offset: 2.5px;
  text-decoration-thickness: 1px;
  cursor: pointer;
  transition: color 0.15s ease, opacity 0.15s ease;
}

.sheet-body a:hover {
  opacity: 0.85;
}

/* Hyperlink Hidden Mode: Skrýt hypertextové odkazy (jako běžný text bez jakéhokoliv odlišení) */
body[data-hide-links="true"] .sheet-body a,
body[data-hide-links="true"] .sheet-body a:visited,
body[data-hide-links="true"] .sheet-body a:hover,
body[data-hide-links="true"] .sheet-body a:active,
body[data-hide-links="true"] .sheet-body a:focus,
.paper-sheet[data-hide-links="true"] .sheet-body a,
.paper-sheet[data-hide-links="true"] .sheet-body a:visited,
.paper-sheet[data-hide-links="true"] .sheet-body a:hover,
.paper-sheet[data-hide-links="true"] .sheet-body a:active,
.paper-sheet[data-hide-links="true"] .sheet-body a:focus {
  color: inherit !important;
  text-decoration: none !important;
  text-decoration-line: none !important;
  -webkit-text-decoration-line: none !important;
  border: none !important;
  border-bottom: none !important;
  box-shadow: none !important;
  background: transparent !important;
  background-color: transparent !important;
  cursor: text !important;
  font-weight: inherit !important;
  font-style: inherit !important;
  letter-spacing: inherit !important;
  outline: none !important;
  opacity: 1 !important;
}

/* Technické zachování čitelnosti pro samotné QR karty v zápatí */
body[data-hide-links="true"] .doc-qr-card a,
.paper-sheet[data-hide-links="true"] .doc-qr-card a {
  color: var(--doc-text-muted, #64748b) !important;
  text-decoration: none !important;
}

/* Optional URL Source subtitle in document */
.doc-source-meta {
  font-size: 8pt;
  color: var(--doc-text-muted, #64748b);
  font-family: var(--doc-font-mono, monospace);
  margin-top: -0.2em;
  margin-bottom: 0.8em;
  padding-bottom: 4px;
  border-bottom: 0.5pt solid var(--doc-border, #e2e8f0);
  word-break: break-all;
}

/* Educational & Editorial Drop Cap */
.ebook-mode p.doc-element.first-chapter-p::first-letter,
body[data-theme="web-original"][data-web-dropcap="true"] p.doc-element.first-chapter-p::first-letter {
  font-family: var(--doc-font-heading);
  font-size: 3.1em;
  float: left;
  line-height: 0.82;
  margin-right: 0.14em;
  margin-top: 0.04em;
  color: var(--doc-primary);
  font-weight: 700;
}

body[data-theme="web-original"] .paper-sheet p.doc-element.lead-paragraph {
  font-weight: 500;
  border-bottom: 1.5pt solid var(--doc-primary-border, #e2e8f0);
  padding-bottom: 0.6em;
  margin-bottom: 0.9em;
}

/* Global Image Attribute Mappings */
body[data-img-radius="sharp"] { --doc-img-radius: 0px; }
body[data-img-radius="rounded"] { --doc-img-radius: 8px; }
body[data-img-radius="pill"] { --doc-img-radius: 16px; }

body[data-img-border="none"] { --doc-img-border: none; }
body[data-img-border="thin"] { --doc-img-border: 1pt solid var(--doc-border, #cbd5e1); }
body[data-img-border="frame"] { --doc-img-border: 3pt double var(--doc-primary-border, #94a3b8); }
body[data-img-border="comic"] { --doc-img-border: 2pt solid #0f172a; }
body[data-img-border="brutalist"] { --doc-img-border: 2pt solid #000000; }

body[data-img-shadow="none"] { --doc-img-shadow: none; }
body[data-img-shadow="soft"] { --doc-img-shadow: 0 4px 14px rgba(15, 23, 42, 0.10); }
body[data-img-shadow="hard"] { --doc-img-shadow: 3.5pt 3.5pt 0 var(--doc-primary, #0f172a); }

body[data-img-bg="none"] { --doc-img-bg: transparent; }
body[data-img-bg="card"] { --doc-img-bg: #ffffff; }
body[data-img-bg="tint"] { --doc-img-bg: var(--doc-primary-light, #f8fafc); }

/* Lists with Item-Level Splitting */
ul.doc-element, ol.doc-element {
  padding-left: 1.4em;
  margin-bottom: 0.65em;
}

li {
  margin-bottom: 0.25em;
}

/* Blockquotes */
blockquote.doc-element {
  margin: 0.75em 0;
  padding: 0.5em 1.1em;
  border-left: 3.5pt solid var(--doc-primary, #0284c7);
  background: var(--doc-primary-light, #f0f9ff);
  font-family: var(--doc-font-family, 'Inter', sans-serif);
  font-style: italic;
  color: var(--doc-text, #1e293b);
  border-radius: 0 6px 6px 0;
}

/* --------------------------------------------------------------------------
   Universal Alignment Classes (Text, Images, Tables, Callouts)
   -------------------------------------------------------------------------- */
.align-left,
[data-align="left"] {
  text-align: left !important;
  margin-left: 0 !important;
  margin-right: auto !important;
}

.align-center,
[data-align="center"] {
  text-align: center !important;
  margin-left: auto !important;
  margin-right: auto !important;
}

.align-right,
[data-align="right"] {
  text-align: right !important;
  margin-left: auto !important;
  margin-right: 0 !important;
}

.align-justify,
[data-align="justify"] {
  text-align: justify !important;
}

/* --------------------------------------------------------------------------
   Separators & Dividers (Oddělovače)
   -------------------------------------------------------------------------- */
.doc-separator {
  margin: 0.8em 0;
  width: 100%;
  box-sizing: border-box;
}

.doc-separator-solid hr {
  border: none;
  border-top: 1.5pt solid var(--doc-border, #cbd5e1);
  margin: 0;
}

.doc-separator-dotted hr {
  border: none;
  border-top: 2pt dotted var(--doc-border, #94a3b8);
  margin: 0;
}

.doc-separator-dashed hr {
  border: none;
  border-top: 1.5pt dashed var(--doc-border, #94a3b8);
  margin: 0;
}

.doc-separator-gradient {
  height: 2px;
  background: linear-gradient(90deg, transparent, var(--doc-primary, #0284c7), transparent);
}

.doc-separator-ornament {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 12px;
  color: var(--doc-text-muted, #64748b);
  font-size: 11pt;
}
.doc-separator-ornament::before,
.doc-separator-ornament::after {
  content: '';
  flex: 1;
  border-top: 1pt solid var(--doc-border, #cbd5e1);
}

.doc-separator-bar {
  height: 4px;
  background: var(--doc-primary, #0284c7);
  border-radius: 2px;
  width: 60px;
  margin: 0 auto;
}

.doc-separator-space {
  height: 15mm;
}

/* --------------------------------------------------------------------------
   Tables & Media
   -------------------------------------------------------------------------- */
table.doc-element, .sheet-body table, .wp-block-table table {
  width: 100%;
  max-width: 100%;
  border-collapse: collapse;
  margin: 0.85em 0;
  font-size: 8.5pt;
  line-height: 1.4;
  border-radius: 4px;
  background: #ffffff;
  border: 1px solid var(--doc-border, #cbd5e1);
}

table.doc-element th, .sheet-body table th {
  background: var(--doc-primary-light, #f0f9ff);
  color: var(--doc-headings, #0f172a);
  font-weight: 700;
  text-align: center;
  padding: 6px 10px;
  border: 1px solid var(--doc-border, #cbd5e1);
}

table.doc-element td, .sheet-body table td {
  padding: 6px 8px;
  border: 1px solid var(--doc-border, #cbd5e1);
  color: var(--doc-text, #1e293b);
  vertical-align: middle;
  background-color: #ffffff;
  text-align: center;
}

table.doc-element td img, .sheet-body table td img, .doc-table-img {
  max-width: 100%;
  height: auto;
  max-height: 120px;
  object-fit: contain;
  display: block;
  margin: 0 auto;
}

figure.doc-table-figure {
  margin: 0.85em 0;
  clear: both;
}

figure.doc-table-figure:has(.doc-table-infobox) {
  float: right;
  clear: right;
  margin: 0.2em 0 1em 1.2em;
  max-width: 320px;
}

/* Wikipedia & Encyclopedia Compact Summary Infobox */
table.doc-table-infobox {
  font-size: 8pt;
  margin: 0.4em 0 0.8em 0;
  max-width: 320px;
  width: 100%;
  border: 1px solid var(--doc-primary-border, #cbd5e1);
  background: var(--doc-primary-light, #f8fafc);
  border-radius: 4px;
  border-collapse: collapse;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

table.doc-table-infobox th {
  background: rgba(0, 0, 0, 0.04);
  color: var(--doc-headings, #0f172a);
  font-weight: 700;
  text-align: left;
  padding: 4px 8px;
  border: 1px solid var(--doc-border, #cbd5e1);
  width: 38%;
  font-size: 8pt;
}

table.doc-table-infobox td {
  padding: 4px 8px;
  text-align: left;
  border: 1px solid var(--doc-border, #cbd5e1);
  background: #ffffff;
  font-size: 8pt;
}

table.doc-table-infobox th[colspan],
table.doc-table-infobox .infobox-above,
table.doc-table-infobox .infobox-header {
  background: var(--doc-primary-light, #f1f5f9) !important;
  color: var(--doc-headings, #0f172a) !important;
  text-align: center;
  font-weight: 800;
  font-size: 9pt;
  border: 1px solid var(--doc-border, #cbd5e1);
}

table.doc-table-infobox ul, table.doc-table-infobox ol {
  margin: 0;
  padding-left: 14px;
}

table.doc-table-infobox li {
  margin: 1px 0;
}

/* Wikipedia & Web Image Gallery Grid */
.doc-gallery-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  gap: 8px;
  margin: 0.8em 0;
  page-break-inside: avoid;
}

.doc-gallery-item {
  border: 1px solid var(--doc-border, #cbd5e1);
  border-radius: 4px;
  padding: 6px;
  background: #ffffff;
  text-align: center;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.04);
}

.doc-gallery-item img {
  max-height: 105px;
  width: auto;
  max-width: 100%;
  object-fit: contain;
  margin: 0 auto;
  border-radius: 2px;
}

.doc-gallery-cap {
  font-size: 7.5pt;
  color: var(--doc-text-muted, #64748b);
  margin-top: 5px;
  line-height: 1.25;
  text-align: center;
}

/* Images & Figures */
.sheet-body img,
img.doc-element {
  max-width: 100%;
  max-height: 100%;
  height: auto;
  object-fit: contain;
  display: block;
  margin: 6px auto;
  border-radius: var(--doc-img-radius, 0px);
  border: var(--doc-img-border, none);
  box-shadow: var(--doc-img-shadow, none);
  transition: width 0.1s ease, max-width 0.1s ease;
}

figure.doc-element,
.sheet-body figure {
  margin: 0.8em auto;
  width: 100%;
  text-align: center;
  border-radius: var(--doc-img-radius, 0px);
  border: var(--doc-img-border, none);
  box-shadow: var(--doc-img-shadow, none);
  background: var(--doc-img-bg, transparent);
  box-sizing: border-box;
}

figure.doc-element figcaption {
  font-size: 8pt;
  color: var(--doc-text-muted, #64748b);
  margin-top: 4px;
  font-style: italic;
  text-align: center;
  line-height: 1.35;
}

/* --------------------------------------------------------------------------
   Educational Callout & Note Boxes
   -------------------------------------------------------------------------- */
.doc-callout {
  margin: 0.85em 0;
  padding: 10px 14px;
  border-radius: 6px;
  border-left: 4.5pt solid;
  position: relative;
}

.doc-callout-header {
  display: flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 0.92em;
  margin-bottom: 4px;
  font-family: var(--doc-font-heading, sans-serif);
}

.doc-callout-task {
  border-color: #0284c7;
  background: #f0f9ff;
  color: #0369a1;
}

.doc-callout-def {
  border-color: #7c3aed;
  background: #f5f3ff;
  color: #5b21b6;
}

.doc-callout-solution {
  border-color: #059669;
  background: #f0fdf4;
  color: #047857;
}

.doc-callout-warn {
  border-color: #d97706;
  background: #fffbeb;
  color: #92400e;
}

.doc-callout-summary {
  border-color: #4f46e5;
  background: #eef2ff;
  color: #3730a3;
}

.doc-callout-video {
  border-color: var(--doc-primary, #0284c7);
  background: var(--doc-primary-light, #f0f9ff);
  color: var(--doc-headings, #0369a1);
  border-radius: var(--doc-img-radius, 6px);
  box-shadow: var(--doc-img-shadow, none);
}
.doc-callout-video a {
  color: var(--doc-primary, #0284c7);
  text-decoration: underline;
  word-break: break-all;
  font-size: 8.5pt;
}

/* Note Taking Surfaces */
.doc-notes-area {
  margin: 1em 0;
  padding: 10px 12px;
  border: 1px dashed var(--doc-border, #cbd5e1);
  border-radius: 6px;
  background: #ffffff;
  position: relative;
}

.doc-notes-title {
  font-size: 8pt;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  color: var(--doc-text-muted, #64748b);
  margin-bottom: 6px;
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.doc-notes-lines {
  width: 100%;
  min-height: 28mm;
  background-image: repeating-linear-gradient(
    transparent,
    transparent 6.7mm,
    var(--doc-line-color, #cbd5e1) 6.7mm,
    var(--doc-line-color, #cbd5e1) 7mm
  );
  line-height: 7mm;
}

.doc-notes-dots {
  width: 100%;
  min-height: 28mm;
  background-image: radial-gradient(var(--doc-line-color, #94a3b8) 1px, transparent 1px);
  background-size: 5mm 5mm;
}

/* QR Code Card (Audio & Inline Link Cards — Template-Aware + 4 Size Modes) */
.doc-qr-card,
.doc-qr-inline-card {
  --qr-scale: 1;
  --qr-box-dim: 20mm;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 11px;
  margin: 0.55em 0 0.75em 0;
  width: 100%;
  box-sizing: border-box;
  font-family: var(--doc-font-family, sans-serif);
  color: var(--doc-text, #1e293b);
  border: 1pt solid var(--doc-primary-border, var(--doc-border, #cbd5e1));
  border-radius: var(--doc-img-radius, 6px);
  background: var(--doc-primary-light, var(--doc-callout-bg, #f8fafc));
  box-shadow: var(--doc-img-shadow, none);
  page-break-inside: avoid;
  break-inside: avoid;
}

.doc-qr-inline-card {
  border-left: 3.5pt solid var(--doc-primary, #0284c7);
}

.doc-qr-canvas-wrapper {
  flex-shrink: 0;
  width: calc(var(--qr-box-dim, 20mm) * var(--qr-scale, 1));
  height: calc(var(--qr-box-dim, 20mm) * var(--qr-scale, 1));
  background: #ffffff !important;
  border: 1px solid var(--doc-primary-border, var(--doc-border, #e2e8f0));
  border-radius: calc(var(--doc-img-radius, 4px) * 0.5);
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2.5px;
  box-sizing: border-box;
}

.doc-qr-canvas-wrapper svg {
  width: 100%;
  height: 100%;
  display: block;
  shape-rendering: crispEdges;
  filter: none !important;
}

.doc-qr-info {
  flex: 1;
  min-width: 0;
}

.doc-qr-badge {
  display: inline-block;
  font-family: var(--doc-font-heading, sans-serif);
  font-size: 6.8pt;
  font-weight: 700;
  letter-spacing: 0.3px;
  padding: 1px 6px;
  border-radius: calc(var(--doc-img-radius, 4px) * 0.4);
  background: var(--doc-primary, #0284c7);
  color: #ffffff;
  text-transform: uppercase;
  margin-bottom: 2px;
  line-height: 1.3;
}

.doc-qr-title {
  font-family: var(--doc-font-heading, sans-serif);
  font-size: 8.5pt;
  font-weight: 700;
  color: var(--doc-headings, #0f172a);
  margin-bottom: 2px;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.doc-qr-url,
.doc-qr-url a {
  font-size: 7.2pt;
  color: var(--doc-text-muted, #64748b);
  font-family: var(--doc-font-mono, monospace);
  word-break: break-all;
  text-decoration: none;
  line-height: 1.25;
}

.doc-qr-url a:hover {
  color: var(--doc-primary, #0284c7);
  text-decoration: underline;
}

/* --------------------------------------------------------------------------
   QR BOX SIZE VARIANTS:
   1. full    — Plná (na šířku strany / column-span: all)
   2. medium  — Střední (šířka sloupce / výchozí)
   3. small   — Malá (úsporná velikost)
   4. minimal — Minimální (pouze QR kód)
   -------------------------------------------------------------------------- */

/* 1. PLNÁ (Full Page Width — spans across all columns in multi-column templates) */
body[data-qr-size="full"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]),
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="full"],
.doc-callout-video[data-qr-size="full"] {
  --qr-box-dim: 25mm;
  column-span: all;
  width: 100%;
  padding: 10px 14px;
  gap: 14px;
  margin: 0.75em 0;
}

body[data-qr-size="full"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-title,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="full"] .doc-qr-title {
  font-size: 9.5pt;
  white-space: normal;
}

body[data-qr-size="full"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-url,
body[data-qr-size="full"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-url a,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="full"] .doc-qr-url,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="full"] .doc-qr-url a {
  font-size: 8pt;
}

/* 2. STŘEDNÍ (Medium — Column Width) */
body[data-qr-size="medium"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]),
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="medium"],
.doc-callout-video[data-qr-size="medium"] {
  --qr-box-dim: 20mm;
  column-span: none;
  width: 100%;
  padding: 7px 11px;
  gap: 10px;
}

/* 3. MALÁ (Small — Space-Saving Compact Card) */
body[data-qr-size="small"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]),
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="small"],
.doc-callout-video[data-qr-size="small"] {
  --qr-box-dim: 13.5mm;
  column-span: none;
  width: 100%;
  padding: 4px 8px;
  gap: 8px;
  margin: 0.3em 0 0.45em 0;
  border-left-width: 2.5pt;
}

body[data-qr-size="small"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-canvas-wrapper,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="small"] .doc-qr-canvas-wrapper {
  padding: 1.5px;
}

body[data-qr-size="small"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-badge,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="small"] .doc-qr-badge {
  font-size: 5.8pt;
  padding: 0.5px 4px;
  margin-bottom: 1px;
}

body[data-qr-size="small"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-title,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="small"] .doc-qr-title {
  font-size: 7.5pt;
  margin-bottom: 1px;
  line-height: 1.15;
}

body[data-qr-size="small"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-url,
body[data-qr-size="small"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-url a,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="small"] .doc-qr-url,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="small"] .doc-qr-url a {
  font-size: 6.2pt;
  line-height: 1.1;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  display: block;
}

/* 4. MINIMÁLNÍ (Minimal — QR Code Only) */
body[data-qr-size="minimal"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]),
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="minimal"],
.doc-callout-video[data-qr-size="minimal"] {
  --qr-box-dim: 15mm;
  column-span: none;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: auto !important;
  max-width: fit-content;
  padding: 3px;
  gap: 2px;
  margin: 0.25em 6px 0.35em 0;
  vertical-align: middle;
  border-left-width: 1pt;
}

body[data-qr-size="minimal"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-canvas-wrapper,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="minimal"] .doc-qr-canvas-wrapper {
  border: none;
  padding: 1px;
}

body[data-qr-size="minimal"] :is(.doc-qr-card, .doc-qr-inline-card):not([data-qr-size]) .doc-qr-info,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="minimal"] .doc-qr-info,
.doc-callout-video[data-qr-size="minimal"] .doc-callout-header,
.doc-callout-video[data-qr-size="minimal"] p,
.doc-callout-video[data-qr-size="minimal"] span,
.doc-callout-video[data-qr-size="minimal"] img {
  display: none !important;
}

/* Show tiny #N reference label on minimal QR card if data-qr-short is present */
body[data-qr-size="minimal"] :is(.doc-qr-card, .doc-qr-inline-card)[data-qr-short]:not([data-qr-size])::after,
:is(.doc-qr-card, .doc-qr-inline-card)[data-qr-size="minimal"][data-qr-short]::after {
  content: attr(data-qr-short);
  font-family: var(--doc-font-mono, monospace);
  font-size: 5.5pt;
  font-weight: 700;
  color: var(--doc-headings, #0f172a);
  line-height: 1;
  letter-spacing: 0.2px;
}

/* Alignment support for minimal / scaled QR boxes */
:is(.doc-qr-card, .doc-qr-inline-card).align-center {
  margin-left: auto;
  margin-right: auto;
}
:is(.doc-qr-card, .doc-qr-inline-card).align-right {
  margin-left: auto;
  margin-right: 0;
}

/* QR Code Appendix / Footnotes Grid */
.doc-qr-appendix {
  margin: 1.2em 0 0.8em 0;
  padding: 12px 14px;
  border-radius: 8px;
  border: 1.5pt solid var(--doc-primary-border, #bae6fd);
  background: var(--doc-primary-light, #f8fafc);
  page-break-inside: avoid;
  break-inside: avoid;
}

.doc-qr-appendix-header {
  font-family: var(--doc-font-heading, sans-serif);
  font-size: 9.5pt;
  font-weight: 800;
  color: var(--doc-primary, #0284c7);
  margin-bottom: 10px;
  display: flex;
  align-items: center;
  gap: 6px;
  border-bottom: 1px solid var(--doc-border, #cbd5e1);
  padding-bottom: 5px;
}

.doc-qr-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(200px, 1fr));
  gap: 8px;
}

.doc-qr-item {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #ffffff;
  padding: 6px 8px;
  border: 1px solid var(--doc-border, #cbd5e1);
  border-radius: 6px;
  page-break-inside: avoid;
  break-inside: avoid;
}

.doc-qr-thumb {
  width: 18mm;
  height: 18mm;
  flex-shrink: 0;
  background: #ffffff;
  border: 1px solid var(--doc-border, #e2e8f0);
  border-radius: 4px;
  padding: 2px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.doc-qr-thumb svg {
  width: 100%;
  height: 100%;
  display: block;
}

.doc-qr-meta {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 2px;
}

.doc-qr-num {
  display: inline-block;
  font-size: 7.5pt;
  font-weight: 800;
  color: var(--doc-primary, #0284c7);
}

.doc-qr-label {
  font-size: 8pt;
  font-weight: 600;
  color: var(--doc-headings, #0f172a);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.doc-qr-url-item {
  font-size: 6.5pt;
  color: var(--doc-text-muted, #64748b);
  font-family: var(--doc-font-mono, monospace);
  word-break: break-all;
  line-height: 1.2;
}

/* Dynamic TOC */

.doc-toc-wrapper {
  margin: 1em 0 1.4em 0;
  padding: var(--doc-box-padding, 12px 16px);
  border: 1.5pt solid var(--doc-primary-border, #bae6fd);
  background: var(--doc-primary-light, #f0f9ff);
  border-radius: 6px;
  position: relative;
  font-family: var(--doc-font-family, sans-serif);
  break-inside: avoid;
}

.doc-toc-wrapper.standalone-toc {
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
}

.doc-toc-wrapper.standalone-toc .doc-toc-title {
  font-size: calc(1.4 * var(--doc-heading-scale, 1.25) * 1rem);
  margin-bottom: 1.2em;
  padding-bottom: 0.4em;
  border-bottom: 2pt solid var(--doc-primary-border, #bae6fd);
}

.doc-toc-title {
  font-family: var(--doc-font-heading, sans-serif);
  font-size: calc(1.1 * var(--doc-heading-scale, 1.25) * 1rem);
  font-weight: 800;
  color: var(--doc-primary, #0284c7);
  margin-bottom: 8px;
  border-bottom: 1.5pt solid var(--doc-primary-border, #bae6fd);
  padding-bottom: 4px;
}

.doc-toc-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

.doc-toc-item {
  display: flex;
  align-items: baseline;
  margin-bottom: 5px;
  font-size: 8.5pt;
  cursor: pointer;
  border-radius: 3px;
  padding: 1px 3px;
  font-family: var(--doc-font-family, sans-serif);
  letter-spacing: var(--doc-letter-spacing, 0px);
}

.doc-toc-item:hover {
  background: rgba(2, 132, 199, 0.08);
}

.doc-toc-item.level-1 {
  font-family: var(--doc-font-heading, var(--doc-font-family));
  font-weight: 700;
  color: var(--doc-headings, #0f172a);
  margin-top: 4px;
}

.doc-toc-item.level-2 {
  padding-left: 14px;
  color: var(--doc-text, #1e293b);
  font-weight: 500;
}

.doc-toc-item.level-3 {
  padding-left: 24px;
  color: var(--doc-text-muted, #64748b);
  font-size: 8pt;
}

.doc-toc-leader {
  flex-grow: 1;
  border-bottom: 1pt dotted var(--doc-border, #cbd5e1);
  margin: 0 6px;
  height: 1px;
}

.doc-toc-page {
  flex-shrink: 0;
  font-weight: 700;
  font-family: var(--doc-font-mono, monospace);
  color: var(--doc-primary, #0284c7);
}

/* Page Break Indicator */
.doc-page-break {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  margin: 1em 0;
  padding: 6px;
  background: rgba(2, 132, 199, 0.06);
  border: 1.5px dashed #0284c7;
  border-radius: 6px;
  color: #0284c7;
  font-size: 7.5pt;
  font-weight: 700;
  text-transform: uppercase;
  letter-spacing: 0.8px;
  user-select: none;
}

/* --------------------------------------------------------------------------
   Native Browser Print Rules (@media print)
   -------------------------------------------------------------------------- */
@page {
  size: auto;
  margin: 0mm;
}

@media print {
  html,
  body {
    background: #ffffff !important;
    margin: 0 !important;
    padding: 0 !important;
    height: auto !important;
    min-height: 100% !important;
    overflow: visible !important;
    position: static !important;
    display: block !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  .app-sidebar,
  .app-topbar,
  .inspector-sidebar,
  .canvas-drawer,
  .canvas-drawer-toggle,
  .canvas-bottom-bar,
  .modal-overlay,
  .empty-workspace-card,
  .app-toast,
  .drop-zone-overlay,
  .no-print {
    display: none !important;
  }

  .app-main,
  .app-center,
  #app-main-layout,
  #app-canvas-container {
    display: block !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    overflow: visible !important;
    position: static !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }

  .sheet-viewport {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    background: transparent !important;
    overflow: visible !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    position: static !important;
    transform: none !important;
    width: 100% !important;
  }

  .sheet-zoom-wrapper {
    display: block !important;
    padding: 0 !important;
    margin: 0 !important;
    gap: 0 !important;
    transform: none !important;
    overflow: visible !important;
    height: auto !important;
    min-height: auto !important;
    max-height: none !important;
    position: static !important;
    width: 100% !important;
  }

  .paper-sheet {
    box-shadow: none !important;
    border: none !important;
    margin: 0 !important;
    box-sizing: border-box !important;
    page-break-after: always !important;
    break-after: page !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    position: relative !important;
    overflow: hidden !important;
  }

  .paper-sheet:last-child {
    page-break-after: auto !important;
    break-after: auto !important;
  }

  .sheet-inner {
    height: 100% !important;
    overflow: hidden !important;
    display: flex !important;
    flex-direction: column !important;
  }

  .sheet-body {
    overflow: hidden !important;
    flex: 1 !important;
  }

  .sheet-footer {
    position: relative !important;
    z-index: 2 !important;
    background-color: var(--doc-paper-bg, #ffffff) !important;
  }

  .doc-page-break {
    display: none !important;
  }

  .doc-element:hover,
  .doc-element.active-selected {
    outline: none !important;
    background-color: transparent !important;
  }

  body[data-hide-links="true"] .sheet-body a,
  body[data-hide-links="true"] .paper-sheet .sheet-body a,
  .paper-sheet[data-hide-links="true"] .sheet-body a {
    color: inherit !important;
    text-decoration: none !important;
    text-decoration-line: none !important;
    border-bottom: none !important;
    box-shadow: none !important;
    background: transparent !important;
  }
}