/*
 * Overrides for the stock pdfjs-dist stylesheet.
 */

:root {
  color-scheme: only light;
}

.page {
  position: relative;
}

.pdfjs-overrides {
  --page-margin: 0;
  --page-border: none;
}

.pdfjs-overrides .annotationLayer {
  --input-unfocused-border-color: transparent;
  --input-hover-border-color: rgba(170, 157, 157, 0.5);
  --input-focus-border-color: rgba(170, 157, 157, 0.5);
  --input-focus-outline: none;
}

.pdfjs-overrides .annotationLayer .textWidgetAnnotation :is(input, textarea),
.pdfjs-overrides .annotationLayer .textWidgetAnnotation :is(input, textarea):is(:hover, :focus) {
  /*
   * As the overlay: its font, whose baseline is --acrofield-baseline-offset below the middle of the line box
   * (acrofield-overlay.component.scss), and no kerning, as pdf-lib applies none when it writes the text into the PDF.
   */
  font-family: 'Liberation Sans Overlay', 'Liberation Sans';
  font-kerning: none;
  border: calc(1px * var(--total-scale-factor))  solid transparent;
  /* the text starts at the inset of the exported PDF: the border width of the field (set by the viewer) and the padding */
  padding: 0 calc((var(--acrofield-border-width, 0px) + var(--acrofield-padding) - 1px) * var(--total-scale-factor));

  line-height: calc(var(--acrofield-line-height) * var(--total-scale-factor));

  /* A textarea scrollbar would narrow the content box and offset the text against the overlay. */
  overflow: hidden;
}

/*
 * The first baseline is one line height below the inset, as in the exported PDF: the padding places the middle of the
 * first line box half a line height below the inset, the baseline is below the middle.
 */
.pdfjs-overrides .annotationLayer .textWidgetAnnotation textarea,
.pdfjs-overrides .annotationLayer .textWidgetAnnotation textarea:is(:hover, :focus) {
  padding-top: calc((var(--acrofield-border-width, 0px) + var(--acrofield-padding) + var(--acrofield-line-height) / 2 - 1px) * var(--total-scale-factor) - var(--acrofield-baseline-offset, 0em));
}

/*
 * A single line control centers its line box in the content box, its baseline below the center. The exported PDF draws
 * the baseline below the center of the field (set by the viewer): a padding of twice a distance moves the center by it,
 * the top padding down by the offset of the exported PDF, the bottom padding up by the baseline of the line box.
 */
.pdfjs-overrides .annotationLayer .textWidgetAnnotation input,
.pdfjs-overrides .annotationLayer .textWidgetAnnotation input:is(:hover, :focus) {
  padding-top: calc(var(--acrofield-single-line-offset, 0px) * 2 * var(--total-scale-factor));
  padding-bottom: calc(var(--acrofield-baseline-offset, 0em) * 2);
}

.pdfjs-overrides .annotationLayer .buttonWidgetAnnotation.radioButton,
.pdfjs-overrides .annotationLayer .buttonWidgetAnnotation.radioButton input {
  border-radius: 50%;
}

/* Hide input elements when they are not focused (overlay active) */
.pdfjs-overrides .annotationLayer .textWidgetAnnotation :is(input, textarea):not(:focus) {
  opacity: 0;
}

/* The overlay is the control's next sibling, so a focused control simply hides it. */
.pdfjs-overrides .annotationLayer .textWidgetAnnotation :is(input, textarea):focus + pdf-acrofield-overlay {
  opacity: 0;
}

/* Block the pointer events when not in editing mode */
.pdfjs-overrides .annotationLayer,
.pdfjs-overrides .annotationLayer section,
.pdfjs-overrides .annotationLayer .popup {
  pointer-events: inherit;
}

/*
 * pdf.js v6 renders the appearance stream of a widget into its own canvas inside the section and
 * marks the section with `hasOwnCanvas`. For text and choice widgets the value is already rendered
 * by the control and by the overlay, so that canvas draws it a second time, slightly offset - the
 * value appears doubled. The stylesheet vendored before the upgrade had no such canvas at all.
 *
 * Button widgets keep theirs: for checkboxes and radio buttons the canvas is what draws the check
 * mark and the dot, since pdf.js sets `appearance: none` on the control.
 */
.pdfjs-overrides .annotationLayer :is(.textWidgetAnnotation, .choiceWidgetAnnotation) > canvas {
  display: none;
}