/*
 * mod/pdfWriter - scoped under .pdfWriter, custom properties --pdfWriter-* declared on the root (never :root).
 * The host page decides the theme: html.darkTheme switches the palette of the frame, the sheet stays white paper.
 * A host may override any --pdfWriter-* property to match its own design (the PDF24 Toolbox does).
 * The document's own look (fonts, headings, tables) comes from pdfWriter.mjs (docCss) - the same on the sheet and
 * in the exported HTML.
 */
.pdfWriter {
	--pdfWriter-bg: #e9ebee;
	--pdfWriter-surface: #ffffff;
	--pdfWriter-surface-2: #f6f7f9;
	--pdfWriter-text: #1f2937;
	--pdfWriter-muted: #6b7280;
	--pdfWriter-border: #d4d8dd;
	--pdfWriter-accent: #0078d5;
	--pdfWriter-accent-soft: rgba(0, 120, 213, .12);
	--pdfWriter-primary: #0078d5;
	--pdfWriter-primary-text: #ffffff;
	--pdfWriter-hover: rgba(0, 0, 0, .06);
	--pdfWriter-radius: 8px;
	--pdfWriter-shadow: 0 2px 10px rgba(0, 0, 0, .15);
	--pdfWriter-sheet-shadow: 0 1px 4px rgba(0, 0, 0, .2), 0 6px 18px rgba(0, 0, 0, .08);

	position: relative;
	display: flex;
	flex-direction: column;
	min-height: 320px;
	height: 100%;
	box-sizing: border-box;
	background: var(--pdfWriter-bg);
	color: var(--pdfWriter-text);
	font: 14px/1.4 system-ui, -apple-system, "Segoe UI", Roboto, sans-serif;
	/* nothing of the host page's text layout inherited */
	text-align: start;
	letter-spacing: normal;
	text-transform: none;
}
html.darkTheme .pdfWriter {
	--pdfWriter-bg: #16181b;
	--pdfWriter-surface: #22252a;
	--pdfWriter-surface-2: #2b2f35;
	--pdfWriter-text: #e5e7eb;
	--pdfWriter-muted: #9ca3af;
	--pdfWriter-border: #3a3f46;
	--pdfWriter-accent: #4aa3ff;
	--pdfWriter-accent-soft: rgba(74, 163, 255, .18);
	--pdfWriter-hover: rgba(255, 255, 255, .08);
	--pdfWriter-shadow: 0 2px 10px rgba(0, 0, 0, .5);
	--pdfWriter-sheet-shadow: 0 1px 4px rgba(0, 0, 0, .6);
}

/* ---- toolbar: groups wrap onto a second row in narrow windows, nothing is hidden ---- */
.pdfWriter .pdfWriter-toolbar {
	flex: none;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: 4px 2px;
	padding: 6px 10px;
	background: var(--pdfWriter-surface);
	border-bottom: 1px solid var(--pdfWriter-border);
	user-select: none;
}
.pdfWriter .pdfWriter-group {
	display: flex;
	align-items: center;
	gap: 2px;
}
/* narrow (a phone, a small embedding): the toolbar one row to swipe sideways instead of five rows; page setup and
   "Create PDF" stay in view at its end */
.pdfWriter {
	container-type: inline-size;
}
@container (max-width: 720px) {
	.pdfWriter .pdfWriter-toolbar {
		flex-wrap: nowrap;
		overflow-x: auto;
		overscroll-behavior-x: contain;
		scrollbar-width: thin;
	}
	.pdfWriter .pdfWriter-toolbar > * {
		flex: none;
	}
	.pdfWriter .pdfWriter-toolbar > .pdfWriter-spacer {
		flex: 1 0 8px;
	}
	.pdfWriter .pdfWriter-toolbar > .pdfWriter-group:last-child {
		position: sticky;
		inset-inline-end: -10px;
		padding-inline: 6px 10px;
		background: var(--pdfWriter-surface);
		box-shadow: -10px 0 10px -10px rgba(0, 0, 0, .35);
	}
	[dir="rtl"] .pdfWriter .pdfWriter-toolbar > .pdfWriter-group:last-child {
		box-shadow: 10px 0 10px -10px rgba(0, 0, 0, .35);
	}
	.pdfWriter .pdfWriter-textBtn span {
		display: none;
	}
	.pdfWriter .pdfWriter-pages {
		padding: 10px;
	}
}
/* a phone: "Create PDF" as its icon (the title says it), so the toolbar keeps room to swipe */
@container (max-width: 480px) {
	.pdfWriter .pdfWriter-primary span {
		display: none;
	}
}
.pdfWriter .pdfWriter-sep {
	width: 1px;
	height: 24px;
	margin: 0 5px;
	background: var(--pdfWriter-border);
}
.pdfWriter .pdfWriter-spacer {
	flex: 1 1 auto;
}
.pdfWriter .pdfWriter-btn {
	box-sizing: border-box;
	position: relative;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	height: 32px;
	min-width: 32px;
	padding: 0 6px;
	border: 1px solid transparent;
	border-radius: var(--pdfWriter-radius);
	background: transparent;
	color: inherit;
	font: inherit;
	cursor: pointer;
}
.pdfWriter .pdfWriter-btn:hover {
	background: var(--pdfWriter-hover);
}
.pdfWriter .pdfWriter-btn.active {
	background: var(--pdfWriter-accent-soft);
	color: var(--pdfWriter-accent);
}
.pdfWriter .pdfWriter-btn:disabled {
	opacity: .4;
	cursor: default;
	background: transparent;
}
.pdfWriter .pdfWriter-btn:focus-visible,
.pdfWriter .pdfWriter-select:focus-visible,
.pdfWriter .pdfWriter-name:focus-visible {
	outline: 2px solid var(--pdfWriter-accent);
	outline-offset: 1px;
}
.pdfWriter .pdfWriter-textBtn {
	padding: 0 10px;
}
.pdfWriter .pdfWriter-menuBtn {
	gap: 0;
	padding-block: 0; padding-inline: 6px 2px;
}
.pdfWriter .pdfWriter-primary {
	padding: 0 14px;
	background: var(--pdfWriter-primary);
	color: var(--pdfWriter-primary-text);
	font-weight: 600;
}
.pdfWriter .pdfWriter-primary:hover {
	background: var(--pdfWriter-primary);
	filter: brightness(1.08);
}
.pdfWriter .pdfWriter-colorBtn {
	flex-direction: column;
	gap: 0;
	padding: 2px 6px;
}
.pdfWriter .pdfWriter-colorBtn svg {
	height: 16px;
}
.pdfWriter .pdfWriter-swatch {
	display: block;
	width: 18px;
	height: 4px;
	border-radius: 1px;
	box-shadow: inset 0 0 0 1px rgba(128, 128, 128, .4);
}
.pdfWriter .pdfWriter-select,
.pdfWriter .pdfWriter-name {
	box-sizing: border-box;
	height: 32px;
	padding: 0 6px;
	border: 1px solid var(--pdfWriter-border);
	border-radius: var(--pdfWriter-radius);
	background: var(--pdfWriter-surface);
	color: inherit;
	font: inherit;
}
.pdfWriter .pdfWriter-style { width: 130px; }
.pdfWriter .pdfWriter-font { width: 150px; }
.pdfWriter .pdfWriter-size { width: 62px; }
.pdfWriter .pdfWriter-name {
	width: 170px;
	margin-inline-start: 4px;
}

/* ---- flow: no height of its own, the page scrolls (config flow) ---- */
.pdfWriter.pdfWriter-flow {
	height: auto;
}
.pdfWriter.pdfWriter-flow .pdfWriter-toolbar {
	position: sticky;
	top: 0;
	z-index: 20;
}
.pdfWriter.pdfWriter-flow .pdfWriter-pages {
	overflow: visible;
	overflow-x: auto;
}
.pdfWriter.pdfWriter-flow .pdfWriter-status {
	position: sticky;
	bottom: 0;
	z-index: 20;
}
.pdfWriter.pdfWriter-flow .pdfWriter-toast {
	position: fixed;
}

/* ---- the sheet ---- */
.pdfWriter .pdfWriter-pages {
	flex: 1 1 auto;
	min-height: 0;
	overflow: auto;
	padding: 24px;
}
.pdfWriter .pdfWriter-sheetBox {
	margin: 0 auto;
}
.pdfWriter .pdfWriter-sheet {
	position: relative;
	box-sizing: border-box;
	background: #fff;
	color: #000;
	box-shadow: var(--pdfWriter-sheet-shadow);
	transform-origin: 0 0;
	cursor: text;
}
.pdfWriter .pdfWriter-editor .ProseMirror {
	outline: none;
	min-height: 100%;
}
.pdfWriter .pdfWriter-editor .ProseMirror p.is-editor-empty:first-child::before {
	content: attr(data-placeholder);
	float: inline-start;
	height: 0;
	color: #9aa0a6;
	pointer-events: none;
}
.pdfWriter .pdfWriter-editor .ProseMirror img.ProseMirror-selectednode,
.pdfWriter .pdfWriter-editor .ProseMirror .pdfWriter-pageBreak.ProseMirror-selectednode {
	outline: 2px solid var(--pdfWriter-accent);
}
.pdfWriter .pdfWriter-editor .ProseMirror .selectedCell {
	background: rgba(0, 120, 213, .14);
}
/* a page break on the sheet: a labelled gap (in the PDF: the next page) */
.pdfWriter .pdfWriter-editor .ProseMirror .pdfWriter-pageBreak {
	height: 14px;
	margin: 6px 0;
	border-top: 1px dashed #9aa0a6;
	cursor: default;
}
/* where the pages end (drawn from the content height of a page) */
.pdfWriter .pdfWriter-lines {
	position: absolute;
	inset: 0;
	pointer-events: none;
}
.pdfWriter .pdfWriter-line {
	position: absolute;
	inset-inline-start: 0;
	inset-inline-end: 0;
	border-top: 1px dashed rgba(0, 120, 213, .45);
}
.pdfWriter .pdfWriter-line span {
	position: absolute;
	inset-inline-end: 6px;
	top: -9px;
	padding: 0 4px;
	background: #fff;
	color: rgba(0, 120, 213, .8);
	font: 11px/16px system-ui, sans-serif;
}

/* ---- status bar ---- */
.pdfWriter .pdfWriter-status {
	flex: none;
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 4px 12px;
	background: var(--pdfWriter-surface);
	border-top: 1px solid var(--pdfWriter-border);
	color: var(--pdfWriter-muted);
	font-size: 13px;
}
.pdfWriter .pdfWriter-status .pdfWriter-select {
	height: 26px;
}

/* ---- popovers: colours, link, table menu, page setup ---- */
.pdfWriter .pdfWriter-popover {
	position: absolute;
	z-index: 20;
	min-width: 180px;
	padding: 6px;
	background: var(--pdfWriter-surface);
	border: 1px solid var(--pdfWriter-border);
	border-radius: var(--pdfWriter-radius);
	box-shadow: var(--pdfWriter-shadow);
}
.pdfWriter .pdfWriter-colors {
	display: grid;
	grid-template-columns: repeat(10, 22px);
	gap: 4px;
	padding: 4px;
}
.pdfWriter .pdfWriter-color {
	width: 22px;
	height: 22px;
	padding: 0;
	border: 1px solid rgba(128, 128, 128, .5);
	border-radius: 4px;
	cursor: pointer;
}
.pdfWriter .pdfWriter-color:hover {
	outline: 2px solid var(--pdfWriter-accent);
}
.pdfWriter .pdfWriter-menuItem {
	display: block;
	width: 100%;
	padding: 7px 10px;
	border: 0;
	border-radius: 6px;
	background: transparent;
	color: inherit;
	font: inherit;
	text-align: start;
	cursor: pointer;
	white-space: nowrap;
}
.pdfWriter .pdfWriter-menuItem:hover:not(:disabled) {
	background: var(--pdfWriter-hover);
}
.pdfWriter .pdfWriter-menuItem:disabled {
	opacity: .4;
	cursor: default;
}
.pdfWriter .pdfWriter-menuSep {
	height: 1px;
	margin: 4px 2px;
	background: var(--pdfWriter-border);
}
.pdfWriter .pdfWriter-form {
	display: flex;
	flex-direction: column;
	gap: 8px;
	padding: 6px;
	min-width: 280px;
}
.pdfWriter .pdfWriter-form label {
	display: flex;
	flex-direction: column;
	gap: 4px;
}
.pdfWriter .pdfWriter-form input[type="url"] {
	box-sizing: border-box;
	height: 32px;
	padding: 0 8px;
	border: 1px solid var(--pdfWriter-border);
	border-radius: var(--pdfWriter-radius);
	background: var(--pdfWriter-surface);
	color: inherit;
	font: inherit;
}
.pdfWriter .pdfWriter-formButtons {
	display: flex;
	justify-content: flex-end;
	gap: 6px;
}
.pdfWriter .pdfWriter-default {
	border-color: var(--pdfWriter-border);
}
.pdfWriter .pdfWriter-pageForm .pdfWriter-row {
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
}
.pdfWriter .pdfWriter-pageForm .pdfWriter-select {
	width: 160px;
}

.pdfWriter .pdfWriter-toast {
	position: absolute;
	left: 50%;
	bottom: 48px;
	transform: translateX(-50%);
	padding: 10px 16px;
	border-radius: var(--pdfWriter-radius);
	background: #323232;
	color: #fff;
	box-shadow: var(--pdfWriter-shadow);
	z-index: 30;
}
.pdfWriter .pdfWriter-printFrame {
	position: absolute;
	width: 0;
	height: 0;
	border: 0;
	visibility: hidden;
}

/* header and footer in the sheet's margins - a preview, greyed (printed by the host on every page) */
.pdfWriter .pdfWriter-hfHead,
.pdfWriter .pdfWriter-hfFoot {
	position: absolute;
	transform: translateY(-50%);
	display: flex;
	justify-content: space-between;
	gap: 12px;
	min-height: 1em;
	color: #8a9099;
	font: 9pt/1.2 Arial, sans-serif;
	white-space: nowrap;
	overflow: hidden;
	pointer-events: none;
}
.pdfWriter .pdfWriter-hfHead {
	justify-content: center;
}
.pdfWriter .pdfWriter-hfFoot {
	transform: translateY(50%);
}
.pdfWriter .pdfWriter-hfNum.center {
	position: absolute;
	left: 50%;
	transform: translateX(-50%);
}
.pdfWriter .pdfWriter-hint {
	color: var(--pdfWriter-muted);
	font-size: 12px;
	max-width: 300px;
}
.pdfWriter .pdfWriter-pageForm input[type="text"] {
	width: 160px;
}