@use '../base/common/base-variables' as *;
@use '../document-editor/material3-dark-definition' as *;

@forward '../document-editor/material3-dark-definition';
$de-ctnr-height: calc(100%) !default;
$de-ctnr-tlbr-height: 85px !default;
$de-ctnr-tlbt-height-big: 90px !default;
$de-tlbr-margin-first: 8px !default;
$de-tlbr-margin-first-big: 8px !default;
$de-tlbr-margin-right: 4px !default;
$de-tlbr-margin-right-big: 8px !default;
$de-ctrnr-tblr-separator-margin: 0 8px !default;
$de-ctrnr-tblr-separator-margin-big: 0 8px !default;
$de-ctnr-margin-bottom: 8px !default;
$de-tbl-merge-cell: 17px !default;
$de-ctnr-margin-bottom-big: 8px !default;
$de-group-btn-hgt: 32px !default;
$de-group-btn-hgt-big: 40px !default;
$de-status-btn-hgt-big: 38px !default;
$de-ctnr-tlbr-width: calc(100% - 78px) !default;
$de-spellcheck-tlbr-width: 106px !default;
$de-spellcheck-tlbr-width-big: 145px !default;
$de-spellcheck-tlbr-height: 34px !default;
$de-spellcheck-tlbr-margin-left: 7.5px !default;
$de-zoom-tlbr-margin-left: calc(100% - 395px) !default;
$de-zoom-tlbr-margin-left-big: calc(100% - 430px) !default;
$e-de-ctnr-break-listview-margin-right: 12px !default;
$e-de-ctnr-break-listview-margin-right-big: 16px !default;
$e-de-ctnr-break-listview-margin-left: 12px !default;
$e-de-ctnr-break-listview-margin-left-big: 16px !default;
$de-tlbr-btn-height: calc(100% - 10px) !default;
$de-tool-ctnr-editor-height: calc(100% - 117px) !default;
$de-tool-ctnr-editor-height-big: calc(100% - 128px) !default;
$de-ctnr-editor-height: calc(100% - 42px) !default;
$de-ctnr-editor-height-big: calc(100% - 46px) !default;
$de-ctrnr-tblr-item-padding: 0 !default;
$de-ctrnr-tblr-item-margin: 0 6.5px !default;
$de-ctrnr-tblr-item-margin-big: 0 6px !default;
$de-prop-pane-margin: 16px;
$de-panel-header-size: $text-xs !default;
$de-table-prop-border-margin: 16px;
$de-toc-template-content1: 80px !default;
$de-toc-template-content2: 66px !default;
$de-toc-template-content3: 59px !default;
$de-img-span-top: 8px !default;
$de-ribbon-img-span-top: 8px !default;
$de-img-span-left: 12px !default;
$de-toggle-btn-outline: none !default;
$de-toggle-btn-border: none !default;
$de-page-no-width-spellout: calc(100% - 169px) !default;
$de-page-no-width-spellout-big: calc(100% - 180px) !default;
$de-ctnr-status-bar-hgt: 36px !default;
$de-border-size-button-height-bg: 39px !default;
$de-border-size-button-width-bg: 100px !default;
$de-border-size-button-height: 32px !default;
$de-border-size-button-width: 104px !default;
$de-list-hover-bg: rgba($primary) !default;
$de-pane-margin-right: 9px;
$de-pane-margin-right-big: 16px;
$de-left-panel-width: 151px;
$de-left-panel-width-big: 169px;
$de-right-panel-width: 73px;
$de-text-pane-width: 256px;
$de-text-pane-width-big: 306px;
$de-btn-icon-margin: -2px !default;
$de-left-btn-width: 36px;
$de-left-btn-width-big: 44px;
$de-right-btn-width: 36px;
$de-right-btn-width-big: 43px;
$de-border-btn-width-big: 44px;
$de-right-font-size-width-big: $text-8xl;
$de-img-span-top-big: 12px;
$de-bullet-icon-font-size: $text-xs;
$de-bullet-icon-line-height: 0;
$de-list-button-margin-right: 12px;
$de-list-button-margin-right-bigger: 16px;
$de-text-pane-style-width: auto;
$de-btn-font-size: $text-base;
$de-btn-font-size-bigger: $text-lg;
$de-ctnr-padding: 16px;
$de-prop-style-padding: 12px;
$de-prop-div-padding-top: 12px;
$de-prop-div-padding-bottom: 12px;
$de-layout-btn-font-size: $text-sm;
$de-layout-btn-bgr-font-size: $text-base;
$de-pagenumber-text-border-radius: 2px;
$de-pagenumber-text-margin-top: -3px;
$e-de-pagenumber-input-margin-left: -2px;
$e-de-ctnr-pg-no-spellout-padd-top: 7px;
$e-de-ctnr-pg-no-spellout-padd-top-big: 10px;
$e-de-status-bar-padding-top: 1px;
$e-de-status-bar-big-padding-top: 1px;
$e-de-review-pane-width: 380px;
$e-de-ctnr-linespacing-tick-icon: 8px;
$de-toolbar-font-size: $text-xs;
$de-toolbar-padding-bottom: 10px;
$de-toolbar-padding-bottom-bg: 10px;
$de-header-font-weight: $font-weight-medium;
$de-prop-sub-label-mrgn-btm: 4px;
$de-hdr-ftr-frst-div-mrgn-btm: 12px;
$de-hdr-ftr-top-div-mrgn-btm: 12px;
$de-ctnr-pg-no-spellout-fnt-size: $text-sm;
$de-ctnr-pg-no-spellout-fnt-size-bg: $text-base;
$de-status-br-lbl-fnt-weight: $font-weight-medium;
$de-status-br-left: 0 !default;
$de-status-br-top: 6px !default;
$de-status-br-top-big: 8px !default;
$e-de-btn-font-size: $text-sm;
$e-de-btn-font-icon-size: 16px;
$e-de-btn-font-size-big: $text-base;
$e-de-btn-font-icon-size-big: 18px;
$e-de-bzr-btn-font-size: $text-base;
$e-de-bzr-btn-font-size-big: $text-lg;
$e-de-bzr-button-hover-border-radius: 4px;
$e-de-bzr-button-hover-border: none;
$de-clr-pckr-width: 40px;
$de-page-number-margin-top: 3px;
$de-page-number-margin-top-big: 4px;
$de-hlt-clr-height: 20px;
$de-hlt-clr-height-bigger: 24px;
$de-pageweb-toggle-outline: rgba($white) 0 solid !default;
$de-title-bar-bg-clr: rgba($primary) !default;
$de-title-bar-font-clr: rgba($primary-text-color) !default;
$de-ctnr-bg-clr: $content-bg-color-alt2 !default;
$de-ctnr-prop-bg-clr: $content-bg-color-alt1 !default;
$de-prpty-btn-bg-clr: $content-bg-color-alt2 !default;
$de-prop-btn-icon-clr: rgba($icon-color);
$de-toolbar-icon-clr: rgba($icon-color);
$de-clr-picker-border-clr: rgba($border);
$de-panel-border: rgba($border-light) !default;
$de-pane-separator: rgba($border-light) !default;
$de-list-thmbnail-border-clr: rgba($border-light);
$e-de-statusbar-separator-color: rgba($border-light);
$de-panel-header-color: rgba($on-secondary-container) !default;
$de-panel-sub-label-color: rgba($content-text-color) !default;
$de-header-line-color: 1px solid rgba($border-light) !default;
$de-toggle-bg-color: rgba($content-bg-color-selected) !default;
$de-font-color: rgba($on-secondary-container) !default;
$de-prop-btn-border-color: rgba($border-light) !default;
$de-prop-btn-bg-color: $content-bg-color-alt3 !default;
$de-toggle-btn-color: rgba($icon-color) !default;
$de-pageweb-toggle-color: $content-bg-color-alt3 !default;
$e-de-pagenumber-bg: $content-bg-color-alt4;
$de-toggle-border-color: $secondary-bg-color !default;
$de-toggle-hover-color: $secondary-bg-color !default;
$de-toggle-border-hover-color: $secondary-bg-color !default;
$de-toggle-disabled-color: $secondary-bg-color !default;
$de-background-color: $content-bg-color-alt3 !default;
$de-toolbar-background-color: $content-bg-color-alt2 !default;
$de-pane-background-color: $content-bg-color-alt1 !default;
$de-ruler-background-color: $content-bg-color-alt3 !default;
$de-ruler-margin-color: rgba($content-bg-color) !default;
$de-ruler-tick-stroke: rgba($icon-color) !default;
$de-ruler-label-fill: rgba($content-text-color-alt1) !default;
$de-ruler-indent-stroke: rgba($icon-color) !default;
$de-ruler-indent-fill:  rgba($content-bg-color) !default;
$de-ruler-indent-hover: $content-bg-color-alt5 !default;
$de-ruler-indent-active: rgba($primary) !default;
$de-custom-treeview-text-size: 13px !default;
$de-custom-treeview-text-size-bg: 13px !default;
$e-de-bzr-button-border-color: rgba($white) !default;
$e-de-bzr-button-active-font-color: rgba($content-text-color) !default;
$de-white-color: rgba($white) !default;
$de-black-color: rgba($black) !default;
$e-de-bzr-button-bg-color: $content-bg-color-alt2 !default;
$e-de-bzr-button-hover-bg-color: $secondary-bg-color-hover !default;
$e-de-bzr-button-font-color: rgba($content-text-color) !default;
$e-de-bzr-button-hover-font-color: rgba($content-text-color-selected) !default;
$e-de-bzr-button-active-bg-color:  rgba($primary-light) !default;
$e-de-bzr-button-active-border-color: rgba($primary-light) !default;
$de-hover-bg: $content-bg-color-alt2 !default;
$de-ribbon-property-label: $text-xs;

// Subtract the ribbon & statusbar height
$de-ribbon-simplified-ctnr-editor-height: calc(100% - 107px) !default;
$de-ribbon-simplified-ctnr-editor-height-big: calc(100% - 111px) !default;

$de-ribbon-classic-editor-height: calc(100% - 179px) !default;
$de-ribbon-classic-editor-height-big: calc(100% - 183px) !default;
$de-ctnr-layout-margin-bottom: 8px;
$de-ctnr-picture-margin-bottom: 8px;

$de-ribbon-simplified-ctnr-collapsed-editor-height: calc(100% - 72px) !default;
$de-ribbon-classic-collapsed-editor-height: calc(100% - 72px) !default;

// layout.scss
$de-toolbar-line-height: 0;
$de-ctnr-hglt-btn-margin: 3px;
$de-hglt-no-color-padding-top: 1px;
$de-ctnr-hglt-no-color-font-size: 12px;
$de-ctnr-hglt-no-color-padding-top: 11px;

// bigger.scss
$de-statusbar-pageweb-padding: 0;
$de-statusbar-spellcheck-border-radius: 2px;
$de-ctnr-toolbar-margin-left: 0;
$de-ctnr-toolbar-margin-right: 0;
$de-cntr-pane-padding: 16px;
$de-statusbar-zoom-spell-border: 0;
$de-prop-fill-label-margin-left: 0;
$de-prop-fill-label-margin-right-big: 9.8px;
$de-cell-text-box-margin-left: 16px;
$de-cell-text-box-margin-right: 0;
$de-stylediv-padding-left: 16px;
$de-tlbr-wrapper-border: 0;
$de-panel-border-left: 1px;
$de-ctnr-segment-margin-right: 0;
$de-ctnr-prop-label-font-weight: 500;
$de-ctnr-prop-label-letter-spacing: .05px;
$de-table-prop-label-margin-left-big: 14.5px;
$de-table-prop-label-margin-left-rtl: 0;
$de-toolbar-padding: 0;
$de-ctnr-properties-pane-btn-border-radius: 0;
$de-showhide-btn-border: 0;
$de-ctrnr-tblr-padding: 0;
$de-toolbar-items-padding: 0;
$de-property-div-padding: 16px;
$de-pane-separator-border-top: 1px;
$de-ctnr-dropdown-ftr-font-size: 12px;
$de-ctnr-dropdown-ftr-line-height: 40px;
$de-btn-hghlclr-top: 0;
$de-btn-hghlclr-right: 6px;
$de-ctnr-hglt-color-font-size: 12px;
$de-ctnr-hglt-color-font-weight: 400;
$de-image-property-padding-left: 32px;
$de-panel-border-width: 1px;
$de-panel-margin-left: 78px;
$de-toc-template1-content1-font-size: 10px;
$de-toc-template1-content1-margin-left: 5.4px;
$de-toc-template1-content1-margin-top: 6.7px;
$de-toc-template1-content2-font-size: 8px;
$de-toc-template1-content2-margin-left: 20.4px;
$de-toc-template1-content2-margin-top: 5.7px;
$de-toc-template1-content3-font-size: 7px;
$de-toc-template1-content3-margin-left: 28.4px;
$de-toc-template1-content3-margin-top: 6.7px;
$de-toc-optionsdiv-margin-bottom: 11.5px;
$de-toc-optionsdiv-margin-left: 5.5px;
$de-toc-optionsdiv-margin-top: 15.5px;
$de-toc-optionsdiv-margin-left-rtl: 0;
$de-prop-sub-label-font-size: 13px;
$de-prop-sub-label-margin-bottom: 8.5px;
$de-btn-cancel-margin-left: 10px;
$de-statusbar-zoom-border: 0;
$tbar-btn-text-line-height: 25px;
$tbar-btn-text-padding-top: 0;
$tbar-btn-text-padding-right: 5px;
$tbar-btn-text-line-hgt: 0;
$de-listview-icon-line-height: 22px;
$e-de-btn-line-height: 30px;

// theme.scss
$de-prop-header-label-font-size: 13px;
$de-panel-header-margin-left: 78px;
$de-list-container-padding-right: 0;
$de-list-container-padding-top: 5px;
$de-list-container-border-radius: 2px;
$de-list-container-border-width: 1px;
$de-panel-header-letter-spacing: .05px;
$de-ctnr-group-btn-middle-border-radius: 0;
$de-statusbar-pageweb-border: 0;
$e-de-ctnr-break-listview-line-height: 22px;
$de-ctnr-font-weight: 400;
$e-de-btn-padding: 0;
$e-de-statusbar-separator-border-left: 1px;
$de-statusbar-spellcheck-font-weight: 400;
$de-panel-border-bottom: 1px;
$de-pane-margin-rgt: 0;
$de-panel-header-font-weight: 500;
$de-table-prop-label-margin-left: 12px;
$de-toolbar-border-radius: 0;
$de-tlbr-margin-left: 0;
$de-tlbr-btn-padding: 0;
$de-prpty-btn-border-radius: 0;
$de-op-border-left: 1px;
$de-pane-separator-border-bottom: .5px;
$de-pane-separator-font-size: 12px;
$de-pane-separator-line-height: 40px;
$de-btn-hghlclr-padding: 1px;
$de-ctnr-hglt-color-font-size: 12px;
$de-ctnr-hglt-color-font-weight: 400;
$de-floating-menu-menuitem-padding: 4px;
$de-list-hover-border-width: 3px;
$de-list-hover-padding: 2px;
$de-list-header-presetmenu-font-size: 11px;
$de-list-header-presetmenu-line-height: 14px;
$de-bullet-icon-font-sze: 14px;
$de-bullet-font-size: 42px;
$de-prop-btn-icon-border-bottom: 1px;
$de-prop-btn-icon-margin-left: 5px;
$de-floating-menuitem-padding: 0;
$de-floating-menuitem-margin-top: 0;
$de-floating-menuitem-margin-right: 5px;
$de-floating-menuitem-margin-bottom: 5px;
$de-floating-menuitem-margin-left: 0;
$de-list-thmbnail-border-width: 1px;
$de-list-thmbnail-margin: 5px;
$de-list-thmbnail-padding: 2px;
$de-ctnr-padding-top: 7px;
$de-ctnr-padding-right: 10px;
$de-ctnr-padding-bottom: 7px;
$de-ctnr-padding-left: 10px;
$de-list-item-font-size: 14px;
$de-title-bar-border-width: 3px;
$de-title-bar-padding: 2px;
$de-floating-menu-padding-top: 10px;
$de-floating-menu-padding-right: 4px;
$de-floating-menu-padding-bottom: 5px;
$de-floating-menu-padding-left: 10px;
$de-list-container-margin: 0;
$de-image-property-padding-left: 32px;
$de-toc-template1-margin-left: 0;
$de-toc-template1-margin-right: 78px;
$de-toc-template1-content1-font-size: 10px;
$de-toc-template1-content2-font-size: 8px;
$de-toc-template1-content3-font-size: 7px;
$de-ctnr-pg-no-border: 1px;
$de-statusbar-zoom-spell-border: 0;
$de-btn-cancel-rtl-margin-lft: 0;
$de-prop-header-label-letter-spacing: .05px;
$de-stylediv-rtl-padding-left: 0;
$de-prop-style-margin-right: 0;
$de-prop-fill-label-margin-right-rtl: 0;
$de-hRuler-border-bottom: .5px;
$de-vRuler-border-right: .5px;
$de-vRuler-border-width: .5px;
$e-de-prop-fill-label-margin-right: 8px;
$de-ctn-font-size: 12px;
$e-de-bzr-btn-padding-bottom: 4px;
$e-tbar-btn-text-line-height: 25px;
$e-toolbar-items-line-height: 30px;
$e-de-statusbar-separator-height: 16px;
$e-de-prop-pane-height: 100%;
$e-de-prop-pane-min-height: 200px;
$e-de-ctnr-pg-no-spellout-height: 100%;
$e-de-statusbar-zoom-spell-height: 34px;
$e-de-grp-btn-ctnr-height: 42px;
$e-de-tool-ctnr-properties-pane-min-height: 200px;
$e-de-overlay-height: 100%;
$e-de-ctnr-properties-pane-btn-min-height: 100%;
$e-de-toc-template1-height: 129px;
$e-de-toc-template1-content1-height: 11px;
$e-de-toc-template1-content2-height: 9px;
$e-de-toc-template1-content3-height: 8px;
$e-de-statusbar-zoom-height-big: 34px;
$e-de-text-wrap-height: 0;
$e-list-icon-height: 24px;
$e-de-font-clr-picker-height: 24px;
$e-de-toolbar-height: 100%;
$e-de-ctnr-hglt-btn-height: 25px;
$e-hglt-no-color-height: 30px;
$e-de-ctnr-picture-format-tab-height: 30px;
$e-de-statusbar-pageweb-height: 33px;
$e-de-listview-height: 24px;
$e-de-statusbar-zoom-height: 33px;
$e-de-statusbar-separator-height: 16px;
$e-de-pane-height: 460px;
$e-de-separator-height: 59px;
$e-de-toolbar-min-height: 16px;
$e-de-floating-menu-height: 55px;
$e-de-floating-bullet-menuitem-md-height: 38px;
$e-de-menuitem-none-height: 70px;
$e-de-ctnr-pg-no-height: 100%;
$e-de-ctnr-group-btn-height: 36px;
$e-de-grp-ctnr: 38px;
$e-de-ctnr-hglt-color-height: 24px;
$e-de-ctnr-showhide-font-size: 16px;
$e-de-ctnr-close-font-size: 16px;
$e-de-selected-spellcheck-font-size: 10px;
$e-de-ctnr-bullet-font-size: 20px;
$e-de-ctnr-bullet-dot-font-size: 8px;
$e-de-ctnr-bullet-line-height: 28px;
$e-de-ctnr-hglt-btn-border: .5px;
$e-de-statusbar-zoom-border: 0;
$e-btn-pageweb-spellcheck-border: 0;
$e-de-tlbr-wrapper-border: 0;
$e-de-showhide-btn-border: 0;
$e-de-ctn-height: 100%;
$e-de-ctn-border-big: 1px;
$e-de-ctn-border: none;
$de-ctnr-dropdown-ftr-border-top: 1px;
$de-prop-fill-label-margin-right: 8px;
