:root {
  --main-color: #10234a;
  --body-bg-color: #eef3fb;
  --toolbar-bg-color: #f6f9ff;
  --toolbar-border-color: #c8d8f1;
  --toolbar-box-shadow: 0 1px 0 #c8d8f1;
  --toolbar-border-bottom: 1px solid #c8d8f1;
  --button-hover-color: #dbe8ff;
  --toggled-btn-bg-color: #2b5cc5;
  --toggled-btn-color: #fff;
  --toggled-hover-active-btn-color: #1e4fae;
  --sidebar-toolbar-bg-color: #edf4ff;
  --sidebar-narrow-bg-color: #edf4ff;
  --toolbar-icon-opacity: 1;
  --toolbar-icon-bg-color: #10234a;
  --toolbar-icon-hover-bg-color: #0b3d85;
  --separator-color: #b8ccef;
  --dropdown-btn-bg-color: #ffffff;
  --dropdown-btn-border: 1px solid #9cb6df;
  --field-color: #10234a;
  --field-bg-color: #ffffff;
  --field-border-color: #9cb6df;
  --doorhanger-bg-color: #ffffff;
  --doorhanger-border-color: #9cb6df;
  --doorhanger-hover-color: #10234a;
  --doorhanger-separator-color: #c8d8f1;
}

#toolbarContainer,
#toolbarSidebar,
#sidebarToolbar {
  background: var(--toolbar-bg-color);
}

#toolbarContainer,
#toolbarSidebar {
  color: var(--main-color);
}

#toolbarContainer .toolbarButton,
#toolbarSidebar .toolbarButton {
  color: var(--main-color);
}

#toolbarContainer .toolbarButton:is(:hover, :focus-visible),
#toolbarSidebar .toolbarButton:is(:hover, :focus-visible) {
  color: var(--main-color);
}

#toolbarContainer .toolbarButton.toggled,
#toolbarSidebar .toolbarButton.toggled {
  color: var(--toggled-btn-color);
}

#toolbarContainer .toolbarField,
#toolbarSidebar .toolbarField {
  background-color: var(--field-bg-color);
  border-color: var(--field-border-color);
  color: var(--field-color);
}

#toolbarContainer .dropdownToolbarButton,
#toolbarSidebar .dropdownToolbarButton {
  background-color: var(--dropdown-btn-bg-color);
  border: var(--dropdown-btn-border);
  color: var(--main-color);
}

#toolbarContainer .dropdownToolbarButton > select,
#toolbarSidebar .dropdownToolbarButton > select {
  background-color: var(--dropdown-btn-bg-color);
  color: var(--main-color);
}

#toolbarContainer .dropdownToolbarButton > select:is(:hover, :focus-visible),
#toolbarSidebar .dropdownToolbarButton > select:is(:hover, :focus-visible) {
  background-color: var(--button-hover-color);
  color: var(--main-color);
}

#toolbarContainer .dropdownToolbarButton:is(:hover, :focus-visible)::after,
#toolbarSidebar .dropdownToolbarButton:is(:hover, :focus-visible)::after {
  background-color: var(--toolbar-icon-hover-bg-color);
}

#toolbarContainer .toolbarButton:focus-visible,
#toolbarSidebar .toolbarButton:focus-visible,
#toolbarContainer .toolbarField:focus,
#toolbarSidebar .toolbarField:focus,
#toolbarContainer .dropdownToolbarButton:focus-within,
#toolbarSidebar .dropdownToolbarButton:focus-within {
  outline: 2px solid #2b5cc5;
  outline-offset: 1px;
}

#viewerContainer {
  overscroll-behavior: contain;
}

/* The site owns document editing; this viewer is deliberately read-only. */
#editorModeButtons,
#editorModeSeparator,
#openFile,
#secondaryOpenFile {
  display: none !important;
}

@media (max-width: 700px) {
  #toolbarViewer {
    padding-inline: 0.2rem;
  }

  #viewFind,
  #secondaryToolbarToggle {
    display: inline-block;
  }

  #scaleSelectContainer {
    max-width: 7rem;
  }
}