import { css } from 'chrome://resources/lit/v3_0/lit.rollup.js';
let instance = null;
export function getCss() {
    return instance || (instance = [...[], css `
/* A separate div is used because if the direction CSS property is applied
 * to the host element, any margins or paddings set by the parent will be
 * affected and be reversed. */
#content {
  align-items: center;
  color: #fff;
  direction: ltr;
  display: flex;
  font-size: 0.81rem;
  text-align: center;

  --page-selector-spacing: 4px;
}

#pageSelector::selection {
  background-color: var(--viewer-text-input-selection-color);
}

input,
#pagelength {
  /* --page-length-digits is set through JavaScript. 1px is added because
   * the unit 'ch' does not provide exact whole number pixels, and
   * therefore seems to have 1px-off bugginess. */
  width: calc(max(2, var(--page-length-digits)) * 1ch + 1px);
}

input {
  background: rgba(0, 0, 0, 0.5);
  border: none;
  color: white;
  font-family: inherit;
  line-height: inherit;
  outline: none;
  padding: 0 var(--page-selector-spacing);
  text-align: center;
}

#divider {
  margin: 0 var(--page-selector-spacing);
}`]);
}
