@syncfusion/ej2-angular-pdfviewer 23.2.7 → 24.1.41-ngcc

package/styles/pdfviewer/_theme.scss

@@ -1,4751 +0,0 @@
-@include export-module('pdfviewer-theme') {
-  /* stylelint-disable value-no-vendor-prefix */
-  /* stylelint-disable property-no-vendor-prefix */
-  .e-pv-viewer-container {
-    border-color: $pv-control-border-color;
-    height: $pv-viewer-container-height;
-    overflow: $pv-control-overflow;
-    position: $pv-control-position;
-    touch-action: $pv-control-touch-action;
-    @if $skin-name == 'Material3' {
-      background: $pv-background;
-      border: $pv-toolbar-border;
-    }
-    @else
-    {
-      background-color: $pv-background;
-    }
-  }
-
-  .e-pdfviewer.e-pv-mobile-view .e-pv-viewer-container::-webkit-scrollbar {
-    display: none;
-  }
-
-  input.e-pv-input-password::-ms-reveal {
-    display: none;
-  }
-
-  .e-pv-page-container {
-    @if $skin-name == 'Material3' {
-      background: $pv-background;
-    }
-    margin: $pv-page-container-margin;
-    padding: $pv-page-container-padding;
-    touch-action: $pv-page-container-touch-action;
-  }
-
-  .e-pv-signaturehover {
-    background-color: $pv-prop-line-styles-hover-bg;
-  }
-
-  .e-pv-mobilespanscroll-container {
-    color: $pv-toolbar-total-page-number-color;
-    font-family: $pv-sidebar-bookmark-title-font-family;
-    font-size: $pv-sidebar-bookmark-title-font-size;
-  }
-
-  .e-pv-annotation-color-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-opacity-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-stroke-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-thickness-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-shapes-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-calibrate-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-textcolor-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-textalign-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-textprop-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-handwritten-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-menu-icon,
-  .e-bigger .e-pv-icon-search,
-  .e-pv-icon {
-    font-size: $pv-icon-font-size;
-  }
-
-  .e-bigger .e-pv-icon {
-    @if $skin-name == 'FluentUI' {
-      font-size: 16px;
-    }
-  }
-
-  .e-pv-annotation-stamp-container .e-menu-wrapper {
-    @if $skin-name == 'FluentUI' {
-      background-color: transparent;
-    }
-  }
-
-  .e-pv-annotation-ink-container .e-pv-inkannotation-icon {
-    font-size: $pv-icon-font-size;
-  }
-
-  .e-pv-annotation-handwritten-container .e-pv-handwritten-icon.e-btn-icon:not(.e-caret) {
-    font-size: $pv-icon-font-size;
-  }
-
-  .e-bigger .e-pv-annotation-color-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-opacity-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-stroke-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-thickness-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-shapes-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-calibrate-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-textcolor-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-textalign-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-textprop-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-handwritten-container.e-dropdown-btn.e-btn .e-btn-icon:not(.e-caret),
-  .e-bigger .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-menu-icon,
-  .e-bigger .e-pv-icon-search,
-  .e-bigger .e-pv-icon {
-    @if $skin-name == 'bootstrap4' {
-      font-size: $pv-icon-font-size-big;
-    }
-  }
-
-  .e-pv-mobilescroll-container {
-    @if $skin-name == 'Material3' {
-      background: $pv-background;
-    }
-    @else
-    {
-      background-color: $pv-background;
-    }
-    border: $pv-thumbnail-hover-border;
-    border-radius: 56px 0 0 56px;
-    line-height: 27px;
-    position: absolute;
-    text-align: center;
-  }
-
-  .e-pv-viewer-container .e-pv-page-div {
-    border-color: $pv-page-div-border-color;
-    border-style: $pv-page-div-border-style;
-    border-width: $pv-page-div-border;
-    box-shadow: $pv-page-div-box-shadow;
-    box-sizing: $pv-page-div-border-boxing;
-    position: $pv-page-div-position;
-  }
-
-  .e-pv-toolbar,
-  .e-pv-nav-toolbar,
-  .e-pv-annotation-toolbar,
-  .e-pv-formdesigner-toolbar {
-    border: $pv-toolbar-border;
-    border-radius: $pv-toolbar-border-radius;
-    border-width: $pv-toolbar-border-width;
-  }
-
-  .e-pv-toolbar,
-  .e-pv-annotation-toolbar,
-  .e-pv-mobile-annotation-toolbar,
-  .e-pv-formdesigner-toolbar {
-    height: $pv-toolbar-height;
-  }
-
-  .e-pv-toolbar.e-toolbar .e-toolbar-items.e-tbar-pos .e-toolbar-left {
-    @if $skin-name == 'bootstrap5' {
-      left: 0;
-      line-height: 0;
-    }
-  }
-
-  .e-pv-nav-toolbar,
-  .e-bigger .e-pv-toolbar,
-  .e-pv-toolbar.e-pv-mobile-toolbar,
-  .e-bigger .e-pv-annotation-toolbar,
-  .e-pv-mobile-view .e-pv-annotation-toolbar {
-    height: $pv-toolbar-height-big;
-  }
-
-  .e-toolbar.e-pv-toolbar .e-pv-zoom-drop-down-container {
-    height: $pv-zoom-dropdown-height;
-    width: $pv-zoom-dropdown-width;
-  }
-
-  .e-toolbar.e-pv-toolbar .e-toolbar-pop .e-pv-zoom-drop-down-container {
-    display: block;
-    padding-left: 10px;
-    padding-right: 10px;
-    width: auto;
-  }
-
-  .e-pv-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn-text,
-  .e-pv-toolbar.e-toolbar.e-toolpop .e-toolbar-items .e-toolbar-item.e-popup-text .e-tbar-btn-text {
-    display: none;
-  }
-
-  .e-pv-current-page-box.e-input-group.e-control-wrapper {
-    height: $pv-current-page-height;
-    @if $skin-name == 'bootstrap5' {
-      height: 32px;
-    }
-    margin-top: $pv-toolbar-current-page-box-margin-top;
-    width: $pv-current-page-width;
-  }
-
-  .e-pv-mobilepagenoscroll-container {
-    background: $pv-sidebar-resizer-background;
-    border: $pv-thumbnail-hover-border;
-    border-radius: 10px;
-    padding: 6px;
-    text-align: center;
-    vertical-align: middle;
-  }
-
-  .e-pv-mobilecurrentpage-container {
-    color: $pv-toolbar-total-page-number-color;
-    display: block;
-    font-family: $pv-sidebar-bookmark-title-font-family;
-    font-size: 24px;
-  }
-
-  .e-pv-mobiledashedline-container {
-    color: $pv-toolbar-total-page-number-color;
-    display: block;
-    padding: 10px;
-  }
-
-  .e-pv-number-ofpages {
-    width: 10%;
-  }
-
-  .e-dialog.e-pv-gotopage-popup {
-    max-width: 500px;
-    @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark') {
-      padding-left: 0;
-      padding-top: 0;
-    }
-    @else {
-      padding-left: 16px;
-      padding-top: 16px;
-    }
-  }
-
-  .e-pv-gotopage-apply-btn.e-btn.e-flat.e-primary:disabled {
-    @if $skin-name != 'bootstrap4' {
-      background-color: transparent;
-    }
-    @if $skin-name == 'bootstrap' {
-      color: $pv-save-button-color;
-    }
-  }
-
-  .e-pv-mobiletotalpage-container {
-    color: $pv-toolbar-total-page-number-color;
-    display: block;
-    font-family: $pv-sidebar-bookmark-title-font-family;
-    font-size: $pv-sidebar-title-font-size;
-  }
-
-  .e-pv-password-input {
-    @if $skin-name != 'Material3' {
-      margin-top: $pv-password-input-margin-top;
-    }
-  }
-
-  .e-pv-password-error {
-    color: $pv-password-error-color;
-  }
-
-  .e-pv-corrupted-popup-header {
-    color: $pv-corrupted-pop-header-color;
-    opacity: $pv-corrupted-pop-header-opacity;
-  }
-
-  .e-pv-corrupted-popup-content {
-    @if $skin-name == 'Material3' {
-      color: $content-text-color-alt1;
-    }
-    @else {
-      color: $pv-corrupted-pop-header-color;
-    }
-    font-size: $pv-corrupted-pop-content-font-size;
-    line-height: $pv-corrupted-pop-content-line-height;
-    margin-left: $pv-corrupted-pop-content-margin-left;
-    opacity: $pv-corrupted-pop-header-opacity;
-    padding-top: $pv-corrupted-pop-content-padding-top;
-    text-align: $pv-corrupted-pop-header-text-align;
-  }
-
-  .e-pv-corrupted-popup-content-rtl {
-    color: $pv-corrupted-pop-header-color;
-    font-size: $pv-corrupted-pop-content-font-size;
-    line-height: $pv-corrupted-pop-content-line-height;
-    margin-right: $pv-corrupted-pop-content-margin-right;
-    opacity: $pv-corrupted-pop-header-opacity;
-    padding-top: $pv-corrupted-pop-content-padding-top;
-    text-align: $pv-corrupted-pop-header-rtl-text-align;
-  }
-
-  .e-pv-toolbar.e-toolbar:not(.e-pv-mobile-toolbar) .e-toolbar-items .e-toolbar-item:not(.e-separator) {
-    @if $skin-name == 'Material3' {
-      height: $pv-toolbar-height;
-    }
-    @else {
-      height: auto;
-    }
-    margin-left: $pv-toolbar-items-margin-left;
-    margin-right: $pv-toolbar-items-margin-right;
-    @if $skin-name != 'Material3' {
-      padding-bottom: $pv-toolbar-items-padding-bottom;
-      padding-top: $pv-toolbar-items-padding-top;
-    }
-    @if $skin-name == 'bootstrap5' {
-      padding: 3px 4px;
-    }
-  }
-
-  .e-bigger .e-pv-toolbar.e-toolbar:not(.e-pv-mobile-toolbar) .e-toolbar-items .e-toolbar-item:not(.e-separator) {
-    @if $skin-name == 'bootstrap4' {
-      padding-bottom: $pv-toolbar-items-padding-bottom-big;
-      padding-top: $pv-toolbar-items-padding-top-big;
-    }
-  }
-
-  .e-pv-annotation-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item:not(.e-separator),
-  .e-pv-formdesigner-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item:not(.e-separator) {
-    @if $skin-name != 'tailwind' and $skin-name != 'tailwind-dark' {
-      height: auto;
-    }
-    @if $skin-name == 'bootstrap5' {
-      height: 32px;
-    }
-    margin-left: $pv-toolbar-items-margin-left;
-    margin-right: $pv-toolbar-items-margin-right;
-    @if $skin-name == 'bootstrap5' {
-      padding: 0 4px;
-    }
-  }
-
-  .e-pv-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon,
-  .e-pv-annotation-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon {
-    @if $skin-name == 'FluentUI' {
-      padding-bottom: 2px;
-    }
-    @else if $skin-name == 'Material3' {
-      padding: 0 !important;/* stylelint-disable-line declaration-no-important */
-    }
-    @else {
-      padding-bottom: 0;
-    }
-  }
-
-  .e-bigger .e-pv-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon,
-  .e-bigger .e-pv-annotation-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon {
-    @if $skin-name == 'FluentUI' {
-      padding-bottom: 2px;
-    }
-    @else if $skin-name == 'Material3' {
-      padding: 0 !important;/* stylelint-disable-line declaration-no-important */
-    }
-    @else {
-      padding-bottom: 0;
-    }
-  }
-
-  .e-pv-toolbar.e-toolbar.e-toolbar .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon,
-  .e-pv-annotation-toolbar.e-toolbar.e-toolbar .e-toolbar-item .e-tbar-btn.e-btn .e-icons.e-btn-icon {
-    @if $skin-name == 'FluentUI' {
-      line-height: 22px;
-      min-height: 22px;
-    }
-    @else {
-      line-height: 26px;
-      min-height: 26px;
-    }
-  }
-
-  .e-pv-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-separator,
-  .e-pv-annotation-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-separator,
-  .e-pv-formdesigner-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-separator {
-    border-right-width: $pv-toolbar-separator-border-right-width;
-    height: $pv-toolbar-separator-height;
-    margin-left: $pv-toolbar-separator-margin-left;
-    margin-right: $pv-toolbar-separator-margin-right;
-  }
-
-  .e-pdfviewer .e-pv-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:first-child,
-  .e-pdfviewer .e-pv-annotation-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:first-child,
-  .e-pdfviewer .e-pv-formdesigner-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:first-child  {
-    margin-left: $pv-toolbar-items-first-child-margin-left;
-  }
-
-  .e-pdfviewer .e-pv-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-toolbar-item:first-child,
-  .e-pdfviewer .e-pv-annotation-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-toolbar-item:first-child,
-  .e-pdfviewer .e-pv-formdesigner-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-toolbar-item:first-child {
-    margin-right: $pv-toolbar-items-first-child-margin-left;
-  }
-
-  .e-pdfviewer .e-pv-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:last-child,
-  .e-pdfviewer .e-pv-annotation-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:last-child,
-  .e-pdfviewer .e-pv-formdesigner-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:last-child  {
-    margin-right: $pv-toolbar-items-last-child-margin-right;
-  }
-
-  .e-pdfviewer .e-pv-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-toolbar-item:last-child,
-  .e-pdfviewer .e-pv-annotation-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-toolbar-item:last-child,
-  .e-pdfviewer .e-pv-formdesigner-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-toolbar-item:last-child {
-    margin-left: $pv-toolbar-items-last-child-margin-right;
-  }
-
-  .e-pv-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-pv-tbar-btn.e-btn,
-  .e-pv-annotation-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-pv-tbar-btn.e-btn,
-  .e-pv-mobile-annotation-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-pv-tbar-btn.e-btn,
-  .e-pv-formdesigner-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-pv-tbar-btn.e-btn {
-    height: $pv-toolbar-btn-height;
-    min-width: $pv-toolbar-btn-width;
-    width: $pv-toolbar-btn-width;
-    @if $skin-name == 'FluentUI' {
-      line-height: $pv-toolbar-btn-height;
-      min-width: 40px;
-    }
-  }
-
-  .e-pv-open-document-icon {
-    font-size: $pv-toolbar-open-icon-font-size;
-    height: $pv-toolbar-open-icon-height;
-    line-height: $pv-toolbar-open-icon-line-height;
-    width: $pv-toolbar-open-icon-width;
-  }
-
-  .e-toolbar-items:not(.e-toolbar-pop) .e-pv-download-document-icon {
-    line-height: $pv-toolbar-download-icon-line-height;
-  }
-
-  .e-toolbar-items:not(.e-toolbar-pop) .e-pv-print-document-icon {
-    line-height: $pv-toolbar-print-icon-line-height;
-  }
-
-  .e-pv-first-page-navigation-icon {
-    line-height: $pv-toolbar-first-page-icon-line-height;
-  }
-
-  .e-pv-previous-page-navigation-icon {
-    line-height: $pv-toolbar-previous-page-icon-line-height;
-  }
-
-  .e-pv-next-page-navigation-icon {
-    line-height: $pv-toolbar-next-page-icon-line-height;
-  }
-
-  .e-pv-last-page-navigation-icon {
-    line-height: $pv-toolbar-last-page-icon-line-height;
-  }
-
-  .e-toolbar-items:not(.e-toolbar-pop) .e-pv-zoom-out-icon,
-  .e-toolbar-items:not(.e-toolbar-pop) .e-pv-zoom-in-icon {
-    line-height: $pv-toolbar-zoom-out-icon-line-height;
-  }
-
-  .e-pv-eye-slash-icon,
-  .e-pv-eye-icon {
-    margin-top: $pv-eye-icon-margin-top;
-  }
-
-  .e-pv-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-pv-current-page-container {
-    padding-left: 8px;
-  }
-
-  .e-pv-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-btn.e-pv-pan-tool .e-pv-icon {
-    margin-right: 2px;
-  }
-
-  .e-pv-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item.e-pv-zoom-drop-down-container {
-    margin: $pv-toolbar-zoom-drop-margin;
-    @if $skin-name != 'bootstrap4' {
-      padding: $pv-toolbar-zoom-drop-padding;
-    }
-  }
-
-  .e-pv-toolbar.e-toolbar .e-toolbar-items .e-pv-total-page-container.e-toolbar-item:not(.e-separator) {
-    color: $pv-toolbar-total-page-number-color;
-    cursor: default;
-    font-size: $pv-toolbar-total-page-number-font-size;
-    margin-left: $pv-toolbar-total-page-div-margin-left;
-    margin-right: $pv-toolbar-total-page-div-margin-right;
-    min-width: unset;
-    @if $skin-name != 'bootstrap4' and $skin-name != 'FluentUI' {
-      padding-bottom: $pv-toolbar-total-page-padding-bottom;
-    }
-    padding-left: $pv-toolbar-total-page-div-padding-left;
-    @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' {
-      padding-top: 0;
-    }
-    position: relative;
-  }
-
-  .e-pv-total-page {
-    color: $pv-toolbar-total-page-font-color;
-    font-size: inherit;
-  }
-
-  .e-pv-total-page-ms {
-    -ms-transform: translateY(-50%);
-    margin: 0;
-    position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
-  }
-
-  .e-pv-zoom-drop-down.e-input-group.e-control-wrapper.e-ddl:not(.e-error),
-  .e-pv-prop-dropdown.e-input-group.e-control-wrapper.e-ddl:not(.e-error),
-  .e-pv-zoom-drop-down-rtl.e-input-group.e-control-wrapper.e-ddl:not(.e-error),
-  .e-pv-prop-dropdown-rtl.e-input-group.e-control-wrapper.e-ddl:not(.e-error) {
-    background-color: transparent;
-    border: $pv-toolbar-zoom-drop-down-border;
-    @if $skin-name == 'bootstrap5' {
-      box-shadow: none;
-    }
-    height: inherit;
-    margin-top: $pv-toolbar-zoom-drop-down-margin-top;
-    padding: $pv-toolbar-zoom-drop-down-padding;
-  }
-
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error),
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-input-focus:not(.e-float-icon-left):not(.e-success):not(.e-warning):not(.e-error) {
-    background-color: $pv-toolbar-zoom-drop-down-background-color;
-    border: $pv-toolbar-zoom-drop-down-border-focus;
-    border-radius: $pv-toolbar-zoom-drop-down-border-radius;
-  }
-
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl.e-input-focus .e-search-icon.e-ddl-icon,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl.e-input-focus .e-search-icon.e-ddl-icon,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl.e-input-focus .e-search-icon.e-ddl-icon,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-input-focus .e-search-icon.e-ddl-icon {
-    color: $pv-zoom-dropdown-input-focus-color;
-  }
-
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl .e-input.e-control.e-keyboard,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl .e-input.e-control.e-keyboard,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl .e-input.e-control.e-keyboard,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl .e-input.e-control.e-keyboard {
-    height: $pv-zoom-drop-down-input-height;
-    margin-top: $pv-zoom-drop-down-input-margin-top;
-    padding-bottom: $pv-zoom-drop-down-padding-bottom;
-    padding-top: $pv-zoom-drop-down-padding-top;
-  }
-
-  .e-pv-toolbar:not(.e-rtl) .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl .e-input.e-control.e-keyboard,
-  .e-pv-toolbar:not(.e-rtl) .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl .e-input.e-control.e-keyboard,
-  .e-pv-toolbar:not(.e-rtl) .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl .e-input.e-control.e-keyboard,
-  .e-pv-toolbar:not(.e-rtl) .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl .e-input.e-control.e-keyboard {
-    @if $skin-name == 'bootstrap5' {
-      padding-left: 0;
-    }
-    @else {
-      padding-left: $pv-zoom-drop-down-padding-left;
-    }
-  }
-
-  .e-pv-toolbar.e-rtl .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl .e-input.e-control.e-keyboard,
-  .e-pv-toolbar.e-rtl .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl .e-input.e-control.e-keyboard,
-  .e-pv-toolbar.e-rtl .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl .e-input.e-control.e-keyboard,
-  .e-pv-toolbar.e-rtl .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl .e-input.e-control.e-keyboard {
-    padding-right: $pv-zoom-drop-down-padding-left;
-  }
-
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl .e-search-icon.e-ddl-icon,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl .e-search-icon.e-ddl-icon,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl .e-search-icon.e-ddl-icon,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl .e-search-icon.e-ddl-icon {
-    background-color: transparent;
-    border-left: 0;
-    margin-bottom: $pv-zoom-drop-down-margin-bottom;
-    margin-left: $pv-zoom-drop-down-margin-left;
-    margin-top: $pv-zoom-drop-down-margin-top;
-    padding-right: $pv-zoom-drop-down-padding-right;
-  }
-
-  .e-pv-zoom-drop-down-container .e-input-group.e-control-wrapper .e-input-group-icon,
-  .e-pv-annotation-fontsize-container .e-input-group.e-control-wrapper.e-pv-prop-dropdown .e-input-group-icon,
-  .e-pv-annotation-fontname-container .e-input-group.e-control-wrapper.e-pv-prop-dropdown .e-input-group-icon {
-    @if $skin-name == 'bootstrap5' {
-      border-left: 0;
-      margin-bottom: $pv-zoom-drop-down-margin-bottom;
-      margin-left: $pv-zoom-drop-down-margin-left;
-      margin-top: $pv-zoom-drop-down-margin-top;
-      padding-right: $pv-zoom-drop-down-padding-right;
-    }
-  }
-
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl .e-input.e-control,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl .e-input.e-control,
-  .e-input-group.e-control-wrapper.e-pv-current-page-box .e-numerictextbox.e-input,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl .e-input.e-control,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl .e-input.e-control {
-    text-align: $pv-text-align;
-  }
-
-  .e-pv-zoom-drop-down.e-ddl.e-popup.e-popup-open,
-  .e-pv-prop-dropdown.e-ddl.e-popup.e-popup-open {
-    text-align: $pv-zoom-drop-down-popup-text-align;
-  }
-
-  .e-pv-zoom-drop-down-rtl.e-ddl.e-popup.e-popup-open,
-  .e-pv-prop-dropdown-rtl.e-ddl.e-popup.e-popup-open {
-    text-align: right;
-  }
-
-  .e-pv-zoom-drop-down.e-popup.e-popup-open .e-dropdownbase .e-list-item.e-active .e-pv-prop-dropdown.e-popup.e-popup-open .e-dropdownbase .e-list-item.e-active,
-  .e-pv-zoom-drop-down-rtl.e-popup.e-popup-open .e-dropdownbase .e-list-item.e-active .e-pv-prop-dropdown-rtl.e-popup.e-popup-open .e-dropdownbase .e-list-item.e-active {
-    color: $pv-zoom-drop-down-active-color;
-  }
-
-  .e-pv-zoom-drop-down.e-popup.e-popup-open,
-  .e-pv-zoom-drop-down-rtl.e-popup.e-popup-open {
-    min-height: $pv-zoom-drop-down-popup-height;
-    min-width: $pv-zoom-drop-down-popup-width;
-  }
-
-  .e-input-group.e-control-wrapper.e-pv-current-page-box:not(.e-success):not(.e-warning):not(.e-error):not(.e-float-icon-left) {
-    @if $skin-name == 'Material3' {
-      border-bottom: $pv-current-page-border;
-    }
-    @else {
-      border: $pv-current-page-border;
-    }
-    border-radius: $pv-current-page-border-radius;
-    @if $skin-name == 'bootstrap5' {
-      box-shadow: none;
-    }
-  }
-
-  .e-pv-annotation-toolbar,
-  .e-pv-mobile-annotation-toolbar,
-  .e-pv-formdesigner-toolbar {
-    @if $skin-name == 'bootstrap5' {
-      border: solid $border-light;
-      border-width: 1px;
-    }
-  }
-
-  .e-pv-zoom-drop-down.e-ddl.e-valid-input.e-input-focus,
-  .e-pv-zoom-drop-down-rtl.e-ddl.e-valid-input.e-input-focus {
-    @if $skin-name != 'bootstrap5' {
-      box-shadow: none;
-    }
-  }
-
-  .e-pv-password-popup.e-dialog .e-dlg-header,
-  .e-pv-corrupted-popup.e-dialog .e-pv-corrupted-popup-header,
-  .e-pv-notification-popup.e-dialog .e-dlg-header {
-    font-size: $pv-corrupted-pop-header-font-size;
-    font-weight: $pv-dialog-pop-header-font-weight;
-    letter-spacing: $pv-corrupted-pop-header-letter-spacing;
-  }
-
-  .e-pv-password-popup.e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn,
-  .e-pv-corrupted-popup.e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn,
-  .e-pv-notification-popup.e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
-    @if ($skin-name != 'bootstrap4') {
-      padding-top: $pv-dialog-pop-close-icon-padding-top;
-    }
-  }
-
-  .e-pv-password-popup.e-dialog {
-    @if $skin-name != 'Material3' {
-      height: $pv-password-dialog-height;
-    }
-    margin: 0 10px;
-    max-width: $pv-password-dialog-width;
-  }
-
-  .e-pv-corrupted-popup.e-dialog {
-    @if $skin-name != 'Material3' {
-      height: $pv-corrupted-dialog-height;
-    }
-    margin: 0 10px;
-    max-width: $pv-corrupted-dialog-width;
-  }
-
-  .e-pv-corrupted-popup.e-dialog .e-dlg-header-content,
-  .e-pv-notification-popup.e-dialog .e-dlg-header-content {
-    border-bottom: $pv-corrupted-dialog-header-border-bottom;
-  }
-
-  .e-pv-corrupted-popup.e-dialog .e-footer-content,
-  .e-pv-notification-popup.e-dialog .e-footer-content {
-    border-top: $pv-corrupted-dialog-footer-border-top;
-  }
-
-  .e-pv-corrupted-popup.e-dialog .e-dlg-content {
-    @if $skin-name != 'Material3' {
-      padding-bottom: $pv-corrupted-dialog-pop-content-padding-bottom;
-      padding-top: $pv-corrupted-dialog-pop-content-padding-top;
-    }
-  }
-
-  .e-pv-password-popup.e-dialog span[id *= '_prompt'] {
-    font-size: $pv-password-pop-content-font-size;
-    letter-spacing: $pv-password-pop-content-letter-spacing;
-  }
-
-  .e-pv-password-popup.e-dialog .e-dlg-header-content {
-    border-bottom: $pv-password-dialog-header-border-bottom;
-  }
-
-  .e-pv-password-popup.e-dialog .e-footer-content {
-    border-top: $pv-password-dialog-footer-border-top;
-  }
-
-  .e-pv-password-popup.e-dialog .e-dlg-content {
-    @if $skin-name != 'Material3' {
-      padding-bottom: $pv-password-dialog-pop-content-padding-bottom;
-      padding-top: $pv-password-pop-content-padding-top;
-    }
-  }
-
-  .e-pv-current-page-box.e-input-group.e-control-wrapper input.e-input {
-    max-height: $pv-current-page-height;
-    padding-bottom: $pv-current-page-padding-bottom;
-    @if $skin-name == 'bootstrap5' {
-      max-height: 30px;
-      padding-bottom: 1px;
-    }
-  }
-
-  .e-pv-toolbar:not(.e-rtl) .e-pv-current-page-box.e-input-group.e-control-wrapper input.e-input {
-    padding-left: $pv-current-page-padding-left;
-  }
-
-  .e-pv-toolbar.e-rtl .e-pv-current-page-box.e-input-group.e-control-wrapper input.e-input {
-    padding-right: $pv-current-page-padding-left;
-  }
-
-  .e-pv-zoom-drop-down.e-ddl.e-control-wrapper.e-icon-anim .e-ddl-icon::before,
-  .e-pv-prop-dropdown.e-ddl.e-control-wrapper.e-icon-anim .e-ddl-icon::before,
-  .e-pv-zoom-drop-down-rtl.e-ddl.e-control-wrapper.e-icon-anim .e-ddl-icon::before,
-  .e-pv-prop-dropdown-rtl.e-ddl.e-control-wrapper.e-icon-anim .e-ddl-icon::before {
-    transform: $pv-zoom-drop-down-transform;
-  }
-
-  .e-input-group.e-control-wrapper.e-pv-current-page-box:not(.e-float-icon-left):not(.e-float-input)::after,
-  .e-input-group.e-control-wrapper.e-pv-current-page-box:not(.e-float-icon-left):not(.e-float-input)::before,
-  .e-input-group.e-control-wrapper.e-pv-current-page-box.e-input-focus:not(.e-float-icon-left):not(.e-float-input)::after,
-  .e-input-group.e-control-wrapper.e-pv-current-page-box.e-input-focus:not(.e-float-icon-left):not(.e-float-input)::before,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl::after,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl::before,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl.e-input-focus::after,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl.e-input-focus::before,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl::after,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl::before,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl.e-input-focus::after,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl.e-input-focus::before,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl::after,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl::before,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl.e-input-focus::after,
-  .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl.e-input-focus::before,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl::after,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl::before,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-input-focus::after,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-input-focus::before {
-    background: $pv-material-line-background;
-  }
-
-  .e-pv-sidebar-container {
-    background: $pv-sidebar-container-background;
-    border-top: $pv-sidebar-container-border-top;
-    bottom: $pv-sidebar-container-bottom;
-    position: $pv-sidebar-container-position;
-    top: $pv-sidebar-container-top;
-    transition: transform .3s ease;
-    transition: transform .3s ease, -webkit-transform .3s ease;
-    transition: -webkit-transform .3s ease;
-    transition-duration: 200ms;
-    transition-timing-function: ease;
-    width: $pv-sidebar-container-width;
-    z-index: $pv-sidebar-container-z-index;
-  }
-
-  .e-pv-main-container {
-    height: $pv-main-container-height;
-    overflow: $pv-main-container-overflow;
-    position: $pv-main-container-position;
-    width: $pv-main-container-width;
-  }
-
-  .e-pv-viewer-main-container {
-    @if $skin-name == 'Material3' {
-      background: $pv-background;
-    }
-    @else
-    {
-      background-color: $pv-background;
-    }
-    bottom: $pv-viewer-main-container-bottom;
-    left: $pv-viewer-main-container-left;
-    position: $pv-viewer-main-container-position;
-    right: $pv-viewer-main-container-right;
-    top: $pv-viewer-main-container-top;
-  }
-
-  .e-pdfviewer:not(.e-pv-mobile-view) .e-pv-viewer-main-container {
-    min-width: $pv-viewer-main-container-min-width;
-  }
-
-  .e-pdfviewer:not(.e-pv-mobile-view) .e-pv-main-container {
-    min-height: 500px;
-  }
-
-  .e-pv-sidebar-content-container {
-    border-top: $pv-sidebar-content-container-border-top;
-    display: $pv-sidebar-content-container-display;
-    float: $pv-sidebar-content-container-float;
-    height: $pv-sidebar-content-container-height;
-    position: $pv-sidebar-content-container-position;
-    transition-duration: 200ms;
-    transition-timing-function: ease;
-    width: $pv-sidebar-content-container-width;
-  }
-
-  .e-pv-sidebar-content-container.e-thumbnail {
-    height: 100%;
-    left: 1px;
-    position: unset;
-  }
-
-  .e-pv-sidebar-title-container {
-    background: $pv-sidebar-title-container-background;
-    border: $pv-sidebar-toolbar-border;
-    border-width: $pv-sidebar-title-container-border-width;
-    height: $pv-sidebar-title-container-height;
-    position: $pv-sidebar-title-container-position;
-    top: $pv-sidebar-title-container-top;
-    width: $pv-sidebar-title-container-width;
-  }
-
-  .e-bigger .e-pv-sidebar-title-container {
-    @if $skin-name == 'bootstrap4' {
-      height: $pv-sidebar-title-container-height-big;
-    }
-  }
-
-  .e-pv-sidebar-content-container:not(.e-right) .e-pv-sidebar-title-container {
-    @if $skin-name == 'bootstrap4' {
-      border-right: $pv-sidebar-content-scrollbar-track-border;
-    }
-  }
-
-  .e-pv-sidebar-content-container.e-right .e-pv-sidebar-title-container {
-    @if $skin-name == 'bootstrap4' {
-      border-left: $pv-sidebar-content-scrollbar-track-border;
-    }
-  }
-
-  .e-bigger .e-pv-sidebar-title-container {
-    @if $skin-name == 'bootstrap4' {
-      height: $pv-sidebar-title-container-height-big;
-    }
-  }
-
-  .e-pv-sidebar-content-container:not(.e-right) .e-pv-sidebar-title-container {
-    @if $skin-name == 'bootstrap4' {
-      border-right: $pv-sidebar-content-scrollbar-track-border;
-    }
-  }
-
-  .e-pv-sidebar-content-container.e-right .e-pv-sidebar-title-container {
-    @if $skin-name == 'bootstrap4' {
-      border-left: $pv-sidebar-content-scrollbar-track-border;
-    }
-  }
-
-  .e-pv-sidebar-title {
-    color: $pv-sidebar-title-color;
-    font-size: $pv-sidebar-title-font-size;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind' or $skin-name == 'Material3') {
-      font-weight: 500;
-    }
-    height: $pv-sidebar-title-height;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind') {
-      line-height: $pv-sidebar-title-line-height;
-    }
-    margin: $pv-sidebar-title-margin;
-    position: $pv-sidebar-title-position;
-    text-align: $pv-sidebar-title-text-align;
-    top: $pv-sidebar-title-top;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind') {
-      vertical-align: $pv-sidebar-title-vertical-align;
-    }
-    @if $skin-name == 'FluentUI' {
-      padding: 8px;
-    }
-  }
-
-  .e-bigger .e-pv-sidebar-title {
-    @if $skin-name == 'bootstrap4' {
-      top: $pv-sidebar-title-top-big;
-    }
-  }
-
-  .e-bigger .e-pv-sidebar-title,
-  .e-bigger .e-pv-total-page {
-    @if $skin-name == 'bootstrap4' {
-      font-size: $pv-label-font-size-big;
-    }
-  }
-
-  .e-pv-sidebar-title.e-left {
-    left: $pv-sidebar-title-left;
-    @if $skin-name == 'bootstrap4' {
-      margin-left: 12px;
-    }
-    width: $pv-sidebar-title-width;
-  }
-
-  .e-pv-sidebar-title.e-right {
-    @if $skin-name == 'bootstrap4' {
-      margin-right: 12px;
-    }
-    right: $pv-sidebar-title-left;
-  }
-
-  .e-pv-sidebar-toolbar {
-    background: $pv-sidebar-toolbar-background;
-    border: $pv-sidebar-toolbar-border;
-    border-width: $pv-sidebar-toolbar-border-width;
-    bottom: $pv-sidebar-toolbar-bottom;
-    height: $pv-sidebar-toolbar-height;
-    position: $pv-sidebar-toolbar-position;
-    width: $pv-sidebar-toolbar-width;
-    z-index: $pv-sidebar-toolbar-z-index;
-  }
-
-  .e-bigger .e-pv-sidebar-toolbar {
-    @if $skin-name == 'bootstrap4' or $skin-name == 'FluentUI' {
-      width: $pv-sidebar-toolbar-width-big;
-    }
-  }
-
-  .e-pv-sidebar-content {
-    -webkit-overflow-scrolling: touch;
-    background: $pv-sidebar-content-background;
-    bottom: $pv-sidebar-content-bottom;
-    overflow: $pv-sidebar-content-overflow;
-    overflow-x: $pv-sidebar-content-overflow-x;
-    position: $pv-sidebar-content-position;
-    top: $pv-sidebar-content-top;
-    width: $pv-sidebar-content-width;
-    z-index: $pv-sidebar-content-z-index;
-  }
-
-  .e-pv-thumbnail-anchor-node:hover {
-    text-decoration: auto;
-  }
-
-  .e-pv-sidebar-content.e-thumbnail {
-    top: 1px;
-  }
-
-  .e-bigger .e-pv-sidebar-content {
-    @if $skin-name == 'bootstrap4' {
-      top: $pv-sidebar-content-top-big;
-    }
-  }
-
-  .e-pv-sidebar-resizer {
-    background: $pv-sidebar-resizer-background;
-    border: $pv-sidebar-resizer-border;
-    border-width: $pv-sidebar-resizer-border-width;
-    color: $pv-sidebar-resizer-color;
-    cursor: $pv-sidebar-resizer-cursor;
-    height: $pv-sidebar-resizer-height;
-    position: $pv-sidebar-resizer-position;
-    width: $pv-sidebar-resizer-width;
-    z-index: $pv-sidebar-resizer-z-index;
-  }
-
-  .e-pv-sidebar-content::-webkit-scrollbar {
-    width: $pv-sidebar-content-scrollbar-width;
-  }
-
-  .e-pv-sidebar-content::-webkit-scrollbar-track {
-    -webkit-box-shadow: $pv-sidebar-content-scrollbar-track-box-shadow;
-    background: $pv-sidebar-content-scrollbar-track-background;
-    border: $pv-sidebar-content-scrollbar-track-border;
-    @if $skin-name == 'Material3' {
-      border-width: 0 1px 0 0;
-    }
-  }
-
-  .e-pv-sidebar-content::-webkit-scrollbar-thumb {
-    -webkit-box-shadow: $pv-sidebar-content-scrollbar-thumb-box-shadow;
-    background: $pv-sidebar-content-scrollbar-thumb-background;
-    background-clip: $pv-sidebar-content-scrollbar-thumb-background-clip;
-    border: $pv-sidebar-content-scrollbar-thumb-border;
-    border-radius: $pv-sidebar-content-scrollbar-thumb-border-radius;
-    @if $skin-name == 'Material3' {
-      width: 6px;
-      height: 329px;
-    }
-  }
-
-  .e-pv-thumbnail-view-button.e-btn {
-    background: $pv-thumbnail-view-button-background;
-    border: $pv-thumbnail-view-button-border;
-    border-radius: $pv-thumbnail-border-radius;
-    box-shadow: $pv-thumbnail-view-button-box-shadow;
-    font-weight: $pv-thumbnail-view-button-font-weight;
-    height: $pv-thumbnail-view-button-height;
-    line-height: $pv-thumbnail-view-button-selection-line-height;
-    margin: $pv-thumbnail-view-button-margin;
-    outline: $pv-thumbnail-outline;
-    padding: $pv-thumbnail-view-button-padding;
-    width: $pv-thumbnail-view-button-width;
-    @if $skin-name == 'bootstrap5' {
-      align-items: center;
-      display: flex;
-      justify-content: center;
-    }
-    @if $skin-name == 'tailwind' or $skin-name == 'FluentUI' {
-      align-items: center;
-      display: flex;
-      justify-content: center;
-    }
-  }
-
-  .e-bigger .e-pv-thumbnail-view-button.e-btn {
-    @if $skin-name == 'bootstrap4' {
-      height: $pv-thumbnail-view-button-height-big;
-      margin: $pv-thumbnail-view-button-margin-big;
-      padding: $pv-thumbnail-view-button-padding-big;
-      width: $pv-thumbnail-view-button-width-big;
-    }
-    @if $skin-name == 'FluentUI' {
-      margin: 12px 6px;
-    }
-  }
-
-  .e-pv-thumbnail-view-button-selection.e-pv-thumbnail-view-button.e-btn,
-  .e-pv-bookmark-button-selection.e-pv-bookmark-button.e-btn  {
-    background: $pv-thumbnail-view-button-selection-background;
-    border: $pv-thumbnail-view-button-selection-border;
-    border-radius: $pv-thumbnail-border-selection-radius;
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-thumbnail-border-selection-font-color;
-    }
-    line-height: $pv-thumbnail-view-button-selection-line-height;
-    padding: $pv-thumbnail-view-button-selection-padding;
-  }
-
-  .e-bigger .e-pv-thumbnail-view-button-selection.e-pv-thumbnail-view-button.e-btn,
-  .e-bigger .e-pv-bookmark-button-selection.e-pv-bookmark-button.e-btn  {
-    @if $skin-name == 'bootstrap4' {
-      padding: $pv-thumbnail-view-button-selection-padding-big;
-    }
-  }
-
-  .e-pv-thumbnail-view-button-selection.e-pv-thumbnail-view-button.e-btn {
-    @if $skin-name == 'bootstrap4' {
-      margin: $pv-thumbnail-view-button-margin-selection;
-    }
-  }
-
-  .e-pv-bookmark-button-selection.e-pv-bookmark-button.e-btn  {
-    @if $skin-name == 'bootstrap4' {
-      line-height: $pv-thumbnail-button-selection-line-height;
-      margin: $pv-bookmark-button-margin-selection;
-    }
-  }
-
-  .e-bigger .e-pv-thumbnail-view-button-selection.e-pv-thumbnail-view-button.e-btn {
-    @if $skin-name == 'bootstrap4' {
-      margin: $pv-thumbnail-view-button-margin-big;
-    }
-  }
-
-  .e-bigger .e-pv-bookmark-button-selection.e-pv-bookmark-button.e-btn  {
-    @if $skin-name == 'bootstrap4' {
-      line-height: $pv-thumbnail-view-button-selection-line-height;
-      margin: $pv-bookmark-button-margin-big;
-    }
-  }
-
-  .e-bigger .e-pv-bookmark-button.e-btn {
-    @if $skin-name == 'bootstrap4' {
-      line-height: $pv-thumbnail-button-selection-line-height;
-    }
-    @if $skin-name == 'FluentUI' {
-      margin: 12px 6px;
-    }
-  }
-
-  .e-pv-bookmark-button.e-btn {
-    background: $pv-bookmark-button-background;
-    border: $pv-bookmark-button-border;
-    box-shadow: $pv-bookmark-button-box-shadow;
-    font-weight: $pv-thumbnail-view-button-font-weight;
-    height: $pv-bookmark-button-height;
-    margin: $pv-bookmark-button-margin;
-    outline: $pv-thumbnail-outline;
-    padding: $pv-bookmark-button-padding;
-    width: $pv-bookmark-button-width;
-    @if $skin-name == 'bootstrap5' {
-      align-items: center;
-      display: flex;
-      justify-content: center;
-    }
-    @if $skin-name == 'tailwind' or $skin-name == 'FluentUI' {
-      align-items: center;
-      display: flex;
-      justify-content: center;
-    }
-  }
-
-  .e-bigger .e-pv-bookmark-button.e-btn {
-    @if $skin-name == 'bootstrap4' {
-      height: $pv-bookmark-button-height-big;
-      margin: $pv-bookmark-button-margin-big;
-      padding: $pv-bookmark-button-padding-big;
-      width: $pv-bookmark-button-width-big;
-    }
-  }
-
-  .e-pv-title-close-div.e-btn {
-    background: $pv-title-close-background;
-    border: $pv-title-close-border;
-    box-shadow: $pv-title-close-box-shadow;
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-title-close-color;
-    }
-    height: $pv-title-close-height;
-    left: $pv-title-close-left;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind') {
-      line-height: $pv-sidebar-title-line-height;
-    }
-    padding: $pv-title-close-padding;
-    position: $pv-title-close-position;
-    right: $pv-title-close-right;
-    top: $pv-title-close-top;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind') {
-      vertical-align: $pv-sidebar-title-vertical-align;
-    }
-    width: $pv-title-close-width;
-  }
-
-  .e-bigger .e-pv-title-close-div.e-btn {
-    @if $skin-name == 'bootstrap4' {
-      top: $pv-title-close-top-big;
-    }
-  }
-
-  .e-pv-sidebar-toolbar-splitter {
-    background: $pv-sidebar-toolbar-splitter-background;
-    bottom: $pv-sidebar-toolbar-splitter-bottom;
-    height: $pv-sidebar-toolbar-splitter-height;
-    position: $pv-sidebar-toolbar-splitter-position;
-    width: $pv-sidebar-toolbar-splitter-width;
-    z-index: $pv-sidebar-toolbar-splitter-z-index;
-  }
-
-  .e-pv-sidebar-content-splitter {
-    background: $pv-sidebar-content-splitter-background;
-    height: $pv-sidebar-content-splitter-height;
-    position: $pv-sidebar-content-splitter-position;
-    top: $pv-sidebar-content-splitter-top;
-    width: $pv-sidebar-content-splitter-width;
-    z-index: $pv-sidebar-content-splitter-z-index;
-  }
-
-  .e-bigger .e-pv-sidebar-content-splitter {
-    @if $skin-name == 'bootstrap4' {
-      top: $pv-sidebar-content-splitter-top-big;
-    }
-  }
-
-  .e-pv-thumbnail-view {
-    bottom: $pv-thumbnail-view-bottom;
-    height: $pv-thumbnail-view-height;
-    padding: $pv-thumbnail-view-padding;
-    position: $pv-thumbnail-view-position;
-    top: $pv-thumbnail-view-top;
-  }
-
-  .e-pv-thumbnail {
-    height: $pv-thumbnail-height;
-    margin: $pv-thumbnail-margin;
-    width: $pv-thumbnail-width;
-  }
-
-  .e-pv-thumbnail-number {
-    color: $pv-sidebar-title-color;
-    font-family: $pv-thumbnail-number-font-family;
-    padding-left: $pv-thumbnail-number-padding-left;
-    padding-right: $pv-thumbnail-number-padding-left;
-    padding-top: $pv-thumbnail-number-padding-top;
-    @if $skin-name == 'Material3' {
-      font-weight: 500;
-    }
-  }
-
-  .e-pv-thumbnail-selection-ring {
-    @if $skin-name == 'bootstrap5' or $skin-name == 'tailwind' or $skin-name == 'FluentUI' {
-      border: $pv-thumbnail-selection-ring-border;
-    }
-    border-radius: $pv-thumbnail-selection-ring-border-radius;
-    box-shadow: $pv-thumbnail-selection-ring-box-shadow;
-    padding: $pv-thumbnail-selection-ring-padding;
-  }
-
-  .e-pv-thumbnail-image {
-    background-clip: $pv-thumbnail-image-background-clip;
-    background-color: $pv-thumbnail-image-background-color;
-    height: $pv-thumbnail-image-height;
-    width: $pv-thumbnail-image-width;
-  }
-
-  .e-pv-thumbnail-hover {
-    border: $pv-thumbnail-hover-border;
-    border-radius: $pv-thumbnail-hover-border-radius;
-    box-shadow: $pv-thumbnail-hover-box-shadow;
-    cursor: $pv-thumbnail-hover-cursor;
-    padding: $pv-thumbnail-hover-padding;
-  }
-
-  .e-pv-thumbnail-focus {
-    border: $pv-thumbnail-focus-border;
-    border-radius: $pv-thumbnail-focus-border-radius;
-    box-shadow: $pv-thumbnail-focus-box-shadow;
-    cursor: $pv-thumbnail-focus-cursor;
-    padding: $pv-thumbnail-focus-padding;
-  }
-
-  .e-pv-thumbnail-selection {
-    border: $pv-thumbnail-selection-border;
-    border-radius: $pv-thumbnail-selection-border-radius;
-    box-shadow: $pv-thumbnail-selection-box-shadow;
-    cursor: $pv-thumbnail-selection-cursor;
-    padding: $pv-thumbnail-selection-padding;
-  }
-
-  .e-pv-thumbnail-row {
-    -ms-flex-wrap: $pv-thumbnail-row-flex-wrap; // IE10
-    display: $pv-thumbnail-row-display;
-    flex-wrap: $pv-thumbnail-row-flex-wrap;
-  }
-
-  .e-pv-thumbnail-row {
-    display: -ms-flexbox; // IE10
-  }
-
-  .e-pv-thumbnail-column {
-    -ms-flex: $pv-thumbnail-column-flex; // IE10
-    flex: $pv-thumbnail-column-flex;
-  }
-
-  .e-pv-thumbnail-column img {
-    display: block;
-    margin-left: auto;
-    margin-right: auto;
-  }
-
-  .e-pv-bookmark-view {
-    height: $pv-bookmark-view-height;
-    overflow: $pv-bookmark-view-overflow;
-    padding-top: $pv-bookmark-view-padding-top;
-    position: $pv-bookmark-view-position;
-  }
-
-  div > .e-pv-bookmark-icon.e-pv-icon {
-    float: $pv-bookmark-icon-float;
-    font-size: $pv-bookmark-icon-font-size;
-    padding-left: $pv-bookmark-icon-padding-left;
-    padding-right: $pv-bookmark-icon-padding-right;
-    @if $skin-name == 'Material3' {
-      font-size: $text-base;
-      padding-left: 12px;
-      padding-right: 12px;
-    }
-  }
-
-  .e-pv-bookmark-title {
-    padding-left: $pv-bookmark-title-padding-left;
-    @if $skin-name == 'Material3' {
-      font-size: $text-sm;
-      font-weight: $font-weight-normal;
-      line-height: 20px;
-      letter-spacing: .24px;
-    }
-  }
-
-  .e-bigger div > .e-pv-bookmark-icon.e-pv-icon {
-    @if $skin-name == 'bootstrap4' {
-      font-size: $pv-icon-font-size-big;
-    }
-    @if $skin-name == 'Material3' {
-      font-size: $text-base;
-      padding-left: 12px;
-      padding-right: 12px;
-    }
-  }
-
-  .e-pv-sidebar-bookmark-title {
-    color: $pv-sidebar-bookmark-title-color;
-    font-family: $pv-sidebar-bookmark-title-font-family;
-    font-size: $pv-sidebar-bookmark-title-font-size;
-  }
-
-  .e-pv-bookmark-view::-webkit-scrollbar {
-    height: $pv-sidebar-content-scrollbar-width;
-    width: $pv-sidebar-content-scrollbar-width;
-  }
-
-  .e-pv-bookmark-view::-webkit-scrollbar-track {
-    -webkit-box-shadow: $pv-sidebar-content-scrollbar-track-box-shadow;
-    background: $pv-sidebar-content-scrollbar-track-background;
-    border: $pv-sidebar-content-scrollbar-track-border;
-    @if $skin-name == 'Material3' {
-      border-width: 0 1px 0 0;
-    }
-  }
-
-  .e-pv-bookmark-view::-webkit-scrollbar-thumb {
-    -webkit-box-shadow: $pv-sidebar-content-scrollbar-thumb-box-shadow;
-    background: $pv-sidebar-content-scrollbar-thumb-background;
-    background-clip: $pv-sidebar-content-scrollbar-thumb-background-clip;
-    border: $pv-sidebar-content-scrollbar-thumb-border;
-    border-radius: $pv-sidebar-content-scrollbar-thumb-border-radius;
-    @if $skin-name == 'Material3' {
-      width: 6px;
-      height: 329px;
-    }
-  }
-
-  .e-pv-bookmark-view > .e-ul {
-    height: inherit;
-    overflow: $-treeview-overflow;
-  }
-
-  .e-pv-bookmark-view .e-fullrow {
-    height: $-treeview-fullrow-height;
-  }
-
-  .e-pv-bookmark-view .e-icon-collapsible::before,
-  .e-pv-bookmark-view .e-icon-expandable::before {
-    display: $pv-bookmark-view-icon-collapsible-display;
-    height: $pv-bookmark-view-icon-collapsible-height;
-    padding: $pv-bookmark-view-icon-collapsible-padding;
-    width: $pv-bookmark-view-icon-collapsible-width;
-    @if $skin-name == 'Material3' {
-      margin-top: 5px;
-    }
-  }
-
-  .e-pv-bookmark-view .e-list-item .e-ul {
-    padding-left: $pv-bookmark-view-list-ul-padding-left;
-  }
-
-  .e-pv-bookmark-view .e-ul {
-    padding: $pv-bookmark-view-ul-padding;
-  }
-
-  .e-pv-text::selection {
-    background: $pv-text-selection-bg-color;
-  }
-
-  .e-pv-text .e-pv-maintaincontent {
-    background: $pv-text-selection-bg-color;
-  }
-
-  .e-pv-toolbar .e-pv-tbar-btn.e-pv-tbar-btn,
-  .e-pv-annotation-toolbar .e-pv-tbar-btn.e-pv-tbar-btn,
-  .e-pv-mobile-annotation-toolbar .e-pv-tbar-btn.e-pv-tbar-btn,
-  .e-pv-mobile-annotation-toolbar .e-dropdown-btn.e-btn,
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn,
-  .e-pv-formdesigner-toolbar .e-pv-tbar-btn.e-pv-tbar-btn,
-  .e-pv-formdesigner-toolbar .e-dropdown-btn.e-btn,
-  .e-pv-shapes-toolbar .e-pv-tbar-btn,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-menu-icon,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item .e-caret {
-    color: $pv-icon-color;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap5-dark') {
-      box-shadow: none;
-    }
-  }
-
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-selected .e-menu-icon,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-selected .e-caret {
-    @if $skin-name == 'FluentUI' {
-      color: $pv-item-selection-color;
-    }
-  }
-
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret {
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap5-dark') {
-      box-shadow: none;
-      color: inherit;
-    }
-  }
-
-  .e-pv-mobile-annotation-toolbar .e-tbar-btn:hover {
-    background: $pv-comment-panel-bg;
-    border-color: $pv-comment-panel-bg;
-  }
-
-  .e-pv-mobile-annotation-toolbar .e-tbar-btn:focus {
-    background: $pv-comment-panel-bg;
-    border-color: $pv-comment-panel-bg;
-  }
-
-  .e-pv-mobile-annotation-toolbar .e-hscroll.e-scroll-device .e-scroll-nav {
-    transform: skewX(-1deg) translateX(6px);
-    width: 56px;
-  }
-
-  .e-pv-mobile-annotation-toolbar .e-hscroll.e-scroll-device .e-scroll-nav .e-nav-arrow {
-    font-size: 14px;
-    transform: skewX(4deg);
-  }
-
-  .e-pv-mobile-annotation-toolbar .e-hscroll.e-scroll-device .e-scroll-nav.e-scroll-right-nav .e-nav-arrow {
-    color: $pv-icon-color;
-  }
-
-  .e-pv-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:hover,
-  .e-pv-annotation-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:hover,
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn:hover,
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn:hover .e-caret,
-  .e-pv-formdesigner-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:hover,
-  .e-pv-formdesigner-toolbar .e-dropdown-btn.e-btn:hover,
-  .e-pv-formdesigner-toolbar .e-dropdown-btn.e-btn:hover .e-caret,
-  .e-pv-shapes-toolbar .e-pv-tbar-btn:hover,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:hover,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon:hover,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret:hover,
-  .e-pv-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus,
-  .e-pv-annotation-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus,
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn.e-active,
-  .e-pv-formdesigner-toolbar .e-pv-tbar-btn.e-pv-tbar-btn:focus,
-  .e-pv-formdesigner-toolbar .e-dropdown-btn.e-btn:focus,
-  .e-pv-formdesigner-toolbar .e-dropdown-btn.e-btn:focus .e-caret,
-  .e-pv-shapes-toolbar .e-pv-tbar-btn:focus,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:focus,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-menu-icon:focus,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl.e-valid-input:not(.e-input-focus):hover,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused .e-caret:focus,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-valid-input:not(.e-input-focus):hover {
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-icon-color-hover;
-    }
-    @if $skin-name == 'bootstrap5' {
-      color: $white;
-    }
-    @if $skin-name == 'FluentUI' {
-      color: $pv-item-selection-color;
-    }
-  }
-
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item:hover .e-menu-icon,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:hover .e-menu-icon,
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item.e-focused:hover .e-caret {
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-icon-color-hover;
-    }
-  }
-
-  .e-pv-toolbar .e-toolbar-item.e-overlay .e-pv-tbar-btn.e-pv-tbar-btn .e-pv-icon,
-  .e-pv-annotation-toolbar .e-toolbar-item.e-overlay .e-pv-tbar-btn.e-pv-tbar-btn .e-pv-icon,
-  .e-pv-annotation-toolbar .e-toolbar-item.e-overlay .e-dropdown-btn.e-btn .e-pv-icon,
-  .e-pv-formdesigner-toolbar .e-toolbar-item.e-overlay .e-pv-tbar-btn.e-pv-tbar-btn .e-pv-icon,
-  .e-pv-formdesigner-toolbar .e-toolbar-item.e-overlay .e-dropdown-btn.e-btn .e-pv-icon {
-    color: $pv-icon-disable-color;
-  }
-
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul .e-menu-item {
-    @if $skin-name != 'Material3' {
-      height: inherit;
-    }
-  }
-
-  .e-pv-stamp.e-menu-wrapper ul .e-menu-item {
-    @if $skin-name == 'fabric' {
-      padding-top: 7px;
-    }
-  }
-
-  .e-pv-properties-line-start.e-btn:not(:hover),
-  .e-pv-properties-line-end.e-btn:not(:hover),
-  .e-pv-properties-line-style.e-btn:not(:hover),
-  .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn:not(:hover),
-  .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn:not(:hover),
-  .e-pv-properties-line-start.e-btn:not(:focus),
-  .e-pv-properties-line-end.e-btn:not(:focus),
-  .e-pv-properties-line-style.e-btn:not(:focus),
-  .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn:not(:focus),
-  .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn:not(:focus),
-  .e-pv-properties-line-start.e-btn:not(:active),
-  .e-pv-properties-line-end.e-btn:not(:active),
-  .e-pv-properties-line-style.e-btn:not(:active),
-  .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn:not(:active),
-  .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn:not(:active) {
-    @if $skin-name == 'bootstrap4' {
-      background-color: $pv-prop-win-drop-down-bg;
-      color: $pv-prop-win-drop-down-color;
-    }
-  }
-
-  .e-pv-properties-line-start.e-btn:hover,
-  .e-pv-properties-line-end.e-btn:hover,
-  .e-pv-properties-line-style.e-btn:hover,
-  .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn:hover,
-  .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn:hover {
-    @if $skin-name == 'bootstrap4' {
-      background-color: $pv-prop-win-drop-down-bg-hover;
-      color: $pv-prop-win-drop-down-color-hover;
-    }
-  }
-
-  .e-pv-toolbar .e-pv-zoom-drop-down-container .e-ddl.e-input-group.e-control-wrapper .e-ddl-icon:hover {
-    @if $skin-name == 'bootstrap4' {
-      background-color: $pv-zoom-drop-down-bgcolor;
-      color: $pv-icon-color-hover;
-    }
-    @if $skin-name == 'bootstrap5' {
-      background-color: $secondary-bg-color-hover;
-      color: $secondary-text-color-hover;
-    }
-  }
-
-  .e-pv-prop-dropdown .e-pv-annotation-fontsize-container,
-  .e-pv-prop-dropdown-rtl .e-pv-annotation-fontsize-container {
-    @if $skin-name == 'bootstrap5' {
-      padding-left: 0;
-      width: 40px;
-    }
-  }
-
-  .e-pv-print-popup-container {
-    height: $pv-print-popup-container-height;
-    left: $pv-print-popup-container-left;
-    overflow: $pv-print-popup-container-overflow;
-    position: $pv-print-popup-container-position;
-    top: $pv-print-popup-container-top;
-    width: $pv-print-popup-container-width;
-    z-index: $pv-print-popup-container-z-index;
-  }
-
-  .e-pdfviewer .e-pv-print-popup-container .e-spinner-pane.e-spin-center.e-spin-show {
-    background-color: $pv-print-overlay-bg-color;
-  }
-
-  .e-pv-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-pop .e-toolbar-item .e-tbar-btn.e-btn .e-pv-icon {
-    padding: $pv-toolbar-popup-icon-padding;
-  }
-
-  .e-pv-toolbar.e-toolbar.e-rtl .e-toolbar-pop .e-toolbar-item .e-tbar-btn.e-btn .e-pv-icon {
-    padding: $pv-toolbar-popup-icon-padding-rtl;
-  }
-
-  .e-pv-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select,
-  .e-pv-annotation-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select,
-  .e-pv-mobile-annotation-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select,
-  .e-pv-mobile-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select,
-  .e-pv-formdesigner-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select {
-    background: $pv-item-selection-background-color;
-    border: $pv-item-selection-border;
-    border-radius: $pv-item-selection-border-radius;
-    color: $pv-item-selection-color;
-  }
-
-  .e-pv-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select .e-icons,
-  .e-pv-annotation-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select .e-icons,
-  .e-pv-mobile-annotation-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select .e-icons,
-  .e-pv-mobile-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select .e-icons,
-  .e-pv-formdesigner-toolbar .e-tbar-btn.e-pv-tbar-btn.e-pv-select .e-icons {
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap4') {
-      color: $pv-item-selection-color;
-    }
-  }
-
-  .e-pv-sidebar-toolbar .e-pv-tbar-btn {
-    color: $pv-icon-color;
-  }
-
-  .e-pv-search-bar {
-    @if ($skin-name == 'Material3'){
-      background: $pv-search-box-background-color;
-    }
-    @else{
-      background-color: $pv-search-box-background-color;
-    }
-    border: $pv-search-box-border;
-    border-radius: $pv-search-box-border-radius;
-    box-shadow: $pv-search-box-box-shadow;
-    height: $pv-search-box-height;
-    padding: $pv-search-box-padding;
-    position: absolute;
-    width: $pv-search-box-width;
-    z-index: 105;
-  }
-
-  .e-bigger .e-pv-search-bar {
-    @if $skin-name == 'bootstrap4' {
-      height: $pv-search-box-height-big;
-      padding: $pv-search-box-padding-big;
-      width: $pv-search-box-width-big;
-    }
-    @if $skin-name == 'FluentUI' {
-      height: 109px;
-      padding: 16px;
-      width: 368px;
-    }
-  }
-
-  .e-pv-search-input {
-    height: $pv-search-input-height;
-    width: $pv-search-input-width;
-  }
-
-  .e-bigger .e-pv-search-input {
-    @if $skin-name == 'bootstrap4' or $skin-name == 'FluentUI' {
-      height: $pv-search-input-height-big;
-    }
-  }
-
-  .e-pv-search-input-mobile {
-    height: $pv-search-input-height;
-  }
-
-  .e-pv-match-case-container {
-    margin-top: $pv-match-case-margin-top;
-  }
-
-  .e-bigger .e-pv-match-case-container {
-    @if $skin-name == 'bootstrap4' {
-      margin-top: $pv-match-case-margin-top-big;
-    }
-  }
-
-  .e-pv-search-btn.e-btn {
-    background-color: transparent;
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-icon-color;
-    }
-    border: 0;
-    box-shadow: none;
-    height: $pv-search-btn-height;
-    margin-top: $pv-search-btn-margin-top;
-    width: $pv-search-btn-width;
-    @if $skin-name == 'FluentUI' {
-      padding-bottom: 0;
-      padding-left: 1px;
-      padding-right: 1px;
-      padding-top: 1px;
-    }
-  }
-
-  .e-bigger .e-pv-search-btn.e-btn {
-    @if $skin-name == 'bootstrap4' or  $skin-name == 'FluentUI' {
-      height: $pv-search-btn-height-big;
-      padding: 2px;
-      width: $pv-search-btn-width-big;
-    }
-  }
-
-  .e-pv-search-btn.e-btn:active {
-    background-color: transparent;
-    @if $skin-name == 'bootstrap4' {
-      background-color: $pv-item-selection-background-color;
-      color: $pv-item-selection-color;
-    }
-  }
-
-  .e-pv-search-btn.e-btn:hover:not(:disabled),
-  .e-pv-sidebar-toolbar .e-pv-tbar-btn:hover:not(:disabled) {
-    @if $skin-name == 'bootstrap4' {
-      background-color: $pv-item-selection-background-color;
-      color: $pv-item-selection-color;
-    }
-  }
-
-  .e-pv-search-btn.e-btn:disabled {
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-thumbnail-icon-disable-color;
-    }
-  }
-
-  .e-pv-search-bar:not(.e-rtl) .e-pv-prev-search {
-    margin-left: $pv-search-prev-margin-left;
-  }
-
-  .e-pv-search-bar:not(.e-rtl) .e-pv-next-search {
-    margin-left: $pv-search-next-margin-left;
-  }
-
-  .e-pv-search-bar.e-rtl .e-pv-prev-search {
-    margin-right: $pv-search-prev-margin-left;
-  }
-
-  .e-pv-search-bar.e-rtl .e-pv-next-search {
-    margin-right: $pv-search-next-margin-left;
-  }
-
-  .e-pv-search-bar.e-rtl .e-pv-prev-search .e-pv-icon-search {
-    @if $skin-name != 'bootstrap4' {
-      padding-right: 5px;
-    }
-  }
-
-  .e-pv-notification-popup {
-    height: $pv-notification-popup-height;
-    margin: 0 10px;
-    max-width: $pv-notification-popup-width;
-  }
-
-  .e-pv-notification-popup.e-pv-notification-large-content {
-    height: $pv-notification-popup-height-large-content;
-    max-width: $pv-notification-popup-width-large-content;
-  }
-
-  .e-pv-notification-popup .e-pv-notification-popup-content {
-    font-size: $pv-notification-content-font-size;
-  }
-
-  .e-pv-search-input.e-input-group .e-input-search-group-icon.e-input-group-icon {
-    background: $pv-input-background;
-  }
-
-  .e-pv-search-input.e-input-group:not(.e-disabled) .e-input-search-group-icon.e-input-group-icon:active {
-    background: $pv-input-active-background;
-    color: $pv-input-active-color;
-  }
-
-  .e-pv-search-input.e-input-group:not(.e-disabled) .e-input-search-group-icon.e-input-group-icon:hover {
-    color: $pv-input-hover-color;
-  }
-
-  .e-pv-bookmark-container {
-    background-color: $pv-bookmark-container-background-color;
-    border: $pv-bookmark-container-border;
-  }
-
-  .e-pv-bookmark-container .e-listview:not(.e-list-template) .e-list-item {
-    border-bottom: $pv-bookmark-list-border-bottom;
-    height: 48px;
-  }
-
-  .e-pv-bookmark-container .e-pv-bookmark-view.e-listview .e-ul .e-list-item:last-child {
-    border-bottom-width: 0;
-  }
-
-  .e-pv-bookmark-container .e-listview .e-list-text {
-    -ms-transform: translateY(-50%);
-    position: absolute;
-    top: 50%;
-    transform: translateY(-50%);
-  }
-
-  .e-pv-nav-toolbar.e-toolbar .e-tbar-btn:active .e-tbar-btn-text {
-    color: $pv-nav-toolbar-text-color;
-  }
-
-  .e-pv-nav-toolbar.e-toolbar .e-tbar-btn.e-tbtn-txt {
-    background-color: transparent;
-    border-width: 0;
-    box-shadow: none;
-  }
-
-  .e-pv-bookmark-container .e-pv-bookmark-view {
-    padding-top: 0;
-  }
-
-  .e-pv-bookmark-container .e-pv-bookmark-view .e-list-parent.e-ul {
-    padding-left: 0;
-  }
-
-  .e-pv-properties-color-container-style-prop .e-btn-icon.e-pv-annotation-color-icon.e-pv-icon,
-  .e-pv-properties-color-container-style-prop .e-btn-icon.e-pv-annotation-stroke-icon.e-pv-icon {
-    @if ($skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark') {
-      line-height: 1.71em;
-    }
-    border-bottom: 2px solid;
-    margin-top: 0;
-    padding-top: 5px;
-    @if $skin-name == 'bootstrap5' {
-      margin-top: -4px;
-      padding-top: 0;
-    }
-    @if $skin-name == 'FluentUI' {
-      line-height: 11px;
-    }
-    vertical-align: initial;
-  }
-
-  .e-pv-properties-font-color-container .e-btn-icon.e-pv-annotation-textcolor-icon.e-pv-icon {
-    @if ($skin-name == 'bootstrap' or $skin-name == 'bootstrap-dark') {
-      line-height: 1.71em;
-    }
-    border-bottom: 2px solid;
-    margin-top: 0;
-    padding-top: 1px;
-    vertical-align: initial;
-    @if $skin-name == 'FluentUI' {
-      line-height: 11px;
-      padding-top: 5px;
-    }
-  }
-
-  .e-pv-properties-color-container-style-prop .e-btn-icon.e-pv-annotation-thickness-icon.e-pv-icon {
-    margin-top: 0;
-    padding-top: 7px;
-    @if $skin-name == 'bootstrap5' or $skin-name == 'FluentUI' {
-      padding-top: 0;
-    }
-    vertical-align: initial;
-  }
-
-  .e-pv-custom-annotation-thickness-container .e-btn-icon.e-pv-annotation-thickness-icon.e-pv-icon,
-  .e-pv-custom-annotation-opacity-container .e-btn-icon.e-pv-annotation-opacity-icon.e-pv-icon {
-    @if $skin-name == 'bootstrap5' {
-      padding-top: 0;
-    }
-    vertical-align: initial;
-  }
-
-  .e-pv-annotation-opacity-popup-container,
-  .e-pv-annotation-thickness-popup-container {
-    @if $skin-name != 'Material3' {
-      background-color: $pv-annotation-opacity-popup-background-color;
-    }
-    box-shadow: $pv-annotation-opacity-popup-box-shadow;
-    color: $pv-annotation-opacity-popup-color;
-    height: auto;
-    min-height: $pv-annotation-opacity-popup-min-height;
-    padding: $pv-annotation-opacity-popup-padding;
-    width: auto;
-  }
-
-  .e-pv-annotation-opacity-label,
-  .e-pv-annotation-opacity-indicator,
-  .e-pv-annotation-thickness-label,
-  .e-pv-annotation-thickness-indicator {
-    float: left;
-    font-family: inherit;
-    font-size: inherit;
-  }
-
-  .e-pv-annotation-opacity-slider-container.e-control-wrapper.e-slider-container.e-horizontal,
-  .e-pv-annotation-thickness-slider-container.e-control-wrapper.e-slider-container.e-horizontal {
-    float: left;
-    height: auto;
-    margin-left: $pv-annotation-opacity-slider-margin-left;
-    margin-right: $pv-annotation-opacity-slider-margin-right;
-  }
-
-  .e-dropdown-popup:not(.e-rtl) .e-pv-annotation-opacity-slider-container.e-control-wrapper.e-slider-container.e-horizontal,
-  .e-dropdown-popup:not(.e-rtl) .e-pv-annotation-thickness-slider-container.e-control-wrapper.e-slider-container.e-horizontal {
-    width: $pv-annotation-opacity-slider-width;
-  }
-
-  .e-dropdown-popup.e-rtl .e-pv-annotation-opacity-slider-container.e-control-wrapper.e-slider-container.e-horizontal,
-  .e-dropdown-popup.e-rtl .e-pv-annotation-thickness-slider-container.e-control-wrapper.e-slider-container.e-horizontal {
-    width: $pv-annotation-opacity-slider-width-rtl;
-  }
-
-  .e-pv-annotation-opacity-slider-container.e-control-wrapper.e-slider-container .e-pv-annotation-opacity-slider.e-slider,
-  .e-pv-annotation-thickness-slider-container.e-control-wrapper.e-slider-container .e-pv-annotation-opacity-slider.e-slider {
-    height: $pv-annotation-opacity-slider-height;
-  }
-
-  .e-pv-annotation-color-container.e-dropdown-btn.e-btn .e-caret .e-pv-annotation-opacity-container.e-dropdown-btn.e-btn .e-caret .e-pv-annotation-textcolor-container.e-dropdown-btn.e-btn .e-caret,
-  .e-pv-annotation-textalign-container.e-dropdown-btn.e-btn .e-caret,
-  .e-pv-annotation-textprop-container.e-dropdown-btn.e-btn .e-caret {
-    font-size: $pv-annotation-drop-down-caret-font-size;
-  }
-
-  .e-bigger .e-.e-pv-annotation-color-container.e-dropdown-btn.e-btn .e-caret .e-pv-annotation-opacity-container.e-dropdown-btn.e-btn .e-caret .e-pv-annotation-textcolor-container.e-dropdown-btn.e-btn .e-caret,
-  .e-bigger .e-pv-annotation-textalign-container.e-dropdown-btn.e-btn .e-caret,
-  .e-bigger .e-pv-annotation-textprop-container.e-dropdown-btn.e-btn .e-caret {
-    font-size: 18px;
-  }
-
-  .e-pv-annotation-color-container .e-btn,
-  .e-pv-annotation-opacity-container .e-btn,
-  .e-pv-annotation-stroke-container .e-btn,
-  .e-pv-custom-annotation-thickness-container .e-btn,
-  .e-pv-custom-annotation-opacity-container .e-btn,
-  .e-pv-annotation-thickness-container .e-btn,
-  .e-pv-annotation-textcolor-container .e-btn,
-  .e-pv-annotation-textalign-container .e-btn,
-  .e-pv-annotation-textprop-container .e-btn {
-    height: $pv-annotation-drop-down-height;
-    width: $pv-annotation-drop-down-width;
-  }
-
-  .e-pv-annotation-thickness-container.e-btn.e-icon-btn.e-dropdown-btn {
-    @if ($skin-name != 'bootstrap5') {
-      padding-top: $pv-annotation-thickness-drop-down-padding-top;
-    }
-  }
-
-  .e-pv-shapes-toolbar {
-    @if $skin-name == 'Material3' {
-      border-radius: 4px;
-    }
-    box-shadow: $pv-drop-down-toolbar-box-shadow;
-  }
-
-  .e-pv-shapes-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item:not(.e-separator) {
-    padding: 4px;
-  }
-
-  .e-pv-shapes-toolbar.e-toolbar .e-toolbar-items.e-toolbar-multirow {
-    margin-bottom: 0;
-    margin-left: 4px;
-    margin-right: 4px;
-    @if $skin-name == 'Material3' {
-      margin-top: 4px;
-    }
-  }
-
-  .e-pv-shapes-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn {
-    height: 32px;
-    width: 32px;
-    @if $skin-name == 'FluentUI' {
-      min-height: 32px;
-    }
-  }
-
-  .e-pv-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn,
-  .e-pv-annotation-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn {
-    @if $skin-name == 'FluentUI' {
-      min-height: 32px;
-    }
-  }
-
-  .e-pv-annotation-thickness-slider-container {
-    margin-top: -6px;
-  }
-
-  .e-pv-annotation-opacity-icon {
-    padding-top: $pv-annotation-opacity-icon-padding-top;
-  }
-
-  .e-pv-annotation-stamp-container .e-menu-wrapper ul.e-menu:not(.e-vertical) {
-    @if $skin-name == 'highcontrast' {
-      padding: 0;
-    }
-  }
-
-  .e-pv-annotation-color-container.e-btn,
-  .e-pv-annotation-opacity-container.e-btn,
-  .e-pv-annotation-stroke-container.e-btn,
-  .e-pv-annotation-thickness-container.e-btn,
-  .e-pv-annotation-shapes-container.e-btn,
-  .e-pv-annotation-calibrate-container.e-btn,
-  .e-pv-annotation-textcolor-container.e-btn,
-  .e-pv-annotation-textalign-container.e-btn,
-  .e-pv-annotation-textprop-container.e-btn,
-  .e-pv-annotation-handwritten-container.e-btn,
-  .e-pv-stamp.e-menu-wrapper ul .e-menu-item.e-focused:not(.e-selected) {
-    @if $skin-name == 'Material3' {
-      background: $pv-annotation-dropdown-background-color;
-      border: $pv-annotation-dropdown-border-color;
-    }
-    @else {
-      background-color: $pv-annotation-dropdown-background-color;
-      border-color: $pv-annotation-dropdown-border-color;
-    }
-  }
-
-  .e-pv-annotation-color-container.e-btn:hover,
-  .e-pv-annotation-opacity-container.e-btn:hover,
-  .e-pv-annotation-stroke-container.e-btn:hover,
-  .e-pv-annotation-thickness-container.e-btn:hover,
-  .e-pv-annotation-shapes-container.e-btn:hover,
-  .e-pv-annotation-calibrate-container.e-btn:hover,
-  .e-pv-annotation-textcolor-container.e-btn:hover,
-  .e-pv-annotation-textalign-container.e-btn:hover,
-  .e-pv-annotation-textprop-container.e-btn:hover,
-  .e-pv-annotation-handwritten-container.e-btn:hover,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl.e-valid-input:hover,
-  .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl.e-valid-input:hover,
-  .e-pv-stamp.e-menu-wrapper ul .e-menu-item.e-focused:hover {
-    @if $skin-name == 'Material3' {
-      background: $pv-annotation-dropdown-background-color-hover;
-      border: $pv-annotation-dropdown-border-color-hover;
-    }
-    @else {
-      background-color: $pv-annotation-dropdown-background-color-hover;
-      border-color: $pv-annotation-dropdown-border-color-hover;
-    }
-  }
-
-  .e-pv-annotation-color-container.e-btn:active,
-  .e-pv-annotation-opacity-container.e-btn:active,
-  .e-pv-annotation-stroke-container.e-btn:active,
-  .e-pv-annotation-thickness-container.e-btn:active,
-  .e-pv-annotation-shapes-container.e-btn:active,
-  .e-pv-annotation-calibrate-container.e-btn:active,
-  .e-pv-annotation-textcolor-container.e-btn:active,
-  .e-pv-annotation-textalign-container.e-btn:active,
-  .e-pv-annotation-textprop-container.e-btn:active,
-  .e-pv-annotation-handwritten-container.e-btn:active {
-    @if $skin-name == 'Material3' {
-      background: $pv-annotation-dropdown-background-color-active;
-      border: $pv-annotation-dropdown-border-color-active;
-    }
-    @else {
-      background-color: $pv-annotation-dropdown-background-color-active;
-      border-color: $pv-annotation-dropdown-border-color-active;
-    }
-    box-shadow: none;
-    color: $pv-item-selection-color;
-  }
-
-  .e-pv-annotation-shapes-container.e-btn.e-dropdown-btn.e-active:not(:hover),
-  .e-pv-annotation-calibrate-container.e-btn.e-dropdown-btn.e-active:not(:hover),
-  .e-pv-annotation-handwritten-container.e-dropdown-btn.e-btn.e-active:not(:hover),
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn.e-active:not(:hover) .e-caret {
-    @if $skin-name == 'Material3' {
-      background: $pv-annotation-dd-background-color-active;
-    }
-    @else {
-      background-color: $pv-annotation-dd-background-color-active;
-    }
-    color: $pv-icon-color;
-    @if ($skin-name == 'bootstrap5') {
-      color: $secondary-text-color-pressed;
-    }
-  }
-
-  .e-pv-annotation-color-container.e-dropdown-btn.e-btn,
-  .e-pv-annotation-opacity-container.e-dropdown-btn.e-btn,
-  .e-pv-annotation-stroke-container.e-dropdown-btn.e-btn,
-  .e-pv-custom-annotation-thickness-container.e-dropdown-btn.e-btn,
-  .e-pv-custom-annotation-opacity-container.e-dropdown-btn.e-btn,
-  .e-pv-annotation-thickness-container.e-dropdown-btn.e-btn,
-  .e-pv-annotation-textcolor-container.e-dropdown-btn.e-btn,
-  .e-pv-annotation-textalign-container.e-dropdown-btn.e-btn,
-  .e-pv-annotation-textprop-container.e-dropdown-btn.e-btn {
-    line-height: $pv-annotation-drop-down-btn-line-height;
-    padding: $pv-annotation-drop-down-btn-padding;
-    @if ($skin-name == 'bootstrap5' or $skin-name =='Material3') {
-      align-items: center;
-      display: flex;
-    }
-  }
-
-  .e-pv-annotation-color-container.e-dropdown-btn.e-button,
-  .e-pv-annotation-opacity-container.e-dropdown-btn.e-button,
-  .e-pv-annotation-stroke-container.e-dropdown-btn.e-button,
-  .e-pv-custom-annotation-thickness-container.e-dropdown-btn.e-button,
-  .e-pv-custom-annotation-opacity-container.e-dropdown-btn.e-button,
-  .e-pv-annotation-thickness-container.e-dropdown-btn.e-bbuttontn,
-  .e-pv-annotation-textcolor-container.e-dropdown-btn.e-button,
-  .e-pv-annotation-textalign-container.e-dropdown-btn.e-button,
-  .e-pv-annotation-textprop-container.e-dropdown-btn.e-button {
-    line-height: $pv-annotation-drop-down-btn-line-height;
-    padding: $pv-annotation-drop-down-btn-padding;
-    @if ($skin-name == 'bootstrap5') {
-      align-items: baseline;
-      display: flex;
-    }
-  }
-
-  .e-pv-annotation-color-container.e-btn.e-active,
-  .e-pv-annotation-opacity-container.e-btn.e-active,
-  .e-pv-annotation-stroke-container.e-btn.e-active,
-  .e-pv-annotation-shapes-container.e-btn.e-active,
-  .e-pv-annotation-calibrate-container.e-btn.e-active,
-  .e-pv-annotation-textcolor-container.e-btn.e-active,
-  .e-pv-annotation-textprop-container.e-btn.e-active,
-  .e-pv-custom-annotation-thickness-container.e-btn.e-active,
-  .e-pv-custom-annotation-opacity-container.e-btn.e-active,
-  .e-pv-annotation-handwritten-container.e-btn.e-active,
-  .e-pv-annotation-textalign-container.e-btn.e-active {
-    @if ($skin-name == 'bootstrap5') {
-      background-color: $pv-annotation-dropdown-background-color-hover;
-      border-color: $pv-annotation-dropdown-border-color-hover;
-      color: $white;
-    }
-  }
-
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-menu-icon .e-caret,
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item.e-focused .e-menu-icon .e-caret {
-    @if ($skin-name == 'bootstrap5') {
-      height: 32px;
-      line-height: 32px;
-      padding: 0 8px;
-    }
-  }
-
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-menu-icon .e-caret,
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item.e-focused .e-menu-icon .e-caret {
-    @if ($skin-name == 'bootstrap5') {
-      height: 32px;
-      line-height: 32px;
-      padding: 0 8px;
-    }
-  }
-
-  .e-pv-custom-annotation-stamp-container,
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-pv-stamp-icon,
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-caret {
-    @if ($skin-name == 'FluentUI') {
-      background-color: transparent;
-      height: 32px;
-      line-height: 32px;
-    }
-  }
-
-  .e-pv-toolbar.e-toolbar .e-tbar-btn .e-icons.e-btn-icon,
-  .e-pv-annotation-toolbar.e-toolbar .e-tbar-btn .e-icons.e-btn-icon {
-    @if ($skin-name == 'FluentUI') {
-      font-size: $pv-icon-font-size;
-    }
-  }
-
-  .e-pv-submit .e-tbar-btn {
-    @if ($skin-name == 'bootstrap5') {
-      height: 30px;
-    }
-  }
-
-  .e-pv-toolbar.e-toolbar.e-toolpop .e-toolbar-items .e-toolbar-item.e-popup-text .e-tbar-btn-text.e-pv-submitform-text {
-    display: inline-block;
-    padding: 0 4px;
-  }
-
-  .e-pv-toolbar.e-toolbar.e-toolpop .e-toolbar-items .e-toolbar-item.e-pv-submit .e-tbar-btn .e-tbar-btn-text.e-pv-submitform-text {
-    display: inline-block;
-    @if $skin-name == 'FluentUI' {
-      padding: 3px 4px;
-    }
-    @else {
-      padding: 0 4px;
-    }
-  }
-
-  .e-pv-mobile-toolbar .e-toolbar-items .e-toolbar-item .e-btn.e-tbar-btn,
-  .e-pv-nav-toolbar .e-toolbar-items .e-toolbar-item .e-btn.e-tbar-btn {
-    height: $pv-toolbar-btn-height-mobile;
-    min-width: $pv-toolbar-btn-width-mobile;
-  }
-
-  .e-pv-annotation-popup-menu {
-    background-color: $pv-sidebar-toolbar-background;
-    border-color: $pv-control-border-color;
-    color: $pv-toolbar-total-page-number-color;
-  }
-
-  .e-pv-properties-window {
-    max-width: $pv-properties-win-max-width;
-  }
-
-  .e-pv-scale-ratio-window {
-    max-width: $pv-scale-ratio-win-max-width;
-  }
-
-  .e-pv-scale-ratio-dialog {
-    max-width: $pv-blazor-scale-ratio-dialog-max-width;
-  }
-
-  .e-pv-line-styles-content,
-  .e-pv-line-styles-item {
-    border-bottom-color: $pv-prop-line-styles-color;
-  }
-
-  .e-pv-line-styles-container:hover {
-    background-color: $pv-prop-line-styles-hover-bg;
-  }
-
-  .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn,
-  .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn {
-    height: $pv-prop-color-picker-height;
-    line-height: $pv-prop-color-picker-line-height;
-    @if ($skin-name == 'bootstrap5') {
-      background: $transparent;
-      border: 1px solid $border-light;
-      border-radius: 4px;
-      box-sizing: border-box;
-      color: $content-text-color;
-    }
-    @if ($skin-name == 'Material3') {
-      padding: 7px;
-    }
-  }
-
-  .e-bigger .e-pv-properties-line-fill-color-container .e-dropdown-btn.e-btn,
-  .e-bigger .e-pv-properties-line-stroke-color-container .e-dropdown-btn.e-btn {
-    @if $skin-name == 'FluentUI' {
-      height: 40px;
-    }
-  }
-
-  .e-pv-properties-window .e-dlg-content {
-    padding-top: 6px;
-  }
-
-  .e-pv-scale-ratio-text,
-  .e-pv-depth-text {
-    margin-bottom: 8px;
-  }
-
-  .e-pv-properties-line-start-container,
-  .e-pv-properties-line-end-container,
-  .e-pv-properties-line-style-container,
-  .e-pv-properties-line-thickness-container,
-  .e-pv-properties-line-fill-color-container,
-  .e-pv-properties-line-stroke-color-container,
-  .e-pv-properties-line-leader-length-container {
-    float: left;
-    height: $pv-properties-container-height;
-    margin-bottom: $pv-properties-container-margin-bottom;
-  }
-
-  .e-pv-properties-line-opacity-container {
-    float: left;
-    height: auto;
-    width: $pv-properties-window-container-max-width;
-    @if $skin-name == 'Material3'
-    {
-      width: 204px;
-      max-width: 204px;
-    }
-  }
-
-  .e-pv-scale-ratio-src-input-container,
-  .e-pv-scale-ratio-src-unit-container,
-  .e-pv-scale-ratio-dest-input-container,
-  .e-pv-scale-ratio-dest-unit-container,
-  .e-pv-depth-input-container,
-  .e-pv-depth-unit-container {
-    float: left;
-    height: $pv-scale-ratio-input-container-height;
-  }
-
-  .e-bigger .e-pv-scale-ratio-src-input-container,
-  .e-bigger .e-pv-scale-ratio-src-unit-container,
-  .e-bigger .e-pv-scale-ratio-dest-input-container,
-  .e-bigger .e-pv-scale-ratio-dest-unit-container,
-  .e-bigger .e-pv-depth-input-container,
-  .e-bigger .e-pv-depth-unit-container {
-    @if $skin-name == 'FluentUI' {
-      float: left;
-      height: 40px;
-    }
-  }
-
-  .e-pv-scale-ratio-src-input-container,
-  .e-pv-scale-ratio-src-unit-container,
-  .e-pv-scale-ratio-dest-input-container,
-  .e-pv-scale-ratio-dest-unit-container {
-    margin-bottom: $pv-scale-ratio-input-container-margin-bottom;
-  }
-
-  .e-pv-scale-ratio-src-unit-container,
-  .e-pv-scale-ratio-dest-unit-container,
-  .e-pv-depth-unit-container {
-    margin-left: $pv-prop-win-margin-left;
-  }
-
-  .e-pv-scale-ratio-src-unit.e-btn,
-  .e-pv-scale-ratio-dest-unit.e-btn,
-  .e-pv-depth-unit.e-btn {
-    padding: $pv-scale-ratio-win-drop-down-padding;
-  }
-
-  .e-pv-scale-unit-content {
-    float: left;
-    width: 33px;
-  }
-
-  .e-pv-scale-ratio-src-unit .e-caret,
-  .e-pv-scale-ratio-dest-unit .e-caret,
-  .e-pv-depth-unit .e-caret {
-    margin-left: $pv-scale-ratio-win-drop-down-caret-margin-left;
-    margin-top: $pv-scale-ratio-win-drop-down-caret-margin-top;
-  }
-
-  .e-bigger .e-pv-scale-ratio-src-unit .e-caret,
-  .e-bigger .e-pv-scale-ratio-dest-unit .e-caret,
-  .e-bigger .e-pv-depth-unit .e-caret {
-    @if $skin-name == 'FluentUI' {
-      margin-left: 160px;
-    }
-  }
-
-  .e-pv-properties-line-opacity {
-    margin-top: -10px;
-  }
-
-  .e-pv-properties-line-start-label,
-  .e-pv-properties-line-end-label,
-  .e-pv-properties-line-style-label,
-  .e-pv-properties-line-thickness-label,
-  .e-pv-properties-line-fill-color-label,
-  .e-pv-properties-line-stroke-color-label,
-  .e-pv-properties-line-opacity-label,
-  .e-pv-properties-line-leader-length-label {
-    margin-bottom: 8px;
-    @if ($skin-name == 'FluentUI') {
-      font-weight: 600;
-    }
-    @if ($skin-name == 'Material3'){
-      font-size: $text-xxs;
-      margin-bottom: 0;
-    }
-    @else {
-      font-size: 14px;
-    }
-  }
-
-  .e-pv-properties-line-end-container,
-  .e-pv-properties-line-thickness-container {
-    @if ($skin-name == 'bootstrap5') {
-      margin-left: 37px;
-    }
-    @if ($skin-name == 'Material3'){
-      margin-left: 12px;
-    }
-    @else {
-      margin-left: 24px;
-    }
-  }
-
-  .e-pv-properties-line-leader-length-container {
-    margin-left: $pv-line-leader-length-margin-left;
-  }
-
-  .e-bigger .e-pv-properties-line-leader-length-container {
-    @if $skin-name == 'FluentUI' {
-      margin-left: 100px;
-    }
-  }
-
-  .e-pv-properties-line-stroke-color-container {
-    margin-left: $pv-line-stroke-color-margin-left;
-    margin-right: 87px;
-  }
-
-  .e-bigger .e-pv-properties-line-stroke-color-container {
-    @if $skin-name == 'FluentUI' {
-      margin-left: 195px;
-    }
-  }
-
-  .e-pv-properties-line-start,
-  .e-pv-properties-line-end,
-  .e-pv-properties-line-style,
-  .e-pv-properties-line-thickness,
-  .e-pv-properties-line-opacity,
-  .e-pv-properties-line-leader-length {
-    max-width: $pv-properties-window-container-max-width;
-  }
-
-  .e-bigger .e-pv-properties-line-start,
-  .e-bigger .e-pv-properties-line-end,
-  .e-bigger .e-pv-properties-line-style,
-  .e-bigger .e-pv-properties-line-thickness,
-  .e-bigger .e-pv-properties-line-opacity,
-  .e-bigger .e-pv-properties-line-leader-length {
-    @if $skin-name == 'FluentUI' {
-      max-width: 248px;
-    }
-  }
-
-  .e-pv-scale-ratio-src-input,
-  .e-pv-scale-ratio-dest-input,
-  .e-pv-depth-input {
-    max-width: $pv-scale-ratio-container-max-width;
-  }
-
-  .e-bigger .e-pv-scale-ratio-src-input,
-  .e-bigger .e-pv-scale-ratio-dest-input,
-  .e-bigger .e-pv-depth-input {
-    @if $skin-name == 'FluentUI' {
-      max-width: 248px;
-    }
-  }
-
-  .e-pv-properties-line-start,
-  .e-pv-properties-line-end,
-  .e-pv-properties-line-style {
-    width: $pv-properties-window-container-width;
-  }
-
-  .e-pv-properties-line-style {
-    @if ($skin-name == 'Material3'){
-      font-size: $text-xxs;
-      max-width: 214px;
-      border-radius: 0;
-    }
-  }
-
-  .e-bigger .e-pv-properties-line-start,
-  .e-bigger .e-pv-properties-line-end,
-  .e-bigger .e-pv-properties-line-style {
-    @if $skin-name == 'FluentUI' {
-      width: 248px;
-    }
-  }
-
-  .e-pv-scale-ratio-src-unit,
-  .e-pv-scale-ratio-dest-unit,
-  .e-pv-depth-unit {
-    width: $pv-scale-ratio-width;
-  }
-
-  .e-bigger .e-pv-scale-ratio-src-unit,
-  .e-bigger .e-pv-scale-ratio-dest-unit,
-  .e-bigger .e-pv-depth-unit {
-    @if $skin-name == 'FluentUI' {
-      height: 40px;
-      width: 248px;
-    }
-  }
-
-  .e-pv-line-styles-container {
-    line-height: 0;
-    padding: 17px;
-  }
-
-  .e-pv-line-styles-item {
-    border-bottom-width: 2px;
-    box-sizing: border-box;
-    display: inline-block;
-    width: 100%;
-  }
-
-  .e-pv-line-styles-content {
-    border-bottom-width: 2px;
-    display: inline-block;
-    width: 100%;
-  }
-
-  .e-pv-properties-line-style-content {
-    float: left;
-    line-height: 16px;
-    width: 44px;
-    @if $skin-name == 'FluentUI' {
-      line-height: 20px;
-    }
-    @if ($skin-name == 'Material3'){
-      font-size: $text-sm;
-    }
-  }
-
-  .e-pv-properties-line-start.e-btn,
-  .e-pv-properties-line-end.e-btn {
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap5-dark') {
-      background: transparent;
-      border-color: $border;
-      box-shadow: none;
-      color: $content-text-color;
-    }
-    @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark') {
-      height: 30px;
-    }
-    @if ($skin-name == 'Material3'){
-      border-bottom: 1px solid rgba($border);
-      border-radius: 0;
-      width: 214px;
-      height: 32px;
-    }
-
-    @else {
-      height: 32px;
-    }
-    padding: $pv-properties-padding;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap5-dark') {
-      text-align: center;
-    }
-  }
-
-  .e-bigger .e-pv-properties-line-start.e-btn,
-  .e-bigger .e-pv-properties-line-end.e-btn,
-  .e-bigger .e-pv-properties-line-style.e-btn {
-    @if $skin-name == 'FluentUI' {
-      height: 40px;
-    }
-  }
-
-  .e-pv-properties-line-style.e-btn {
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'bootstrap5-dark') {
-      background: transparent;
-      border-color: $border;
-      box-shadow: none;
-      color: $content-text-color;
-    }
-    @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark') {
-      height: 30px;
-    }
-    @if ($skin-name =='Material3'){
-      border-bottom: 1px solid rgba($border);
-      border-radius: 0;
-    }
-    @else {
-      height: 32px;
-    }
-    line-height: 0;
-    padding: $pv-properties-line-style-padding;
-    white-space: pre;
-  }
-
-  .e-pv-properties-line-start.e-btn .e-caret,
-  .e-pv-properties-line-end.e-btn .e-caret {
-    @if $skin-name == 'bootstrap4' {
-      display: block;
-    }
-    @else {
-      display: inline;
-    }
-    line-height: 16px;
-    margin-left: $pv-properties-drop-down-margin-left;
-  }
-
-  .e-bigger .e-pv-properties-line-start.e-btn .e-caret,
-  .e-bigger .e-pv-properties-line-end.e-btn .e-caret {
-    @if $skin-name == 'FluentUI' {
-      margin-left: 145px;
-    }
-  }
-
-  .e-pv-line-styles-content-container {
-    float: left;
-    font-size: 0;
-    margin-right: 7.5px;
-    margin-top: $pv-prop-line-styles-margin-top;
-    @if $skin-name == 'FluentUI' {
-      width: 120px;
-    }
-    @if ($skin-name == 'Material3'){
-      width: 155px;
-      padding-top: 6px;
-    }
-    @else {
-      width: 138px;
-    }
-  }
-
-  .e-bigger .e-pv-line-styles-content-container {
-    @if $skin-name == 'FluentUI' {
-      margin-top: 5.5px;
-      width: 180px;
-    }
-  }
-
-  .e-pv-annotation-shapes-container.e-btn.e-icon-btn,
-  .e-pv-annotation-calibrate-container.e-btn.e-icon-btn,
-  .e-pv-annotation-handwritten-container.e-btn.e-icon-btn,
-  .e-menu-wrapper.e-custom-scroll.e-lib.e-keyboard.e-pv-stamp ul {
-    @if $skin-name != 'Material3' {
-      height: $pv-annot-toolbar-dropdown-btn-height;
-      width: $pv-annot-toolbar-dropdown-btn-width;
-    }
-    @else {
-      width: max-content;
-    }
-  }
-
-  .e-pv-annotation-shapes-container.e-btn.e-icon-button,
-  .e-pv-annotation-calibrate-container.e-btn.e-icon-button,
-  .e-pv-annotation-handwritten-container.e-btn.e-icon-button {
-    @if $skin-name == 'bootstrap5' {
-      align-items: baseline;
-      display: flex;
-      height: $pv-annot-toolbar-dropdown-btn-height;
-      line-height: $pv-annot-toolbar-dropdown-btn-height;
-      padding: 3px 8px;
-      width: $pv-annot-toolbar-dropdown-btn-width;
-    }
-  }
-
-  .e-pv-annotation-shapes-container.e-btn.e-icon-btn,
-  .e-pv-annotation-calibrate-container.e-btn.e-icon-btn,
-  .e-pv-annotation-handwritten-container.e-btn.e-icon-btn {
-    @if $skin-name == 'bootstrap5' {
-      align-items: baseline;
-      display: flex;
-      padding: $pv-annotation-icon-padding;
-    }
-    @else {
-      padding: $pv-annotation-icon-padding;
-    }
-  }
-
-  .e-pv-annotation-shapes-container .e-btn-icon.e-icons.e-icon-right.e-caret,
-  .e-pv-annotation-calibrate-container .e-btn-icon.e-icons.e-icon-right.e-caret,
-  .e-pv-annotation-handwritten-container .e-btn-icon.e-icons.e-icon-right.e-caret,
-  .e-pv-alignment-container .e-btn-icon.e-icons.e-icon-right.e-caret,
-  .e-pv-text-color-container .e-btn-icon.e-icons.e-icon-right.e-caret,
-  .e-pv-color-template-container .e-btn-icon.e-icons.e-icon-right.e-caret,
-  .e-pv-stroke-template-container .e-btn-icon.e-icons.e-icon-right.e-caret,
-  .e-pv-thickness-template-container .e-btn-icon.e-icons.e-icon-right.e-caret,
-  .e-pv-opacity-template-container .e-btn-icon.e-icons.e-icon-right.e-caret {
-    @if $skin-name == 'bootstrap5' {
-      padding-bottom: 0;
-      width: 20px;
-    }
-  }
-
-  .e-pv-annotation-shape-icon,
-  .e-pv-annotation-calibrate-icon,
-  .e-pv-handwritten-icon {
-    margin-right: 4px;
-  }
-
-  .e-pv-stamp-template-container .e-menu-item.e-menu-caret-icon {
-    @if $skin-name == 'bootstrap5' {
-      padding: 0 26px 0 8px;
-    }
-  }
-
-  .e-pv-properties-opacity-indicator {
-    @if $skin-name == 'FluentUI' {
-      margin-left: 141px;
-    }
-    @if $skin-name == 'Material3' {
-      margin-left: 190px;
-    }
-    @else {
-      margin-left: 153px;
-    }
-  }
-
-  .e-pv-annotation-stamp-container .e-menu-parent.e-menu {
-    border-radius: $pv-stamp-container-border-radius;
-  }
-
-  .e-pv-annotation-shapes-container.e-btn.e-icon-btn,
-  .e-pv-annotation-calibrate-container.e-btn.e-icon-btn,
-  .e-pv-annotation-handwritten-container.e-btn.e-icon-btn,
-  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item,
-  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item .e-pv-stamp-icon,
-  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item .e-caret {
-    @if $skin-name != 'Material3' {
-      line-height: $pv-annot-toolbar-dropdown-btn-line-height;
-    }
-  }
-
-  .e-pv-annotation-stamp-container .e-menu-parent.e-menu .e-menu-item.e-selected {
-    @if $skin-name == 'bootstrap5' {
-      background: $secondary-bg-color-pressed;
-    }
-  }
-
-  .e-bigger .e-pv-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-tbar-btn.e-btn,
-  .e-bigger .e-pv-annotation-toolbar.e-toolbar .e-toolbar-items .e-toolbar-item .e-pv-tbar-btn.e-btn {
-    height: $pv-toolbar-btn-height-big;
-    line-height: $pv-toolbar-btn-line-height;
-    margin: $pv-toolbar-btn-margin;
-    @if $skin-name != 'Material3' {
-      padding: $pv-toolbar-btn-padding;
-    }
-    width: $pv-toolbar-btn-width-big;
-  }
-
-  .e-bigger .e-pv-current-page-box.e-input-group.e-control-wrapper input.e-input {
-    padding-top: $pv-mobile-page-box-padding-top;
-  }
-
-  .e-toolbar-item.e-pv-current-page-container {
-    @if $skin-name == 'bootstrap5' {
-      padding-top: 2px;
-    }
-  }
-
-  .e-bigger .e-toolbar .e-toolbar-items .e-toolbar-item.e-pv-zoom-drop-down-container {
-    width: $pv-zoom-dropdown-width-mobile;
-  }
-
-  .e-bigger .e-toolbar.e-pv-toolbar .e-toolbar-items .e-toolbar-item:not(.e-separator),
-  .e-bigger .e-toolbar.e-pv-annotation-toolbar .e-toolbar-items .e-toolbar-item:not(.e-separator) {
-    @if $skin-name == 'bootstrap4' {
-      padding-left: $pv-toolbar-items-padding-left-big;
-      padding-right: $pv-toolbar-items-padding-right-big;
-    }
-  }
-
-  .e-pv-toolbar.e-toolbar .e-tbar-btn > :first-child {
-    line-height: $pv-toolbaritem-btn-line-height;
-    min-height: $pv-toolbaritem-btn-min-height;
-  }
-
-  .e-bigger .e-pv-current-page-box.e-input-group.e-control-wrapper input.e-input:focus {
-    padding-left: $pv-mobile-page-box-padding-left-focus;
-  }
-
-  .e-bigger .e-pv-password-popup.e-dialog,
-  .e-pv-mobile-view .e-pv-password-popup.e-dialog {
-    @if ($skin-name != 'Material3') {
-      height: $pv-password-dialog-height-mobile;
-    }
-  }
-  .e-bigger .e-pv-password-popup.e-dialog,
-  .e-pv-mobile-view .e-pv-password-popup.e-dialog {
-    @if ($skin-name == 'FluentUI') {
-      height: 270px;
-    }
-  }
-
-  .e-bigger .e-pv-notification-popup.e-dialog,
-  .e-pv-mobile-view .e-pv-notification-popup.e-dialog {
-    @if $skin-name != 'Material3' {
-      height: $pv-notification-dialog-height-mobile;
-    }
-  }
-
-  .e-bigger .e-pv-notification-popup.e-pv-notification-large-content.e-dialog,
-  .e-pv-mobile-view .e-pv-notification-popup.e-pv-notification-large-content.e-dialog {
-    @if $skin-name != 'Material3' {
-      height: $pv-notification-dialog-height-large-mobile;
-    }
-  }
-
-  .e-bigger .e-pv-notification-popup.e-pv-notification-large-content.e-dialog,
-  .e-pv-mobile-view .e-pv-notification-popup.e-pv-notification-large-content.e-dialog {
-    @if ($skin-name == 'FluentUI') {
-      height: 280px;
-    }
-  }
-  .e-bigger .e-pv-corrupted-popup.e-dialog,
-  .e-pv-mobile-view .e-pv-corrupted-popup.e-dialog {
-    @if $skin-name != 'Material3' {
-      height: $pv-corrupted-dialog-height-mobile;
-    }
-  }
-
-  .e-bigger .e-pv-password-popup.e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn,
-  .e-bigger .e-pv-corrupted-popup.e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn,
-  .e-pv-mobile-view .e-pv-password-popup.e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn,
-  .e-pv-mobile-view .e-pv-corrupted-popup.e-dialog .e-dlg-header-content .e-btn.e-dlg-closeicon-btn {
-    padding-top: $pv-dialog-pop-close-icon-padding-top-mobile;
-  }
-
-  .e-pv-zoom-drop-down-container .e-input-group:not(.e-disabled) .e-input-group-icon:hover,
-  .e-pv-zoom-drop-down-container .e-input-group.e-control-wrapper:not(.e-disabled) .e-input-group-icon:hover {
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-title-close-color;
-    }
-  }
-
-  .e-pv-fontfamily-container .e-input-group:not(.e-disabled) .e-input-group-icon:hover,
-  .e-pv-fontfamily-container .e-input-group.e-control-wrapper:not(.e-disabled) .e-input-group-icon:hover {
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-title-close-color;
-    }
-    @if $skin-name == 'bootstrap5' {
-      color: $white;
-    }
-  }
-
-  .e-pv-fontfamily-container .e-input-group .e-input-group-icon,
-  .e-input-group.e-control-wrapper .e-input-group-icon {
-    @if $skin-name == 'bootstrap5' {
-      color: inherit;
-    }
-  }
-
-  .e-pv-fontsize-container .e-input-group:not(.e-disabled) .e-input-group-icon:hover,
-  .e-pv-fontsize-container .e-input-group.e-control-wrapper:not(.e-disabled) .e-input-group-icon:hover {
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-title-close-color;
-    }
-  }
-
-  .e-bigger .e-toolbar.e-pv-toolbar .e-toolbar-items.e-tbar-pos .e-toolbar-left,
-  .e-bigger .e-toolbar.e-pv-toolbar .e-toolbar-items.e-tbar-pos .e-toolbar-right  {
-    top: 0;
-  }
-
-  .e-bigger .e-pv-toolbar.e-rtl .e-pv-current-page-box.e-input-group.e-control-wrapper input.e-input {
-    padding-right: $pv-current-page-padding-right-rtl;
-  }
-
-  .e-bigger .e-pv-toolbar.e-rtl .e-input-group.e-control-wrapper.e-pv-zoom-drop-down.e-ddl input.e-input.e-control.e-keyboard,
-  .e-bigger .e-pv-toolbar.e-rtl .e-input-group.e-control-wrapper.e-pv-prop-dropdown.e-ddl input.e-input.e-control.e-keyboard,
-  .e-bigger .e-pv-toolbar.e-rtl .e-input-group.e-control-wrapper.e-pv-zoom-drop-down-rtl.e-ddl input.e-input.e-control.e-keyboard,
-  .e-bigger .e-pv-toolbar.e-rtl .e-input-group.e-control-wrapper.e-pv-prop-dropdown-rtl.e-ddl input.e-input.e-control.e-keyboard {
-    padding-left: $pv-zoom-drop-down-padding-left-rtl;
-    padding-right: $pv-zoom-drop-down-padding-right-rtl;
-  }
-
-  .e-bigger .e-pdfviewer .e-pv-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:first-child,
-  .e-bigger .e-pdfviewer .e-pv-annotation-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:first-child,
-  .e-bigger .e-pdfviewer .e-pv-formdesigner-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:first-child {
-    @if $skin-name == 'bootstrap4' {
-      margin-left: $pv-toolbar-items-first-child-margin-left-big;
-    }
-  }
-
-  .e-bigger .e-pdfviewer .e-pv-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-toolbar-item:first-child,
-  .e-bigger .e-pdfviewer .e-pv-annotation-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-toolbar-item:first-child,
-  .e-bigger .e-pdfviewer .e-pv-formdesigner-toolbar.e-toolbar.e-rtl .e-toolbar-items .e-toolbar-item:first-child  {
-    @if $skin-name == 'bootstrap4' {
-      margin-right: $pv-toolbar-items-first-child-margin-left-big;
-    }
-  }
-
-  .e-bigger .e-pdfviewer .e-pv-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:last-child,
-  .e-bigger .e-pdfviewer .e-pv-annotation-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:last-child,
-  .e-bigger .e-pdfviewer .e-pv-formdesigner-toolbar.e-toolbar:not(.e-rtl) .e-toolbar-items .e-toolbar-item:last-child {
-    @if $skin-name == 'bootstrap4' {
-      margin-right: $pv-toolbar-items-last-child-margin-right-big;
-    }
-  }
-
-  .e-bigger .e-pv-search-bar {
-    @if $skin-name == 'bootstrap4' {
-      top: $pv-search-box-top-big;
-    }
-  }
-
-  .e-pv-sidebar-content-container.e-left {
-    left: $pv-sidebar-content-container-left;
-  }
-
-  .e-pv-sidebar-content-container.e-right {
-    right: $pv-sidebar-content-container-left;
-  }
-
-  .e-bigger .e-pv-sidebar-content-container.e-left {
-    @if $skin-name == 'bootstrap4' {
-      left: $pv-sidebar-content-container-left-big;
-    }
-  }
-
-  .e-bigger .e-pv-sidebar-content-container.e-right {
-    @if $skin-name == 'bootstrap4' {
-      right: $pv-sidebar-content-container-left-big;
-    }
-  }
-
-  .e-pv-sidebar-toolbar-splitter.e-left {
-    left: $pv-sidebar-toolbar-splitter-left;
-  }
-
-  .e-pv-sidebar-toolbar-splitter.e-right {
-    right: $pv-sidebar-toolbar-splitter-left;
-  }
-
-  .e-bigger .e-pv-sidebar-toolbar-splitter.e-left {
-    @if $skin-name == 'bootstrap4' {
-      left: $pv-sidebar-toolbar-splitter-left-big;
-    }
-  }
-
-  .e-bigger .e-pv-sidebar-toolbar-splitter.e-right {
-    @if $skin-name == 'bootstrap4' {
-      right: $pv-sidebar-toolbar-splitter-left-big;
-    }
-  }
-
-  .e-pv-sidebar-resizer.e-left {
-    @if $skin-name == 'bootstrap4' {
-      border-right: 1px solid $pv-sidebar-resizer-border-color;
-    }
-    left: $pv-sidebar-resizer-left;
-  }
-
-  .e-pv-sidebar-resizer.e-right {
-    @if $skin-name == 'bootstrap4' {
-      border-left: 1px solid $pv-sidebar-resizer-border-color;
-    }
-    right: $pv-sidebar-resizer-left;
-  }
-
-  .e-pdfviewer .e-checkbox-wrapper .e-frame + .e-label,
-  .e-pdfviewer .e-css.e-checkbox-wrapper .e-frame + .e-label {
-    margin-right: $pv-textsearch-textbox-margin-right;
-  }
-
-  div > .e-pv-bookmark-icon.e-pv-icon.e-right {
-    float: $pv-bookmark-icon-float;
-    font-size: $pv-bookmark-icon-font-size;
-    padding-left: $pv-bookmark-icon-rtl-padding;
-    padding-right: $pv-bookmark-icon-rtl-padding;
-    position: $pv-bookmark-icon-rtl-position;
-    @if $skin-name == 'Material3' {
-      font-size: $text-base;
-      padding-left: 12px;
-      padding-right: 12px;
-    }
-  }
-
-  .e-bigger div > .e-pv-bookmark-icon.e-pv-icon.e-right {
-    @if $skin-name == 'bootstrap4' {
-      font-size: $pv-icon-font-size-big;
-    }
-    @if $skin-name == 'Material3' {
-      font-size: $text-base;
-      padding-left: 12px;
-      padding-right: 12px;
-    }
-  }
-
-  .e-bigger .e-pv-properties-window {
-    max-width: $pv-properties-win-max-width-big;
-    @if $skin-name == 'FluentUI' {
-      min-height: 498px;
-    }
-  }
-
-  .e-bigger .e-pv-scale-ratio-window {
-    max-width: $pv-scale-ratio-win-max-width-big;
-  }
-
-  .e-pdfviewer .e-treeview .e-list-item {
-    white-space: pre-wrap;
-    word-break: break-word;
-  }
-
-  .e-pdfviewer .e-treeview .e-list-text {
-    @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark') {
-      line-height: 20px;
-    }
-    width: 100%;
-  }
-
-  .e-pdfviewer .e-treeview.e-fullrow-wrap .e-icon-collapsible,
-  .e-pdfviewer .e-treeview.e-fullrow-wrap .e-icon-expandable,
-  .e-pdfviewer .e-treeview.e-fullrow-wrap .e-input,
-  .e-pdfviewer .e-treeview.e-fullrow-wrap .e-list-url {
-    margin-top: $pv-bookmark-expandable-icon-margin-top;
-    position: absolute;
-  }
-
-  .e-pdfviewer .e-treeview .e-list-item.e-hover:not(.e-active) > .e-fullrow {
-    @if $skin-name == 'bootstrap4' {
-      background-color: $pv-treeview-item-hover-bg-color;
-      border-color: $pv-treeview-item-hover-bg-color;
-    }
-  }
-
-  .e-pdfviewer .e-inplaceeditor .e-editable-value-wrapper.e-hide {
-    display: none;
-  }
-
-  .e-pdfviewer .e-editable-inline {
-    @if $skin-name == 'bootstrap5' {
-      padding: 7px 8px 50px;
-    }
-    @else {
-      padding: 7px 8px 42px;
-    }
-  }
-
-  .e-pv-comment-textbox {
-    min-height: 22px;
-  }
-
-  .e-pdfviewer .e-editable-value-wrapper {
-    color: $pv-comment-font-color;
-    line-height: normal;
-    min-height: 22px;
-    padding: 2px 8px 3px;
-    @if $skin-name == 'bootstrap5' {
-      color: $content-text-color-alt2;
-    }
-    font-size: 14px;
-    @if $skin-name == 'bootstrap5' {
-      font-size: 12px;
-    }
-    @if $skin-name == 'Material3' {
-      font-size: $text-xs;
-      line-height: 18px;
-    }
-  }
-
-  .e-pdfviewer .e-pv-comment-textbox .e-editable-value-wrapper {
-    color: $pv-comment-font-color;
-    @if $skin-name == 'bootstrap5' {
-      color: $content-text-color-alt2;
-    }
-    font-size: 14px;
-    @if $skin-name == 'bootstrap5' {
-      font-size: 12px;
-    }
-    @if $skin-name == 'Material3' {
-      font-size: $text-xs;
-    }
-    line-height: normal;
-    min-height: 24px;
-    padding: 2px 8px 3px 32px;
-  }
-
-  .e-pv-comment-textbox.e-inplaceeditor .e-component-group,
-  .e-pv-new-comments-div.e-inplaceeditor .e-component-group {
-    @if $skin-name == 'bootstrap5' {
-      margin-bottom: 0;
-    }
-  }
-
-  .e-pdfviewer .e-inplaceeditor .e-editable-action-buttons {
-    float: right;
-    padding-bottom: 7px;
-    @if $skin-name == 'bootstrap5' {
-      margin-top: 0;
-      padding-top: 10px;
-    }
-    @else {
-      padding-top: 5px;
-    }
-    position: relative;
-    @if $skin-name == 'bootstrap5' {
-      right: 0;
-    }
-    @else {
-      right: 8px;
-    }
-  }
-
-  .e-pdfviewer .e-pv-reply-div .e-inplaceeditor .e-editable-action-buttons {
-    float: right;
-    padding-bottom: 7px;
-    @if $skin-name == 'bootstrap5' {
-      margin-top: 0;
-      padding-top: 10px;
-    }
-    @else {
-      padding-top: 5px;
-    }
-    position: relative;
-    @if $skin-name == 'bootstrap5' {
-      right: 0;
-    }
-    @else {
-      right: 8px;
-    }
-  }
-
-  .e-pv-comment-title-container {
-    height: 36px;
-  }
-
-  .e-pv-reply-title-container {
-    height: 36px;
-  }
-
-  .e-pv-more-options-button.e-btn {
-    background: $pv-thumbnail-view-button-background;
-    border: $pv-thumbnail-view-button-border;
-    border-radius: $pv-thumbnail-border-radius;
-    box-shadow: $pv-thumbnail-view-button-box-shadow;
-    float: right;
-    padding: $pv-more-option-button-padding;
-  }
-
-  .e-pdfviewer .e-editable-inline .e-btn.e-outline.e-primary,
-  .e-pdfviewer .e-editable-inline .e-btn.e-outline {
-    @if ($skin-name != 'bootstrap5' and $skin-name != 'Material3') {
-      border-color: transparent;
-    }
-  }
-
-  .e-pdfviewer .e-editable-inline .e-editable-form {
-    margin-bottom: 1px;
-  }
-
-  .e-pdfviewer .e-editable-inline .e-clear-icon {
-    padding-right: 2px;
-  }
-
-  .e-pdfviewer .e-btn-cancel {
-    font-size: 14px;
-    padding-left: 5px;
-    padding-right: 5px;
-    @if $skin-name == 'Material3' {
-      font-size: $text-xs;
-    }
-  }
-
-  .e-pdfviewer .e-btn-save {
-    font-size: 14px;
-    margin-right: 12px;
-    padding-left: 7px;
-    padding-right: 7px;
-    @if $skin-name == 'Material3' {
-      font-size: $text-xs;
-    }
-  }
-
-  .e-pdfviewer .e-btn-save.e-outline.e-primary:disabled {
-    @if ($skin-name != 'bootstrap5' and $skin-name != 'Material3') {
-      background-color: $pv-save-button-bg-color;
-      border-radius: 2px;
-      color: $pv-save-button-color;
-    }
-  }
-
-  .e-pdfviewer .e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content {
-    box-shadow: 0 0 0 8px $pv-comment-panel-bg inset;
-    padding: 8px;
-  }
-
-  .e-pdfviewer .e-accordion .e-acrdn-item .e-acrdn-header {
-    line-height: 32px;
-    min-height: 32px;
-    @if $skin-name == 'Material3' {
-      box-shadow: none;
-      border: 1px solid rgba($border-light);
-      border-width: 1px 0;
-    }
-  }
-
-  .e-contextmenu-wrapper .e-pv-context-menu .e-menu-item {
-    height: 38px;
-  }
-
-  .e-pv-comment-panel {
-    @if $skin-name == 'Material3' {
-      background: $content-bg-color-alt2;
-    }
-    background-color: $pv-comment-panel-bg;
-    border: $pv-sidebar-toolbar-border;
-    border-width: 1px 1px 0;
-    opacity: 1;
-    overflow: hidden;
-    position: absolute;
-    top: 57px;
-    width: 300px;
-    z-index: $pv-sidebar-toolbar-z-index;
-  }
-
-  .e-pv-comment-panel-title-container {
-    @if $skin-name == 'Material3' {
-      background: $content-bg-color-alt2;
-      border-style: solid;
-      border-width: 0 0 1px 1px;
-    }
-    @else {
-      background-color: $pv-comment-panel-bg;
-      border-style: double;
-      border-width: 0 1px 1px 0;
-    }
-    height: 45px;
-    position: relative;
-    border-color: $pv-comment-panel-border-color;
-  }
-
-  .e-pv-comment-panel-title {
-    color: $pv-comment-font-color;
-    font-size: 14px;
-    @if $skin-name == 'Material3' {
-      background: $content-bg-color-alt2;
-      border: $border-light;
-      border-width: 0 0 1px 1px;
-      font-size: $text-base;
-      font-weight: $pv-comment-tile-font-weight;
-      line-height: 24px;
-      padding: 8px 215px 8px 12px;
-    }
-    @if $skin-name == 'bootstrap5' {
-      font-size: 16px;
-      font-weight: 500;
-    }
-    @if $skin-name == 'FluentUI' {
-      font-weight: $pv-comment-tile-font-weight;
-    }
-    @if $skin-name != 'Material3' {
-      left: 15px;
-      top: 14px;
-    }
-    position: absolute;
-    text-align: left;
-  }
-
-  .e-pv-mobile-comments-container .e-pv-comment-panel-title {
-    @if $skin-name == 'Material3' {
-      background: $content-bg-color-alt2;
-      border: $border-light;
-      border-width: 0 0 1px 1px;
-      font-size: $text-base;
-      font-weight: $pv-comment-tile-font-weight;
-      line-height: 16px;
-      padding: 0;
-      left: 15px;
-      top: 14px;
-      position: absolute;
-      text-align: left;
-    }
-  }
-
-  .e-pv-comment-panel-title-close-div.e-btn {
-    background: $pv-title-close-background;
-    border: $pv-title-close-border;
-    box-shadow: $pv-title-close-box-shadow;
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-title-close-color;
-    }
-    height: $pv-title-close-height;
-    position: $pv-title-close-position;
-    right: 11px;
-    top: 5px;
-    width: $pv-title-close-width;
-    @if $skin-name == 'FluentUI' {
-      padding: 4px;
-    }
-  }
-
-  @if $skin-name == 'Material3' {
-    .e-pv-comment-panel-title-container .e-pv-more-icon .e-pv-icon {
-      font-size: $text-base;
-    }
-  }
-
-  .e-pv-title-close-icon {
-    @if $skin-name != 'bootstrap5' {
-      color: $pv-comment-text-color;
-    }
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind' or $skin-name == 'FluentUI' or $skin-name == 'Material3') {
-      color: $icon-color;
-    }
-  }
-
-  .e-pv-comments-panel-text {
-    font-size: 15px;
-    padding-left: 85px;
-    color: rgba(var(--color-sf-on-surface-variant));
-  }
-
-  .e-pv-comments-content-container {
-    background-color: $pv-comments-content-container-bg;
-    border-color: $pv-comment-panel-border-color;
-    border-style: double;
-    border-width: 0 1px 1px 0;
-    height: calc(100% - 45px);
-    overflow: auto;
-    @if $skin-name == 'Material3' {
-      background: $content-bg-color-alt2;
-    }
-  }
-
-  .e-pv-comments-container {
-    background-color: $pv-comment-panel-bg;
-    border-radius: 2px;
-    left: 7px;
-    right: 7px;
-  }
-
-  .e-pv-comments-border {
-    @if $skin-name != 'bootstrap5' and $skin-name != 'FluentUI' {
-      border: 2px;
-      border-color: $pv-comment-panel-bottom-color;
-      border-radius: 4px;
-      border-style: groove;
-    }
-    @if $skin-name == 'tailwind' {
-      border: 1px solid $border-light;
-      border-radius: 2px;
-    }
-    @if $skin-name == 'bootstrap5' {
-      border: 1px solid $border-light;
-      border-radius: 2px;
-    }
-    @if $skin-name == 'Material3' {
-      border: 1px solid rgba($border-light);
-      border-radius: 4px;
-    }
-  }
-
-  .e-pv-comment-title {
-    color: $pv-comment-text-color;
-    padding-left: 32px;
-    padding-top: $pv-comment-title-padding-top;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind' or $skin-name == 'FluentUI') {
-      color: $pv-comment-tile-text-color;
-    }
-    font-size: 14px;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind') {
-      font-size: 12px;
-      font-weight: $pv-comment-tile-font-weight;
-    }
-    @if $skin-name == 'FluentUI' {
-      font-weight: $pv-comment-tile-font-weight;
-    }
-    @if $skin-name == 'Material3' {
-      font-size: $text-xs;
-      padding-left: 40px;
-      padding-top: $pv-comment-title-padding-top;
-      padding-bottom: 30px;
-      height: 18px;
-    }
-    max-width: 237px;
-    position: absolute;
-  }
-
-  .e-pv-reply-title {
-    color: $pv-comment-text-color;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind' or $skin-name == 'FluentUI') {
-      color: $pv-comment-tile-text-color;
-    }
-    font-size: 14px;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'tailwind') {
-      font-size: 12px;
-      font-weight: $pv-comment-tile-font-weight;
-    }
-    @if $skin-name == 'FluentUI' {
-      font-weight: $pv-comment-tile-font-weight;
-    }
-    @if $skin-name == 'Material3' {
-      font-size: $text-xs;
-    }
-    max-width: 212px;
-    padding-left: 8px;
-    padding-top: $pv-comment-title-padding-top;
-    position: absolute;
-  }
-
-  .e-pv-comments-hover {
-    background-color: $pv-comments-hover-bg;
-  }
-
-  .e-pv-comments-select {
-    @if $skin-name == 'FluentUI' {
-      background-color: $content-bg-color-selected;
-    }
-    @else {
-      background-color: $pv-comment-panel-bg;
-    }
-  }
-
-  .e-pv-comments-select .e-pv-comment-textbox .e-editable-value-wrapper {
-    color: $pv-comment-color;
-  }
-
-  .e-pv-comments-leave {
-    background-color: $pv-comment-panel-bg;
-  }
-
-  .e-pdfviewer .e-accordion {
-    @if $skin-name == 'Material3' {
-      background: $pv-comments-content-container-bg;
-      border-radius: 0;
-      border-width: 0;
-    }
-    @else {
-      background-color: $pv-comments-content-container-bg;
-      border: transparent;
-    }
-  }
-
-  .e-menu-wrapper.e-custom-scroll.e-lib.e-keyboard.e-pv-stamp {
-    border: 0;
-    @if $skin-name == 'bootstrap5' {
-      background-color: $transparent;
-    }
-    @if $skin-name != 'Material3' {
-      display: block;
-    }
-  }
-
-  .e-dropdown-popup.e-lib.e-popup.e-control.e-pv-handwritten-popup.e-popup-open ul {
-    @if ($skin-name == 'FluentUI' or $skin-name == 'Material3') {
-      padding-bottom: 6px;
-      padding-top: 6px;
-    }
-    @else {
-      padding-bottom: 6px;
-      padding-top: 17px;
-    }
-  }
-
-  .e-bigger .e-dropdown-popup.e-lib.e-popup.e-control.e-pv-handwritten-popup .e-btn.e-outline.e-primary {
-    @if $skin-name == 'FluentUI' {
-      min-height: 49px;
-      min-width: 152px;
-    }
-  }
-
-  .e-menu-icon.e-pv-stamp-icon.e-pv-icon {
-    margin-top: $pv-stamp-icon-margin-top;
-    padding-left: 7px;
-    @if $skin-name == 'fabric' {
-      margin-top: -7px;
-      padding-left: 10px;
-    }
-    @if $skin-name == 'bootstrap5' {
-      padding-left: 4px;
-    }
-  }
-
-  .e-pv-annotation-stamp-container .e-rtl.e-menu-wrapper ul .e-menu-item .e-menu-icon {
-    @if $skin-name == 'bootstrap5' {
-      margin-left: 1px;
-    }
-  }
-
-  .e-pdfviewer .e-inplaceeditor {
-    display: block;
-  }
-
-  .e-pdfviewer .e-inplaceeditor .e-editable-value-wrapper .e-editable-overlay-icon {
-    display: none;
-  }
-
-  .e-pdfviewer .e-inplaceeditor .e-editable-value-wrapper .e-editable-value {
-    border-bottom: 0;
-    word-break: break-word;
-  }
-
-  .e-pdfviewer .e-inplaceeditor .e-editable-value-container .e-editable-value {
-    @if $skin-name == 'Material3' {
-      font-size: $text-xs;
-    }
-  }
-
-  .e-pdfviewer .e-inplaceeditor .e-editable-value-wrapper {
-    display: block;
-  }
-
-  .e-pdfviewer .e-inplaceeditor .e-editable-value-wrapper:hover {
-    background: transparent;
-  }
-
-  .e-pdfviewer .e-inplaceeditor .e-editable-value-container {
-    background: transparent;
-    width: 229px;
-  }
-
-  .e-pv-status-div {
-    height: 20px;
-    left: 8px;
-    position: relative;
-    width: 20px;
-  }
-
-  .e-pv-status-container {
-    padding-bottom: 5px;
-    padding-top: 2px;
-  }
-
-  .e-pdfviewer .e-input-group.e-control-wrapper.e-editable-elements.e-input-focus {
-    @if $skin-name != 'bootstrap5' {
-      caret-color: $pv-comment-text-cursor-color;
-    }
-  }
-
-  .e-pv-reply-div {
-    margin-top: 3px;
-  }
-
-  .e-pdfviewer .e-pv-accordion-container.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state > .e-acrdn-header,
-  .e-pdfviewer .e-pv-accordion-container.e-accordion .e-acrdn-item.e-select.e-expand-state > .e-acrdn-header {
-    background: $pv-comment-panel-bg;
-    @if $skin-name != 'FluentUI' {
-      border: 1px solid $pv-comment-panel-border-color;
-    }
-    @if $skin-name == 'Material3' {
-      border-width: 1px 0;
-    }
-  }
-
-  .e-pdfviewer .e-accordion .e-acrdn-item.e-selected.e-select.e-expand-state > .e-acrdn-header:focus,
-  .e-pdfviewer .e-accordion .e-acrdn-item.e-selected > .e-acrdn-header {
-    background: $pv-comment-panel-bg;
-    box-shadow: none;
-  }
-
-  .e-pdfviewer .e-pv-accordion-container.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state > .e-acrdn-header .e-acrdn-header-icon,
-  .e-pdfviewer .e-pv-accordion-container.e-accordion .e-acrdn-item.e-select.e-selected.e-expand-state > .e-acrdn-header .e-acrdn-header-content,
-  .e-pdfviewer .e-pv-accordion-container.e-accordion .e-acrdn-item.e-select.e-expand-state > .e-acrdn-header .e-acrdn-header-icon,
-  .e-pdfviewer .e-pv-accordion-container.e-accordion .e-acrdn-item.e-select.e-expand-state > .e-acrdn-header .e-acrdn-header-content {
-    color: $pv-comment-text-color;
-    font-size: 14px;
-    @if $skin-name == 'FluentUI' {
-      font-weight: $pv-comment-tile-font-weight;
-    }
-    @if $skin-name == 'Material3' {
-      font-weight: $font-weight-normal;
-      letter-spacing: .24px;
-      line-height: 20px;
-      padding: 0 249px 9px 0;
-    }
-  }
-
-  .e-content-placeholder.e-pdfviewer.e-placeholder-pdfviewer {
-    background-size: 100%;
-  }
-
-  .e-pdfviewer .e-accordion .e-acrdn-item .e-acrdn-panel .e-acrdn-content {
-    line-height: normal;
-  }
-
-  .e-pdfviewer .e-pv-signature-apperance .e-checkbox-wrapper {
-    margin-top: 10px;
-    padding-bottom: $pv-signature-appearance-checkbox;
-    @if $skin-name == 'Material3' {
-      margin-top: 12px;
-    }
-  }
-
-  .e-pdfviewer .e-pv-signature-window .e-footer-content {
-    float: left;
-  }
-  .e-pv-signature-dialog-height .e-pv-clearbtn
-  {
-    float: left;
-    @if $skin-name != 'Material3' {
-      height: 30px;
-      min-height: 30px;
-    }
-  }
-  .e-pv-signature-dialog-height .e-pv-cancelbtn{
-    @if $skin-name != 'Material3' {
-      height: 32px;
-      min-height: 32px;
-    }
-  }
-
-  .e-pv-signature-dialog-height .e-pv-createbtn{
-    @if $skin-name != 'Material3' {
-      height: 30px;
-      min-height: 30px;
-    }
-  }
-  .e-bigger .e-pv-signature-dialog-height .e-pv-clearbtn{
-    @if $skin-name != 'Material3' {
-      float: left;
-      height: 49px;
-      min-height: 49px;
-    }
-  }
-  .e-bigger .e-pv-signature-dialog-height .e-pv-cancelbtn{
-    @if $skin-name != 'Material3' {
-      height: 49px;
-      min-height: 49px;
-    }
-  }
-  .e-bigger .e-pv-signature-dialog-height .e-pv-createbtn{
-    @if $skin-name != 'Material3' {
-      height: 49px;
-      min-height: 49px;
-    }
-  }
-  
-  .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-bold.e-pv-tbar-btn.e-tooltip.textprop-option-active,
-  .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-italic.e-pv-tbar-btn.e-tooltip.textprop-option-active,
-  .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-strikeout.e-pv-tbar-btn.e-tooltip.textprop-option-active,
-  .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-underlinetext.e-pv-tbar-btn.e-tooltip.textprop-option-active,
-  .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-left-align.e-pv-tbar-btn.e-tooltip.textprop-option-active,
-  .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-right-align.e-pv-tbar-btn.e-tooltip.textprop-option-active,
-  .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-center-align.e-pv-tbar-btn.e-tooltip.textprop-option-active,
-  .e-tbar-btn.e-control.e-btn.e-lib.e-icon-btn.e-pv-justfiy-align.e-pv-tbar-btn.e-tooltip.textprop-option-active {
-    @if $skin-name != 'bootstrap5' {
-      background: $pv-signature-footer-color;
-      border-color: $pv-signature-footer-color;
-    }
-    @else {
-      background: $secondary-bg-color-pressed;
-      border-color: $secondary-bg-color-pressed;
-      color: $secondary-text-color-pressed;
-    }
-  }
-
-  .e-pv-comment-panel-resizer {
-    background: $pv-sidebar-resizer-background;
-    border: $pv-sidebar-resizer-border;
-    border-width: $pv-sidebar-resizer-border-width;
-    color: $pv-sidebar-resizer-color;
-    cursor: $pv-sidebar-resizer-cursor;
-    height: $pv-sidebar-resizer-height;
-    position: $pv-sidebar-resizer-position;
-    width: $pv-sidebar-resizer-width;
-    z-index: $pv-sidebar-resizer-z-index;
-  }
-
-  .e-pv-comment-panel-resizer.e-left {
-    @if $skin-name == 'bootstrap4' {
-      border-right: 1px solid $pv-sidebar-resizer-border-color;
-    }
-    left: 300px;
-  }
-
-  .e-pv-comment-panel-resizer.e-right {
-    @if $skin-name == 'bootstrap4' {
-      border-left: 1px solid $pv-sidebar-resizer-border-color;
-    }
-    right: 300px;
-  }
-
-  .e-pv-align {
-    cursor: pointer;
-    float: right;
-    font-size: 20px;
-    margin-right: 16px;
-    margin-top: $pv-signature-delete-icon-margin-top;
-  }
-
-  .e-pv-align-border {
-    border: $pv-signature-border-color;
-    border-radius: 5px;
-    cursor: pointer;
-    display: inline-block;
-    width: 170px;
-  }
-
-  .e-pv-align-border-div {
-    @if $skin-name == 'highcontrast' {
-      background-color: $pv-high-contrast-signature-bg;
-      color: $pv-high-contrast-signature-text;
-    }
-  }
-
-  .e-pv-font-sign {
-    border: 1px solid $pv-sidebar-bookmark-title-color;
-    border-radius: 5px;
-    display: inline-block;
-    font-size: 13px;
-    height: 88px;
-    margin: 15px;
-    padding-top: 40px;
-    text-align: center;
-    width: 311px;
-    word-wrap: break-word;
-    @if $skin-name == 'FluentUI' {
-      max-width: 300px;
-      padding-top: 36px;
-    }
-    @if $skin-name == 'Material3' {
-      border: 1px dashed rgba($primary);
-      border-radius: 4px;
-      background: $content-bg-color;
-      font-size: $text-2xl;
-      color: $content-text-color;
-      font-weight: $font-weight-normal;
-    }
-  }
-
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item.e-focused {
-    @if $skin-name == 'bootstrap5' {
-      color: $white;
-      height: 32px;
-      line-height: 32px;
-    }
-    @else {
-      color: $pv-icon-color;
-    }
-  }
-
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item {
-    @if $skin-name == 'bootstrap5' {
-      height: 32px;
-      line-height: 32px;
-      padding-left: 8px;
-    }
-  }
-
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-menu-icon {
-    @if $skin-name == 'bootstrap5' {
-      font-size: 16px;
-    }
-  }
-
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item .e-caret {
-    @if $skin-name == 'bootstrap5' {
-      font-size: 14px;
-    }
-  }
-
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item,
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item .e-menu-icon,
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item .e-caret {
-    @if ($skin-name == 'tailwind' or $skin-name == 'bootstrap' or $skin-name == 'bootstrap4' or $skin-name == 'bootstrap5') {
-      border-radius: 4px;
-    }
-    @if $skin-name == 'bootstrap5' {
-      color: $pv-icon-color;
-      height: 32px;
-      line-height: 32px;
-    }
-    @else {
-      color: $pv-icon-color;
-    }
-  }
-
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item.e-focused:hover,
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item.e-selected {
-    @if $skin-name == 'bootstrap5' {
-      background: $secondary-bg-color-pressed;
-    }
-    @if $skin-name == 'bootstrap4' {
-      background: $pv-annotation-dropdown-background-color-hover;
-    }
-  }
-
-  .e-pv-custom-annotation-stamp-container.e-menu-wrapper ul,
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul {
-    @if $skin-name == 'bootstrap4' {
-      background-color: $pv-annotation-dropdown-background-color;
-    }
-  }
-
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item.e-focused:hover .e-menu-icon,
-  .e-pv-custom-annotation-stamp-container.e-menu-container ul .e-menu-item.e-focused:hover .e-caret {
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-icon-color-hover;
-    }
-    @if $skin-name == 'bootstrap5' {
-      color: $white;
-    }
-  }
-
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item.e-focused:hover .e-menu-icon,
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item.e-focused:hover .e-caret,
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item.e-selected .e-menu-icon,
-  .e-pv-stamp-template-container .e-menu-container .e-menu .e-menu-item.e-selected .e-caret {
-    @if $skin-name == 'bootstrap4' {
-      color: $pv-icon-color-hover;
-    }
-    @if $skin-name == 'bootstrap5' {
-      color: $white;
-    }
-  }
-
-  .e-pv-stamp-template-container .e-menu-container .e-menu {
-    background-color: $pv-annotation-dropdown-background-color;
-    border-color: $pv-annotation-dropdown-border-color;
-  }
-
-  .e-pv-custom-annotation-stamp-container.e-menu-container .e-ul .e-menu-item.e-selected,
-  .e-pv-custom-annotation-stamp-container.e-menu-container.e-menu-container .e-ul .e-menu-item.e-focused {
-    @if $skin-name == 'bootstrap4' {
-      background-color: $pv-comment-text-cursor-color;
-      color: $pv-icon-color-hover;
-      outline: 0 solid $pv-comment-text-cursor-color;
-      outline-offset: 0;
-    }
-  }
-
-  .e-pv-custom-annotation-thickness-container,
-  .e-pv-custom-annotation-opacity-container {
-    @if $skin-name == 'Material3'{
-      background: $pv-annotation-dropdown-background-color;
-      border: $pv-annotation-dropdown-border-color;
-    }
-    @else {
-      background-color: $pv-annotation-dropdown-background-color;
-      border-color: $pv-annotation-dropdown-border-color;
-    }
-  }
-
-  .e-pdfviewer-signatureformfields.e-pv-signature-focus,
-  .e-pdfviewer-signatureformfields-signature.e-pv-signature-focus {
-    outline: $pv-print-popup-container-background-color dotted 2px;
-  }
-
-  .e-pv-checkbox-container {
-    -moz-user-select: none;
-    -ms-user-select: none;
-    -webkit-user-select: none;
-    cursor: pointer;
-    display: block;
-    margin-bottom: 0;
-    position: relative;
-    user-select: none;
-  }
-
-  .e-pv-text-selection-none {
-    -moz-user-select: none;
-    -ms-user-select: none;
-    -webkit-user-select: none;
-    user-select: none;
-  }
-
-  .e-pv-checkbox-container input {
-    cursor: pointer;
-    height: 0;
-    opacity: 0;
-    position: absolute;
-    width: 0;
-  }
-
-  .e-pv-checkbox-div {
-    border: $pv-form-field-checkbox-container;
-    display: inline;
-    height: 100%;
-    left: 0;
-    position: absolute;
-    text-align: center;
-    top: 0;
-    width: 100%;
-  }
-
-  .e-pv-cb-checked {
-    border: $pv-form-field-checkbox-checked;
-    border-left-color: transparent;
-    border-top-color: transparent;
-    border-width: $pv-form-field-checkbox-border-width;
-    position: absolute;
-    transform: rotate(45deg);
-  }
-
-  .e-pv-cb-unchecked {
-    border: 1px;
-    border-width: 1px;
-  }
-
-  .e-pv-radiobtn-container {
-    -moz-user-select: none;
-    -ms-user-select: none;
-    -webkit-user-select: none;
-    cursor: pointer;
-    display: block;
-    margin-bottom: 0;
-    position: relative;
-    user-select: none;
-  }
-
-  .e-pv-radiobtn-container input {
-    cursor: pointer;
-    opacity: 0;
-    position: absolute;
-  }
-
-  .e-pv-radiobtn-div {
-    border: 1px solid $pv-form-checkbox-border-color;
-    border-radius: 50%;
-    height: 100%;
-    left: $pv-form-field-size;
-    position: absolute;
-    top: $pv-form-field-size;
-    width: 100%;
-  }
-
-  .e-pv-radio-btn {
-    border: 0;
-    clip: rect(0 0 0 0);
-    height: 1px;
-    margin: -1px;
-    overflow: hidden;
-    padding: 0;
-    position: absolute;
-    width: 1px;
-  }
-
-  .e-pv-radio-btn + span {
-    display: block;
-  }
-
-  .e-pv-radio-btn + .e-pv-radiobtn-span::before {
-    content: '';
-    display: block;
-    height: inherit;
-    width: inherit;
-  }
-
-  .e-pv-radio-btn:checked + .e-pv-radiobtn-span::before {
-    background: $pv-form-checkbox-border-color;
-    border-radius: 50%;
-  }
-
-  .e-pv-properties-text-edit-prop,
-  .e-pv-properties-visibility-style-prop,
-  .e-pv-properties-font-items-container {
-    display: flex;
-    justify-content: space-evenly;
-  }
-
-  .e-pv-properties-form-field-name-main-div,
-  .e-pv-properties-form-field-value-main-div {
-    @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark' or $skin-name == 'FluentUI') {
-      padding-right: 12px;
-    }
-    @else {
-      padding-right: 15px;
-    }
-  }
-
-  .e-pv-properties-form-field-name-main-div,
-  .e-pv-properties-form-field-tooltip-main-div,
-  .e-pv-properties-form-field-value-main-div,
-  .e-pv-properties-form-field-visibility-main-div {
-    @if $skin-name == 'FluentUI' {
-      width: 232px;
-    }
-    @else {
-      width: 285px;
-    }
-  }
-
-  .e-pv-properties-text-edit-prop {
-    @if $skin-name == 'FluentUI' {
-      padding-top: 35px;
-    }
-    @else {
-      padding-top: 20px;
-    }
-  }
-
-  .e-pv-properties-visibility-style-prop {
-    @if $skin-name == 'FluentUI' {
-      padding-bottom: 12px;
-      padding-top: 12px;
-    }
-    @if $skin-name == 'Material3' {
-      padding-top: 16px;
-    }
-    @else {
-      padding-bottom: 10px;
-      padding-top: 20px;
-    }
-  }
-
-  .e-pv-properties-checkbox-main-div-prop {
-    display: flex;
-    flex-direction: row;
-    justify-content: space-between;
-    padding-top: 20px;
-  }
-
-  .e-pv-bold-icon-div,
-  .e-pv-italic-icon-div,
-  .e-pv-strikeout-icon-div,
-  .e-pv-underlinetext-icon-div,
-  .e-pv-left-align-icon-div,
-  .e-pv-center-align-icon-div,
-  .e-pv-right-align-icon-div {
-    padding: $pv-formfield-properties-icon-align-padding;
-  }
-
-  .e-pv-bold-icon-div:hover,
-  .e-pv-italic-icon-div:hover,
-  .e-pv-strikeout-icon-div:hover,
-  .e-pv-underlinetext-icon-div:hover,
-  .e-pv-left-align-icon-div:hover,
-  .e-pv-center-align-icon-div:hover,
-  .e-pv-right-align-icon-div:hover {
-    @if ($skin-name != 'Material3' and $skin-name != 'bootstrap5') {
-      background-color: $pv-annotation-dropdown-background-color-hover;
-      border-color: $pv-annotation-dropdown-border-color-hover;
-    }
-    @if ($skin-name == 'bootstrap5') {
-      background-color: $secondary-bg-color-pressed;
-      border-color: $secondary-bg-color-pressed;
-      color: $white;
-    }
-    @if ($skin-name == 'Material3') {
-      background: $pv-annotation-dropdown-background-color-hover;
-      border: $pv-annotation-dropdown-border-color-hover;
-    }
-  }
-
-  .e-pv-bold-icon-div:active,
-  .e-pv-italic-icon-div:active,
-  .e-pv-strikeout-icon-div:active,
-  .e-pv-underlinetext-icon-div:active,
-  .e-pv-left-align-icon-div:active,
-  .e-pv-center-align-icon-div:active,
-  .e-pv-right-align-icon-div:active {
-    @if ($skin-name != 'Material3' and $skin-name != 'bootstrap5') {
-      background-color: $pv-signature-footer-color;
-      border-color: $pv-signature-footer-color;
-    }
-    @if ($skin-name == 'bootstrap5') {
-      background-color: $secondary-bg-color-pressed;
-      border-color: $secondary-bg-color-pressed;
-      color: $white;
-    }
-    @if ($skin-name == 'Material3') {
-      background: $pv-signature-footer-color;
-      border: $pv-signature-footer-color;
-    }
-  }
-
-  .e-pv-properties-fill-color-style-prop,
-  .e-pv-properties-stroke-color-style-prop,
-  .e-pv-properties-stroke-thickness-style-prop {
-    @if $skin-name == 'Material3' {
-      padding: 0 20px 12px 1px;
-    }
-    @else {
-      padding: 12px 20px 12px 1px;
-    }
-  }
-
-  .e-bigger .e-pv-properties-fill-color-style-prop,
-  .e-bigger .e-pv-properties-stroke-color-style-prop,
-  .e-bigger .e-pv-properties-stroke-thickness-style-prop {
-    @if $skin-name == 'Material3' {
-      padding: 0 20px 12px 1px;
-    }
-    @else{
-      padding: 12px 20px 12px 1px;
-    }
-  }
-
-  .e-pv-formfield-fontcolor-icon,
-  .e-pv-formfield-strokecolor-icon,
-  .e-pv-formfield-strokethickness-icon {
-    @if ($skin-name == 'bootstrap4') {
-      color: $pv-form-field-property-header-color;
-    }
-    @if ($skin-name == 'bootstrap5') {
-      color: inherit;
-    }
-    @if ($skin-name == 'material') {
-      color: $pv-prop-line-styles-color;
-    }
-    background: $pv-form-field-property-font-style-color;
-    @if ($skin-name == 'bootstrap5') {
-      border: 1px solid $border-light;
-    }
-    @if ($skin-name == 'bootstrap5') {
-      border-radius: 4px;
-    }
-    @else {
-      border-radius: 2px;
-    }
-    height: $pv-formfield-properties-icon-height;
-    margin-top: 8px;
-    @if $skin-name != 'FluentUI' {
-      width: 54px;
-    }
-    @if ($skin-name == 'bootstrap5') {
-      align-content: center;
-      align-items: center;
-      box-shadow: none;
-      display: flex;
-      flex-direction: row;
-      flex-wrap: wrap;
-      padding: 0 11px;
-      width: inherit;
-    }
-    @if ($skin-name == 'Material3') {
-      align-content: center;
-      align-items: center;
-      box-shadow: none;
-      display: flex;
-      flex-direction: row;
-      flex-wrap: wrap;
-      width: 72px;
-      height: 32px;
-      border-bottom: 1px solid rgba($border);
-      box-sizing: border-box;
-      padding-right: 16px;
-      margin-top: 0;
-    }
-  }
-
-  .e-pv-properties-format-text-style-prop {
-    @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark') {
-      padding: 15px 15px 4px 1px;
-    }
-    @if ($skin-name == 'Material3') {
-      padding: 20px 15px 6px 0;
-    }
-    @else {
-      padding: 15px 15px 15px 1px;
-    }
-  }
-
-  .e-pv-properties-font-family-container {
-    margin-right: 15px;
-    @if $skin-name == 'FluentUI' {
-      width: 122px;
-    }
-    @if $skin-name == 'Material3' {
-      width: 214px;
-      height: 32px;
-      margin-right: 12px;
-    }
-    @else {
-      width: 165px;
-    }
-  }
-
-  .e-pv-properties-font-size-container {
-    @if $skin-name == 'Material3' {
-      border-right-color: $transparent;
-      height: 32px;
-      border-bottom: 1px solid $transparent;
-      box-sizing: border-box;
-    }
-    @else {
-      border-right-color: $pv-comment-panel-bottom-color;
-      border-right-style: solid;
-      border-right-width: 1px;
-      margin-right: 15px;
-      padding-right: 15px;
-    }
-    width: $pv-font-size-field-width;
-  }
-
-  .e-pv-formfield-maxlength {
-    padding-left: 20px;
-  }
-
-  .e-pv-left-align-icon-div,
-  .e-pv-center-align-icon-div,
-  .e-pv-right-align-icon-div {
-    @if ($skin-name != 'bootstrap5') {
-      padding-left: 6px;
-    }
-  }
-
-  .e-pv-properties-font-color-container,
-  .e-pv-properties-color-container-style-prop {
-    display: flex;
-    padding-top: 20px;
-  }
-
-  .e-pv-formfield-textcolor {
-    margin-right: 10px;
-  }
-
-  .e-pv-formfield-maxlength-icon {
-    align-items: center;
-    display: flex;
-    padding-right: 14px;
-    @if ($skin-name == 'bootstrap5') {
-      padding-right: 10px;
-    }
-    @if ($skin-name == 'FluentUI') {
-      padding-right: 8px;
-    }
-  }
-
-  .e-pv-formfield-textcolor-icon.e-btn.e-icon-btn,
-  .e-pv-formfield-strokecolor-icon.e-btn.e-icon-btn,
-  .e-pv-formfield-fontcolor-icon.e-btn.e-icon-btn,
-  .e-pv-formfield-strokethickness-icon.e-btn.e-icon-btn {
-    @if ($skin-name == 'bootstrap5') {
-      padding: 0 11px;
-    }
-  }
-
-  .e-pv-formfield-textcolor-icon {
-    background: $pv-form-field-property-font-style-color;
-    @if ($skin-name == 'bootstrap5') {
-      border: 1px solid $border-light;
-    }
-    @if ($skin-name == 'bootstrap5') {
-      border-radius: 4px;
-    }
-    @else {
-      border-radius: 2px;
-    }
-    width: $pv-form-field-property-font-style-width;
-    @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark') {
-      height: 36px;
-    }
-    @if ($skin-name == 'bootstrap4') {
-      color: $pv-form-field-property-header-color;
-    }
-    @if ($skin-name == 'material') {
-      color: $pv-prop-line-styles-color;
-    }
-    @if ($skin-name == 'bootstrap5') {
-      align-items: baseline;
-      box-shadow: none;
-      color: inherit;
-      display: flex;
-      height: 32px;
-    }
-    @if ($skin-name == 'Material3') {
-      display: flex;
-      width: 76px;
-      border-bottom: 1px solid rgba($border);
-      box-shadow: none;
-    }
-    @if ($skin-name == 'FluentUI') {
-      height: auto;
-    }
-  }
-
-  .e-pv-properties-formfield-maxlength-text-label,
-  .e-pv-formfield-maxlength {
-    padding-left: 1px;
-    width: $pv-formfield-maxlength-width;
-    @if ($skin-name == 'Material3') {
-      height: 32px;
-    }
-  }
-
-  .e-pv-formfield-maxlength-group {
-    display: flex;
-    padding-left: $pv-formfield-maxlength-group-padding-left;
-  }
-
-  .e-pv-properties-form-field-list-add-div {
-    display: flex;
-    @if $skin-name == 'FluentUI' {
-      padding-bottom: 12px;
-      padding-top: 16px;
-    }
-    @else {
-      padding-bottom: 15px;
-      padding-top: 20px;
-    }
-  }
-
-  .e-pv-properties-list-item-edit-prop {
-    margin-right: 15px;
-    width: 295px;
-    @if $skin-name == 'FluentUI' {
-      margin-right: 12px;
-      width: 318px;
-    }
-  }
-
-  .e-pv-properties-form-field-window {
-    max-width: $pv-properties-form-field-win-max-width;
-  }
-
-  .e-bigger .e-pv-properties-form-field-window {
-    @if $skin-name == 'Material3' {
-      max-width: 490px;
-    }
-  }
-
-  .e-pv-properties-formfield-textarea {
-    @if $skin-name == 'FluentUI' {
-      min-width: 318px;
-    }
-  }
-
-  .e-pv-properties-export-value-edit-prop {
-    width: 295px;
-    @if $skin-name == 'FluentUI' {
-      width: 318px;
-    }
-  }
-
-  .e-pv-properties-form-field-list-btn-div {
-    align-items: center;
-    display: flex;
-    height: 36px;
-    margin-top: 10px;
-    text-align: center;
-    @if $skin-name == 'FluentUI' {
-      height: 32px;
-      margin-top: 25px;
-    }
-  }
-
-  .e-pv-properties-form-field-export-value-main-div {
-    @if $skin-name == 'FluentUI' {
-      padding-bottom: 12px;
-      padding-top: 0;
-    }
-    @else {
-      padding-bottom: 15px;
-      padding-top: 10px;
-    }
-    width: 335px;
-  }
-
-  .e-pv-properties-form-field-group-btn-div {
-    display: grid;
-  }
-
-  .e-pv-properties-form-field-option-dropdown-list-div {
-    @if $skin-name == 'FluentUI' {
-      padding-top: 0;
-    }
-    @else {
-      padding-top: 10px;
-    }
-  }
-
-  .e-pv-properties-form-field-btn-textarea-container {
-    display: flex;
-    width: 385px;
-    @if $skin-name == 'FluentUI' {
-      padding-top: 0;
-    }
-    @else {
-      padding-top: 15px;
-    }
-  }
-
-  .e-pv-properties-dropdown-btn {
-    align-items: center;
-    display: flex;
-    height: 36px;
-    text-align: center;
-    width: 75px;
-  }
-
-  .e-pv-show-designer-name {
-    align-items: center;
-    color: $pv-show-designer-name-color;
-    display: grid;
-    height: 100%;
-    overflow: hidden;
-    text-align: center;
-    text-overflow: ellipsis;
-    white-space: nowrap;
-    width: 100%;
-  }
-
-  .e-pv-formfield-li-element {
-    list-style: none;
-    padding-left: 10px;
-  }
-
-  .e-pv-li-select {
-    background-color: $pv-form-field-li-background-color;
-    @if ($skin-name == 'bootstrap5') {
-      background-color: $pv-item-selection-background-color;
-      color: $white;
-    }
-    @if ($skin-name == 'tailwind') {
-      background-color: $pv-item-selection-background-color;
-    }
-  }
-
-  .e-pv-formfield-li-element.e-pv-li-select {
-    background-color: $pv-form-field-li-background-color;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'FluentUI') {
-      color: $white;
-    }
-  }
-
-  .e-pv-formfield-li-element:hover:not(.e-pv-li-select) {
-    @if ($skin-name != 'Material3') {
-      background-color: $pv-form-field-li-background-color;
-    }
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'FluentUI') {
-      color: $white;
-    }
-    @if ($skin-name == 'Material3') {
-      background-color: $content-bg-color-hover;
-    }
-  }
-
-  .e-pv-formfield-li-element:focus {
-    @if ($skin-name == 'Material3') {
-      background-color: $content-bg-color-focus;
-    }
-  }
-
-  .e-pv-formfield-li-element:disabled {
-    @if ($skin-name == 'Material3') {
-      background-color: $transparent;
-      font-size: $text-sm;
-      color: rgba(28, 31, 30, .38);
-    }
-  }
-
-  .e-pv-form-designer-ul-list-items {
-    padding-left: 1px;
-  }
-
-  .e-pv-form-field-property-header.e-dialog .e-dlg-header .e-dlg-header-content {
-    font-size: $pv-form-field-property-header-font-size;
-    font-weight: $pv-form-field-property-header-font-weight;
-  }
-
-  .e-pv-form-field-property-header {
-    -ms-user-select: none;
-    -webkit-user-select: none;
-    color: $pv-form-field-property-header-color;
-    display: block;
-    @if $skin-name == 'FluentUI' {
-      font-family: 'Segoe UI';
-      height: 24px;
-    }
-    @else {
-      font-family: 'Roboto';
-    }
-    @if $skin-name == 'bootstrap5' {
-      font-family: inherit;
-    }
-    font-size: $pv-form-field-property-header-font-size;
-    font-style: normal;
-    font-weight: $pv-form-field-property-header-font-weight;
-    line-height: $pv-form-field-property-header-line-height;
-    margin-top: $pv-form-field-property-header-margin-top;
-    mix-blend-mode: normal;
-    opacity: $pv-form-field-property-header-opacity;
-    overflow: hidden;
-    text-overflow: ellipsis;
-    user-select: none;
-    vertical-align: top;
-    white-space: nowrap;
-    width: $pv-form-field-property-header-width;
-    @if $skin-name == 'Material3' {
-      height: 20px;
-      font-family: $font-family;
-    }
-  }
-
-  .e-pv-form-field-property-header-general {
-    @if $skin-name == 'FluentUI' {
-      font-family: 'Segoe UI';
-      height: 24px;
-    }
-    @if $skin-name == 'Material3' {
-      font-family: $font-family;
-    }
-    @else {
-      font-family: 'Roboto';
-    }
-    @if $skin-name == 'bootstrap5' {
-      font-family: inherit;
-    }
-    font-size: $pv-form-field-property-general-header-font-size;
-    font-style: normal;
-    @if $skin-name != 'FluentUI' {
-      font-weight: $pv-form-field-property-header-font-weight;
-    }
-    line-height: $pv-form-field-property-general-header-line-height;
-  }
-
-  .e-pv-properties-tab-style-prop.e-lib.e-tab.e-control {
-    @if ($skin-name == 'highcontrast' or $skin-name == 'highcontrast-dark') {
-      border: 0;
-    }
-  }
-
-  .e-pv-properties-formfield-formatting {
-    color: $pv-form-field-property-label-color;
-    font-family: 'Roboto';
-    font-size: $pv-form-field-property-general-header-font-size;
-    font-style: normal;
-    font-weight: normal;
-    height: $pv-form-field-property-general-header-line-height;
-    line-height: $pv-form-field-property-general-header-line-height;
-    width: 64px;
-  }
-
-  .e-pv-properties-form-field-font-style {
-    background: $pv-form-field-property-font-style-color;
-    @if ($skin-name == 'bootstrap5') {
-      border-radius: 4px;
-    }
-    @else {
-      border-radius: 2px;
-    }
-    display: flex;
-    height: 36px;
-    justify-content: space-evenly;
-    width: 154px;
-    @if ($skin-name == 'bootstrap5') {
-      align-items: center;
-      border: 1px solid $border-light;
-      height: 32px;
-      width: 163px;
-    }
-    @if ($skin-name == 'FluentUI') {
-      align-items: center;
-      border: 1px solid $border;
-      height: 32px;
-      width: 163px;
-    }
-    @if ($skin-name == 'Material3') {
-      align-items: center;
-      border-bottom: 1px solid $transparent;
-      height: 32px;
-      width: 128px;
-      padding-left: 8px;
-      padding-top: 10px;
-    }
-  }
-
-  .e-pv-properties-form-field-font-align {
-    background: $pv-form-field-property-font-style-color;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'Material3') {
-      border-radius: 4px;
-    }
-    @else {
-      border-radius: 2px;
-    }
-    display: flex;
-    height: 36px;
-    justify-content: space-evenly;
-    margin-right: 15px;
-    width: 120px;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'FluentUI') {
-      align-items: center;
-      border: 1px solid $border-light;
-      height: 32px;
-    }
-    @if ($skin-name == 'FluentUI') {
-      border: 1px solid $border;
-    }
-    @if ($skin-name == 'Material3') {
-      align-items: center;
-      height: 32px;
-      width: 96px;
-      padding-top: 8px;
-      border: 1px solid $transparent;
-    }
-  }
-
-  .e-bigger .e-pv-properties-form-field-font-style {
-    background: $pv-form-field-property-font-style-color;
-    @if ($skin-name == 'bootstrap5') {
-      border-radius: 4px;
-    }
-    @else {
-      border-radius: 2px;
-    }
-    display: flex;
-    height: 36px;
-    justify-content: space-evenly;
-    width: 154px;
-    @if ($skin-name == 'bootstrap5') {
-      align-items: center;
-      border: 1px solid $border-light;
-      height: 32px;
-      width: 163px;
-    }
-    @if ($skin-name == 'FluentUI') {
-      align-items: center;
-      border: 1px solid $border;
-      height: 32px;
-      width: 163px;
-    }
-    @if ($skin-name == 'Material3') {
-      align-items: center;
-      border-bottom: 1px solid $transparent;
-      height: 32px;
-      width: 128px;
-      padding-left: 8px;
-      padding-top: 20px;
-    }
-  }
-
-  .e-bigger .e-pv-properties-form-field-font-align {
-    background: $pv-form-field-property-font-style-color;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'Material3') {
-      border-radius: 4px;
-    }
-    @else {
-      border-radius: 2px;
-    }
-    display: flex;
-    height: 36px;
-    justify-content: space-evenly;
-    margin-right: 15px;
-    width: 120px;
-    @if ($skin-name == 'bootstrap5' or $skin-name == 'FluentUI') {
-      align-items: center;
-      border: 1px solid $border-light;
-      height: 32px;
-    }
-    @if ($skin-name == 'FluentUI') {
-      border: 1px solid $border;
-    }
-    @if ($skin-name == 'Material3') {
-      align-items: center;
-      height: 32px;
-      width: 96px;
-      border: 1px solid $transparent;
-      padding-top: 20px;
-    }
-  }
-
-  .e-pv-properties-formfield-label {
-    color: $pv-form-field-property-label-color;
-    font-family: 'Roboto';
-    @if ($skin-name == 'bootstrap5') {
-      font-family: inherit;
-    }
-    font-size: $pv-form-field-property-general-header-font-size;
-    font-style: normal;
-    font-weight: normal;
-    @if ($skin-name == 'bootstrap5') {
-      font-weight: 500;
-    }
-    @if ($skin-name == 'FluentUI') {
-      font-family: 'Segoe UI';
-      font-weight: 600;
-      margin-bottom: 4px;
-    }
-    height: $pv-form-field-property-general-header-line-height;
-    line-height: $pv-form-field-property-general-header-line-height;
-    @if ($skin-name == 'Material3') {
-      font-size: $text-xxs;
-      font-weight: $font-weight-normal;
-      line-height: 12px;
-      height: 12px;
-      font-family: $font-family;
-    }
-  }
-
-  .e-pv-formfield-maxlength .e-input-group.e-control-wrapper .e-input-group-icon {
-    min-width: $pv-formfield-maxlength-arrow-width;
-  }
-
-  .e-pv-properties-form-field-window {
-    height: $pv-formfield-designer-dialog-height;
-  }
-
-  .e-bigger .e-pv-properties-form-field-window {
-    @if $skin-name == 'Material3' {
-      height: 565px;
-    }
-    @if ($skin-name == 'FluentUI') {
-      height: 585px;
-    }
-  }
-
-  .e-pv-properties-header-spliter {
-    border-bottom-color: $pv-properties-header-spliter-border-bottom-color;
-    border-bottom-style: $pv-properties-header-spliter-border-bottom-style;
-    border-bottom-width: $pv-properties-header-spliter-border-bottom-width;
-    left: $pv-properties-header-spliter-left;
-    padding-top: $pv-properties-header-spliter-padding-top;
-    position: $pv-properties-header-spliter-position;
-    width: $pv-properties-header-spliter-width;
-  }
-
-  .e-bigger .e-pv-properties-header-spliter {
-    @if $skin-name == 'Material3'{
-      border-bottom-color: $pv-properties-header-spliter-border-bottom-color;
-      border-bottom-style: $pv-properties-header-spliter-border-bottom-style;
-      border-bottom-width: $pv-properties-header-spliter-border-bottom-width;
-      left: $pv-properties-header-spliter-left;
-      padding-top: 48px;
-      position: $pv-properties-header-spliter-position;
-      width: $pv-properties-header-spliter-width;
-    }
-  }
-
-  .e-pv-properties-bottom-spliter {
-    border-bottom-color: $pv-properties-header-spliter-border-bottom-color;
-    border-bottom-style: $pv-properties-header-spliter-border-bottom-style;
-    border-bottom-width: $pv-properties-header-spliter-border-bottom-width;
-    left: $pv-properties-header-spliter-left;
-    margin-bottom: $pv-properties-header-spliter-margin-bottom;
-    padding-top: $pv-properties-header-spliter-margin-bottom;
-    width: $pv-properties-header-spliter-width;
-    @if ($skin-name == 'Material3'){
-      margin-bottom: 0;
-      padding-top: 0;
-      border-width: 0;
-    }
-  }
-
-  .e-pv-formfield-textcolor-icon .e-btn-icon.e-icons,
-  .e-pv-formfield-fontcolor-icon .e-btn-icon.e-icons,
-  .e-pv-formfield-strokecolor-icon .e-btn-icon.e-icons,
-  .e-pv-formfield-strokethickness-icon .e-btn-icon.e-icons {
-    @if ($skin-name == 'tailwind' or $skin-name == 'tailwind-dark') {
-      width: 1em;
-    }
-  }
-
-  .e-pv-annotation-toolbar.e-toolbar .e-toolbar-pop .e-toolbar-item:not(.e-separator) {
-    background-color: $pv-comment-panel-bg;
-    padding: 0 $pv-icon-padding-top;
-  }
-
-  .e-pv-annotation-toolbar.e-toolbar .e-toolbar-pop .e-toolbar-item .e-tbar-btn.e-btn {
-    padding: 0 $pv-icon-padding-top;
-  }
-
-  .e-pv-signature-window .e-dlg-content {
-    @if ($skin-name == 'highcontrast') {
-      padding: 16px;
-    }
-  }
-
-  .e-pv-signatureimage {
-    @if ($skin-name == 'highcontrast') {
-      background-color: $pv-signature-image-panel-bg;
-    }
-  }
-
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn:hover,
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn:hover .e-caret,
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn:hover:focus,
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn:hover:focus .e-caret {
-    @if ($skin-name == 'bootstrap4') {
-      color: $pv-prop-win-drop-down-color-hover;
-    }
-  }
-
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn:focus,
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn:focus .e-caret,
-  .e-pv-annotation-toolbar .e-dropdown-btn.e-btn:not(:hover) {
-    @if ($skin-name == 'bootstrap4') {
-      color: $pv-stamp-icon-color;
-    }
-  }
-
-  .e-dialog.e-pv-signature-dialog-height {
-    height: $pv-signature-dialog-height;
-    @if ($skin-name == 'FluentUI' or $skin-name == 'Material3') {
-      min-height: $pv-signature-dialog-height;
-    }
-  }
-
-  .e-bigger .e-dialog.e-pv-signature-dialog-height {
-    @if ($skin-name == 'FluentUI' or $skin-name == 'Material3') {
-      height: 627px;
-      min-height: 591px;
-    }
-  }
-  
-  .e-bigger .e-pv-signature-dialog-height {
-    @if ($skin-name == 'FluentUI') {
-      min-height: 592px;
-    }
-  }
-
-  .e-dialog.e-pv-signature-dialog-blazor-height {
-    height: $pv-signature-dialog-blazor-height;
-    @if ($skin-name == 'FluentUI') {
-      min-height: $pv-signature-dialog-height;
-    }
-    @if ($skin-name == 'Material3') {
-      min-height: $pv-signature-dialog-blazor-height;
-    }
-  }
-
-  .e-bigger .e-dialog.e-pv-signature-dialog-blazor-height  {
-    @if ($skin-name == 'Material3') {
-      min-height: 590px;
-    }
-  }
-
-  .e-pv-handwritten-signature-canvas {
-    height: $pv-handwritten-sign-height;
-    width: $pv-handwritten-sign-width;
-  }
-
-  .e-pv-toolbar-scroll .e-toolbar-pop.e-popup-open {
-    overflow: auto;
-  }
-
-  .e-pv-canvas-signature {
-    width: $pv-canvas-sign-width;
-    @if $skin-name == 'FluentUI' {
-      max-width: $pv-canvas-sign-width;
-    }
-    @if $skin-name == 'Material3' {
-      width: 100%;
-      max-width: $pv-canvas-sign-width;
-    }
-  }
-
-  .e-pv-canvas-signature-blazor {
-    width: $pv-canvas-sign-width-blazor;
-  }
-
-  .e-pv-font-appearance-style {
-    padding: $pv-font-div-padding;
-    @if $skin-name == 'Material3' {
-      max-width: $pv-canvas-sign-width;
-    }
-  }
-
-  .e-pv-font-appearance-style-blazor {
-    padding: $pv-font-div-padding-blazor;
-  }
-
-  .e-pv-annotation-textalign-container.e-dropdown-btn.e-btn .e-pv-left-align-icon.e-pv-icon.e-btn-icon.e-icon-left {
-    @if ($skin-name == 'bootstrap4' or $skin-name == 'material') {
-      padding: 0 6px;
-      width: 28px;
-    }
-  }
-  .e-pv-toolbar-tooltip {
-    pointer-events: none;
-  }
-
-  .e-pdfviewer .e-dropdown-btn,
-  .e-pdfviewer .e-dropdown-btn.e-btn {
-    @if ($skin-name == 'Material3') {
-      box-shadow: none;
-    }
-  }
-}