/*
 * Fleet Base: embedded PDF documents (legal pages). Loaded with pdf-viewer.js, only on pages that
 * contain a.pdfemb-viewer. Colors come from the palette presets; a child theme can restyle the viewer
 * by setting these custom properties (for example on .pdf-doc):
 *   --pdf-radius, --pdf-shadow, --pdf-bg, --pdf-toolbar-bg, --pdf-toolbar-fg, --pdf-link
 */

.pdf-doc {
	overflow: hidden;
	border-radius: var(--pdf-radius, 12px);
	background: var(--pdf-bg, color-mix(in srgb, var(--wp--preset--color--contrast) 8%, var(--wp--preset--color--base)));
	box-shadow: var(--pdf-shadow, 0 0 0 1px color-mix(in srgb, var(--wp--preset--color--contrast) 12%, transparent));
}

/*
 * Before the page is drawn (the plain link, then "Loading…"): a box of the page's shape (US Letter), plus room for
 * the toolbar on touch screens, so nothing below jumps when the viewer appears.
 */
a.pdfemb-viewer,
.pdfemb-loadingmsg {
	box-sizing: border-box;
	display: grid;
	place-items: center;
	width: 100%;
	aspect-ratio: 8.5 / 11;
	padding: 1.5rem;
	text-align: center;
}

a.pdfemb-viewer {
	color: var(--pdf-link, var(--wp--preset--color--primary));
	font-weight: 600;
}

@media (hover: none) {
	a.pdfemb-viewer,
	.pdfemb-loadingmsg {
		margin-bottom: 3.5rem;
	}
}

div.pdfemb-viewer {
	position: relative;
	-webkit-user-select: none;
	user-select: none;
	-webkit-touch-callout: none;
}

.pdfemb-pagescontainer {
	display: flex;
	overflow: hidden;
	background: var(--pdf-bg, color-mix(in srgb, var(--wp--preset--color--contrast) 8%, var(--wp--preset--color--base)));
}

/* Zoomed in: scrolls by dragging, the wheel or touch, without scrollbars (as in the original viewer). */
.pdfemb-pagescontainer.is-zoomed {
	overflow: auto;
	cursor: grab;
	scrollbar-width: none;
}

.pdfemb-pagescontainer.is-zoomed::-webkit-scrollbar {
	display: none;
}

.pdfemb-pagescontainer:focus-visible {
	outline: 2px solid var(--wp--preset--color--primary);
	outline-offset: -3px;
}

.pdfemb-pagescontainer.is-grabbing {
	cursor: grabbing;
}

/* margin:auto centres a page smaller than the box without clipping one that is larger. */
.pdfemb-the-canvas {
	flex: none;
	display: block;
	margin: auto;
	background: #fff;
	-webkit-user-drag: none;
}

.pdfemb-errormsg {
	padding: 3rem 1.5rem;
	text-align: center;
}

/* Toolbar: over the bottom of the page, shown on hover or keyboard focus; on touch screens, below the page. */
.pdfemb-toolbar {
	position: absolute;
	right: 0;
	bottom: 0;
	left: 0;
	z-index: 2;
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 3.5rem;
	gap: 0.375rem 0.75rem;
	padding: 0.5rem 0.75rem;
	background: var(--pdf-toolbar-bg, color-mix(in srgb, var(--wp--preset--color--contrast) 92%, transparent));
	color: var(--pdf-toolbar-fg, var(--wp--preset--color--base));
	font-size: 0.875rem;
	line-height: 1.2;
	opacity: 0;
	transform: translateY(100%);
	transition: opacity 0.2s, transform 0.2s;
}

/* :focus-visible, not :focus-within, so a mouse click on a button does not pin the toolbar over the page. */
div.pdfemb-viewer:is(:hover, :has(:focus-visible)) .pdfemb-toolbar {
	opacity: 1;
	transform: none;
}

@media (hover: none) {
	div.pdfemb-viewer .pdfemb-toolbar {
		position: static;
		opacity: 1;
		transform: none;
	}
}

/* Narrow screens: numbers only ("1 / 12", "100%"), so the toolbar stays on one row. */
@media (max-width: 29.99em) {
	.pdfemb-toolbar {
		gap: 0.375rem 0.5rem;
	}

	.pdfemb-label {
		display: none;
	}
}

.pdfemb-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip-path: inset(50%);
	white-space: nowrap;
}

.pdfemb-toolbar button {
	display: inline-grid;
	place-items: center;
	width: 2.5rem;
	height: 2.5rem;
	padding: 0;
	border: 1px solid transparent;
	border-radius: 10px;
	background: rgb(255 255 255 / 0.12);
	color: inherit;
	cursor: pointer;
}

.pdfemb-toolbar button:hover {
	background: rgb(255 255 255 / 0.22);
}

.pdfemb-toolbar button:disabled {
	opacity: 0.4;
	cursor: default;
}

.pdfemb-toolbar :focus-visible {
	outline: 2px solid currentColor;
	outline-offset: 2px;
}

.pdfemb-toolbar button::before {
	content: "";
	width: 1.125rem;
	height: 1.125rem;
	background: currentColor;
	-webkit-mask: var(--pdf-icon) center / contain no-repeat;
	mask: var(--pdf-icon) center / contain no-repeat;
}

.pdfemb-prev {
	--pdf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M15 6l-6 6 6 6'/%3E%3C/svg%3E");
}

.pdfemb-next {
	--pdf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M9 6l6 6-6 6'/%3E%3C/svg%3E");
}

.pdfemb-zoomout {
	--pdf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M5 12h14'/%3E%3C/svg%3E");
}

.pdfemb-zoomin {
	--pdf-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='2' stroke-linecap='round'%3E%3Cpath d='M12 5v14M5 12h14'/%3E%3C/svg%3E");
}

.pdfemb-page-area,
.pdfemb-zoom-area {
	font-variant-numeric: tabular-nums;
}

/* Windows High Contrast: keep the icon-only buttons visible. */
@media (forced-colors: active) {
	.pdfemb-toolbar button::before {
		forced-color-adjust: none;
		background: ButtonText;
	}

	.pdfemb-toolbar button:disabled::before {
		background: GrayText;
	}
}
