/* color palette from <https://github.com/vuejs/theme> */
:root {
  --c-white: #ffffff;

  --c-black: #000000;
  --c-black-1: #000000CC;
  --c-black-2: #00000033;
  --c-black-3: #222429;
  --c-black-4: #303238;
  --c-black-5: #43474D;
  --c-black-6: #42464D;
  --c-black-7: #414347;
  --c-black-8: #666666;
  --c-black-9: #606773;
  --c-black-10: #F2F3F5;
  --c-black-11: #F2F2F2;
  --c-black-12: #999999;
  --c-black-13: #001A4E;
  --c-black-14: #54575C;
  --c-black-15: #DADBDE;
  --c-black-16: #878C98;
  --c-black-17: #CCCCCC;
  --c-black-18: #0000001F;
  --c-black-19: #757780;

  --c-blue-1: #1460F3;
  --c-blue-2: #2D77FA;
  --c-blue-3: #6499FF;
  --c-blue-4: #DDE9FF;
  --c-blue-5: #FAFCFF;
  --c-blue-6: #F7F8FA;
  --c-blue-7: #3048BF;
  
  --c-bg: var(--c-black-11);

  --c-text: var(--c-black-5);
  --c-black-text: var(--c-black);
  
  --c-divider: rgba(0, 0, 0, 0.12);

  --c-header-bg: var(--c-white);

  --c-header-border: rgba(0, 0, 0, 0.12);

  --c-header-text: var(--c-black-5);

  --c-header-text-theme-active: var(--c-blue-1);

  --c-header-button-hover: var(--c-black-10);
  --c-header-button-active: var(--c-blue-4);
  --c-header-input-border: #D9D9D9;

  --c-popup-text: var(--c-black-5);

  --c-popup-text-hover: var(--c-white);
  --c-popup-text-active: var(--c-white);
  --c-popup-bg-hover: rgba(20, 96, 243, 0.8);
  --c-popup-bg-active: var(--c-blue-1);

  --c-side-header-text: var(--c-black-5);

  --c-side-header-bg: var(--c-white);
  --c-side-header-active: var(--c-blue-4);

  --c-side-header-border: rgba(0, 0, 0, 0.12);

  --c-side-text: var(--c-black-5);

  --c-side-bg: var(--c-blue-5);

  --c-side-title: var(--c-black-6);

  --c-side-thumbnails: var(--c-black-5);
  --c-side-thumbnails-active: var(--c-blue-1);

  --c-side-outline-text: var(--c-black-8);
  --c-side-outline-bg-active: var(--c-black-10);

  --c-findbar-text: var(--c-black-5);
  --c-findbar-bg: var(--c-white);
  --c-findbar-input-bg: var(--c-white);
  --c-findbar-input-border: #D9D9D9;
  --c-findbar-page-number-bg: rgb(242, 243, 245);

  --c-scrollbar-bg: var(--c-black-8);

  --c-side-layers-not-checked-bg: var(--c-white);
  --c-side-layers-not-checked-border: var(--c-black-9);
  --c-side-layers-checked-bg: var(--c-blue-2);

  --c-side-annotation-bg: var(--c-black-10);
  --c-side-annotation-text: var(--c-black-8);
  --c-side-annotation-icon: var(--c-black-12);
  --c-side-annotation-reply-icon: var(--c-black-8);

  --c-header-circle-bg: var(--c-blue-1);

  /* 右侧属性栏 */
  --c-right-side-header-text: var(--c-black-13);

  --c-right-side-header-bg: var(--c-black-11);
  --c-right-side-header-active: var(--c-blue-1);

  --c-right-side-content-fillbox-bg: var(--c-white);
  --c-right-side-content-fillbox-border: rgba(0, 0, 0, 0.12);

  --c-right-side-error-tip-bg: #FA1E5D1F;
  --c-right-side-info-tip-bg: var(--c-black-15);

  --c-right-side-list-item-bg: rgba(73, 130, 230, 0.2);

  /* 工具栏 */
  --c-toolbar-bg: var(--c-black-10);
  --c-toolbar-border: rgba(0, 0, 0, 0.12);

  --c-tool-mode-bg: var(--c-blue-5);

  /* page Mode 栏 */
  --c-tool-right-page: var(--c-black-12);
  --c-tool-right-page-active: var(--c-blue-1);

  /* 文档对比模式 */
  --c-file-header: var(--c-blue-5);

  /* 文本编辑 */
  --c-edit-text: var(--c-black-5);
  --c-edit-right-page: var(--c-black-18);

  /* 页面编辑模式 */
  --c-doc-editor-bg: var(--c-blue-6);
  --c-doc-editor-popup-shadow: rgba(129, 149, 200, 0.32);

  /* 输入框 */
  --c-input-placeholder: var(--c-black-12);
  --c-input-bg: var(--c-white);

  /* 弹窗 */
  --c-dialog-bg: var(--c-white);
  --c-active-text: var(--c-black-13);

  /* 蓝色图标 */
  --c-icon-blue: var(--c-blue-7);

  /* 下拉菜单悬浮背景 */
  --c-dropdown-hover-bg: rgb(243, 243, 245);
  /* 设置面板 */
  --c-settings-text: var(--c-black-8);

  /* 动态stamp背景色 */
  --c-dynamic-stamp-red-bg: linear-gradient(259deg, rgba(255, 82, 49, 0.27) 0%, rgba(255, 82, 49, 0.06) 100%);
  --c-dynamic-stamp-green-bg: linear-gradient(259deg, rgba(160, 186, 142, 0.27) 0%, rgba(160, 186, 142, 0.06) 100%);

  /* 下拉箭头 */
  --c-arrow-down-icon: var(--c-black-19);
}

html.dark {
  --c-bg: var(--c-black-3);
  
  --c-text: var(--c-white);
  --c-black-text: var(--c-white);

  --c-divider: rgba(255, 255, 255, 0.2);

  --c-header-bg: var(--c-black-7);

  --c-header-border: rgba(255, 255, 255, 0.2);

  --c-header-text: var(--c-white);

  --c-header-text-theme-active: var(--c-blue-3);

  --c-header-button-hover: var(--c-black-8);
  --c-header-button-active: var(--c-black-9);
  --c-header-input-border: var(--c-black-9);

  --c-popup-text: var(--c-white);

  --c-popup-text-hover: var(--c-white);
  --c-popup-text-active: var(--c-white);
  --c-popup-bg-hover: rgba(20, 96, 243, 0.8);
  --c-popup-bg-active: var(--c-blue-3);

  --c-side-header-text: var(--c-white);

  --c-side-header-bg: var(--c-black-9);
  --c-side-header-active: var(--c-blue-3);

  --c-side-header-border: rgba(255, 255, 255, 0.2);

  --c-side-text: var(--c-white);

  --c-side-bg: var(--c-black-7);

  --c-side-title: var(--c-white);

  --c-side-thumbnails: var(--c-white);
  --c-side-thumbnails-active: var(--c-blue-3);

  --c-side-outline-text: var(--c-white);
  --c-side-outline-bg-active: var(--c-black-9);

  --c-findbar-text: var(--c-black-12);
  --c-findbar-bg: var(--c-black-4);
  --c-findbar-input-bg: var(--c-black-3);
  --c-findbar-input-border: var(--c-black-9);
  --c-findbar-page-number-bg: var(--c-black-9);

  --c-scrollbar-bg: var(--c-black-12);

  --c-side-layers-not-checked-bg: var(--c-black-9);
  --c-side-layers-not-checked-border: var(--c-white);
  --c-side-layers-checked-bg: var(--c-blue-3);

  --c-side-annotation-bg: var(--c-black-9);
  --c-side-annotation-text: var(--c-black-12);
  --c-side-annotation-icon: var(--c-white);
  --c-side-annotation-reply-icon: var(--c-white);
  
  --c-header-circle-bg: var(--c-white);

  /* 右侧属性栏 */
  --c-right-side-header-text: var(--c-white);

  --c-right-side-header-bg: var(--c-black-9);
  --c-right-side-header-active: var(--c-blue-3);

  --c-right-side-content-fillbox-bg: var(--c-black-9);
  --c-right-side-content-fillbox-border: rgba(255, 255, 255, 0.1);

  --c-right-side-error-tip-bg: #E73861;
  --c-right-side-info-tip-bg: var(--c-black-16);

  --c-right-side-list-item-bg: var(--c-blue-3);

  /* 工具栏 */
  --c-toolbar-bg: var(--c-black-14);
  --c-toolbar-border: rgba(255, 255, 255, 0.1);

  --c-tool-mode-bg: var(--c-blue-9);

  /* page Mode 栏 */
  --c-tool-right-page: var(--c-white);
  --c-tool-right-page-active: var(--c-blue-3);

  /* 文档对比 */
  --c-file-header: var(--c-black-14);

  /* 文本编辑 */
  --c-edit-text: var(--c-black-17);
  --c-edit-right-page: var(--c-white);

  /* 页面编辑 */
  --c-doc-editor-bg: var(--c-black-7);
  --c-doc-editor-popup-shadow: rgba(255, 255, 255, 0.1);

  /* 输入框 */
  --c-input-placeholder: var(--c-black-12);
  --c-input-bg: var(--c-black-3);

  /* 弹窗 */
  --c-dialog-bg: var(--c-black-7);
  --c-active-text: var(--c-white);

  /* 蓝色图标 */
  --c-icon-blue: var(--c-blue-1);

  /* 下拉菜单悬浮背景 */
  --c-dropdown-hover-bg: rgba(255, 255, 255, 0.09);
  /* 设置面板 */
  --c-settings-text: var(--c-white);

  /* 动态stamp背景色 */
  --c-dynamic-stamp-red-bg: linear-gradient(269.41deg, #FFA594 15.3%, #FFE4DF 85.77%);
  --c-dynamic-stamp-green-bg: linear-gradient(269.41deg, #AAE681 15.3%, #E0FFCB 85.77%);

  /* 下拉箭头 */
  --c-arrow-down-icon: var(--c-white);
}

body {
  /* min-height: 100vh; */
  color: var(--c-text);
  background: var(--c-bg);
  transition: color 0.5s, background-color 0.5s;
  line-height: 1.6;
  font-family: Inter, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu,
    Cantarell, 'Fira Sans', 'Droid Sans', 'Helvetica Neue', sans-serif;
  font-size: 15px;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}
#printContainer {
  display: none;
}

@page {
  margin: 0;
  size: auto;
}

@media print {
  body {
    background: rgba(0, 0, 0, 0) none;
  }
  #outerContainer {
    display: none;
  }
  #printContainer {
    display: block;
    height: 100%;
  }
  /* wrapper around (scaled) print canvas elements */
  #printContainer > .printedPage {
    /* The wrapper always cover the whole page. */
    height: 100%;
    width: 100%;

    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  #printContainer > .printedPage:not(:last-child) {
    page-break-after: always;
  }

  #printContainer > .xfaPrintedPage .xfaPage {
    position: absolute;
  }

  #printContainer > .xfaPrintedPage {
    page-break-after: always;
    page-break-inside: avoid;
    width: 100%;
    height: 100%;
    position: relative;
  }

  #printContainer > .printedPage canvas,
  #printContainer > .printedPage img {
    /* The intrinsic canvas / image size will make sure that we fit the page. */
    max-width: 100%;
    max-height: 100%;

    direction: ltr;
  }
}
