@use 'sass:color';
@use 'ej2-base/styles/definition/bootstrap4' as *;
@forward 'ej2-base/styles/definition/bootstrap4';

/* ======== BlockEditor Styles ======== */
$be-font-family: $font-family !default;
$be-font-size: 14px !default;
$be-font-weight: 400 !default;
$be-line-height: 22px !default;
$be-font-size-bigger: 16px !default;
$be-font-weight-bigger: 400 !default;
$be-line-height-bigger: 24px !default;
$be-bg-color: $white !default;
$be-color: $msg-color !default;

/* ======== Drag and Drop Styles ======== */
$be-drop-indicator-height: 2px !default;
$be-drop-indicator-before-height: 8px !default;
$be-drop-indicator-before-width: 8px !default;
$be-drag-clone-block-padding: 4px 8px !default;
$be-drag-clone-border-radius: 4px !default;
$be-drop-indicator-bg-color: $primary !default;
$be-dragging-clone-bg-color: rgba(179, 215, 255, 1) !default;

/* ======== Floating Icons Styles ======== */
$be-floating-icon-width: 20px !default;
$be-floating-icon-height: 20px !default;
$be-floating-icon-line-height: 14px !default;
$be-floating-icon-font-size: 14px !default;
$be-floating-icon-font-weight: 400 !default;
$be-floating-icon-border-radius: 4px !default;
$be-floating-icon-border-width: 1px !default;
$be-floating-icon-width-bigger: 24px !default;
$be-floating-icon-height-bigger: 24px !default;
$be-floating-icon-line-height-bigger: 16px !default;
$be-floating-icon-font-size-bigger: 16px !default;
$be-floating-icon-font-weight-bigger: 400 !default;
$be-floating-icon-border-color: transparent !default;
$be-floating-icon-color: $gray-600 !default;
$be-floating-icon-color-hover: $gray-900 !default;
$be-floating-icon-hover-bg-color: $gray-400 !default;
$be-drag-icon-selected-color: $gray-600 !default;
$be-drag-icon-selected-bg-color: $gray-400 !default;

/* ======== Inline toolbar Styles ======== */
$be-inline-toolbar-border-radius: 4px !default;
$be-inline-toolbar-border-width: 1px !default;
$be-inline-toolbar-popup-bg-color: $gray-100 !default;
$be-inline-toolbar-popup-border-color: $gray-300 !default;
$be-inline-toolbar-popup-shadow: 0 4px 6px -1px rgba(0, 0, 0, .14), 0 10px 15px -3px rgba(0, 0, 0, .16) !default;
$be-inline-toolbar-item-active-bg-color: $gray-600 !default;
$be-inline-toolbar-item-active-color: $gray-100 !default;
$be-inline-toolbar-items-margin: 3px 11px !default;
$be-inline-toolbar-item-padding: 0 4px !default;

$be-colorpicker-custom-palette-padding: 0 !default;
$be-color-picker-margin-top: 3px !default;
$be-color-picker-width: 100%;
$be-color-picker-height: auto;

$be-hover-split-btn-border: 1px solid color.adjust($gray-600, $lightness: -10%) !default;
$be-split-btn-focus-bg: $gray-600 !default;
$be-split-btn-hover-bg: $gray-600 !default;
$be-button-focus-box-shadow: 0 0 0 3px rgba(130, 138, 145, .5) !default;
$be-icon-color: $primary-font !default;
$be-hover-icons-color: $gray-900 !default;

$be-quick-tb-btn-hover: $gray-600 !default;
$be-quick-pop-item-focus-bg: $gray-600 !default;
$be-quick-item-active-bg: color.adjust($gray-600, $lightness: -10%) !default;
$be-split-btn-border-radius: 4px !default;
$be-default-btn-bg: $gray-100 !default;
$be-quick-popup-bg-color: $white !default;
$be-split-btn-border: 1px solid transparent !default;
$be-active-btn-icons-color: inherit !default;
$be-split-btn-span-hover-bg: color.adjust($gray-600, $lightness: -7.5%) !default;
$be-default-icon-color: $gray-700 !default;
$be-drop-btn-active-bg: color.adjust($gray-600, $lightness: -10%) !default;
$be-btn-active-bg: color.adjust($gray-600, $lightness: -7.5%) !default;

/* ======== Block level syles ======== */
$be-block-placeholder-color: $gray-600 !default;

/* ======== Numbered And Bullet List ======== */
$be-numberlist-font-weight: 400 !default;
$be-numberlist-font-size: 14px !default;
$be-numberlist-font-weight-bigger: 400 !default;
$be-numberlist-font-size-bigger: 16px !default;

/* ======== Quote and Callout Block ======== */
$be-blockquote-left-width: 3px !default;
$be-blockquote-text-padding: 8px !default;
$be-blockquote-margin: 0 !default;
$be-blockquote-left-width-bigger: 3px !default;
$be-blockquote-text-padding-bigger: 8px !default;
$be-blockquote-border-color: $gray-400 !default;
$be-callout-border-radius: 4px !default;
$be-callout-icon-height: 16px !default;
$be-callout-icon-width: 16px !default;
$be-callout-padding: 12px !default;
$be-callout-padding-bigger: 16px !default;
$be-callout-icon-height-bigger: 18px !default;
$be-callout-icon-width-bigger: 18px !default;
$be-callout-bg-color: $gray-100 !default;

/* ======== Toggle Block Styles ======== */
$be-toggle-icon-height: 14px !default;
$be-toggle-icon-width: 14px !default;
$be-toggle-icon-margin: 8px !default;
$be-toggle-icon-height-bigger: 16px !default;
$be-toggle-icon-width-bigger: 16px !default;
$be-toggle-icon-margin-bigger: 12px !default;

/* ======== Selection Overlay ======== */
$be-selection-overlay-border-width: 1px !default;
$be-selection-overlay-border-radius: 4px !default;
$be-selection-overlay-border-color: $primary !default;
$be-selection-overlay-bg-color: rgba(179, 215, 255, 1) !default;

/* ======== Image Placeholder Styles ======== */
$be-image-placeholder-ele-height: 48px !default;
$be-image-placeholder-ele-height-bigger: 56px !default;
$be-image-placeholder-ele-border-radius: 12px !default;
$be-image-placeholder-ele-padding: 13px 16px !default;
$be-image-placeholder-ele-padding-bigger: 16px !default;
$be-image-placeholder-text-icon-gap: 8px !default;
$be-image-placeholder-text-icon-gap-bigger: 12px !default;
$be-image-placeholder-icon-font-weight: 400 !default;
$be-image-placeholder-icon-font-weight-bigger: 400 !default;
$be-image-placeholder-icon-font-size: 16px !default;
$be-image-placeholder-icon-font-size-bigger: 20px !default;
$be-image-placeholder-text-font-size: 14px !default;
$be-image-placeholder-text-font-size-bigger: 16px !default;
$be-image-placeholder-text-font-weight: 400 !default;
$be-image-placeholder-text-font-weight-bigger: 400 !default;
$be-image-placeholder-text-line-height: 22px !default;
$be-image-placeholder-text-line-height-bigger: 24px !default;
$be-image-placeholder-border-width: 1px !default;
$be-image-placeholder-border-color: $gray-200 !default;
$be-image-placeholder-bg-color: $gray-100 !default;
$be-image-placeholder-icon-color: rgba(108, 117, 125, 1) !default;
$be-image-placeholder-text-color: $msg-color !default;

/* ======== Image Uploader popup ======== */
$be-image-upload-popup-radius: 3px !default;
$be-image-upload-popup-tab-content-padding: 16px 14px !default;
$be-image-upload-popup-tab-content-padding-bigger: 16px !default;
$be-embed-btn-padding-top: 24px !default;
$be-embed-btn-padding-top-bigger: 28px !default;
$be-image-upload-popup-boder-width: 1px !default;
$be-image-upload-popup-boder-color: $gray-400 !default;
$be-image-upload-popup-bg-color: $white !default;
$be-image-upload-popup-box-shadow: 0 10px 15px -3px rgba(0, 0, 0, .16), 0 4px 6px -1px rgba(0, 0, 0, .14) !default;
$be-upload-popup-tab-content-border-top-color: $gray-300 !default;
$be-upload-popup-drag-boder-color: $primary !default;
$be-upload-popup-drag-hover-color: rgba(179, 215, 255, 1) !default;
$be-image-block-badge-top: 8px !default;
$be-image-block-badge-right: 8px !default;
$be-image-block-badge-top-bigger: 8px !default;
$be-image-block-badge-right-bigger: 8px !default;

/* ======== Divider Block ======== */
$be-divider-selected-bg-color: rgba(0, 123, 255, .5) !default;
$be-divider-border-color: $gray-300 !default;

/* ======== Link syles ======== */
$be-link-anchor-color: $primary !default;

/* ======== Inline content syles ======== */
$be-inline-code-font-size: 12px !default;
$be-inline-code-font-weight: 400 !default;
$be-inline-code-line-height: 18px !default;
$be-inline-code-padding: 2px 4px !default;
$be-inline-code-border-radius: 2px !default;
$be-inline-code-font-size-bigger: 14px !default;
$be-inline-code-line-height-bigger: 22px !default;
$be-inline-code-padding-bigger: 1px 4px !default;
$be-inline-code-bg-color: rgba(157, 157, 157, .15) !default;
$be-inline-code-text-color: rgb(237, 72, 76) !default;

/* ======== Slash Command styles ======== */
$be-mention-popup-border-width: 1px !default;
$be-mention-popup-border-radius: 4px !default;
$be-mention-popup-padding: 4px !default;
$be-mention-popup-header-padding: 8px !default;
$be-mention-popup-item-padding-left: 8px !default;
$be-mention-popup-padding-bigger: 6px !default;
$be-mention-popup-item-padding-left-bigger: 6px !default;
$be-mention-popup-header-padding-bigger: 8px !default;
$be-mention-popup-border-color: $msg-border-color !default;
$be-mention-popup-bg-color: $content-bg !default;
$be-mention-popup-shadow: 0 4px 6px -1px rgba(0, 0, 0, .14), 0 10px 15px -3px rgba(0, 0, 0, .16) !default;

/* ======== Context menu syles ======== */
$be-ctmenu-content-gap: 8px !default;
$be-ctmenu-icon-font-size: 16px !default;
$be-ctmenu-icon-line-height: 16px !default;
$be-ctmenu-text-font-size: 14px !default;
$be-ctmenu-text-line-height: 22px !default;
$be-ctmenu-shortcut-font-size: 12px !default;
$be-ctmenu-shortcut-line-height: 16px !default;
$be-ctmenu-icon-font-size-bigger: 16px !default;
$be-ctmenu-icon-line-height-bigger: 16px !default;
$be-ctmenu-text-font-size-bigger: 16px !default;
$be-ctmenu-text-line-height-bigger: 22px !default;
$be-ctmenu-shortcut-font-size-bigger: 14px !default;
$be-ctpupmenu-shortcut-font-size-bigger: 12px !default;
$be-ctmenu-shortcut-line-height-bigger: 20px !default;
$be-ctmenu-icon-color: $gray-600 !default;
$be-ctmenu-text-color: $msg-color !default;
$be-ctmenu-shortcut-color: $msg-color !default;
$be-ctmenu-shortcut-color-disabled: $gray-500 !default;

/* ======== Check Box syles ======== */
$be-checkbox-width: 16px !default;
$be-checkbox-height: 16px !default;
$be-checkmark-font-size: 10px !default;
$be-checkmark-line-height: 10px !default;
$be-checkbox-border-radius: 4px !default;
$be-checkbox-border: 1px !default;
$be-checkbox-width-bigger: 18px !default;
$be-checkbox-height-bigger: 18px !default;
$be-checkmark-font-size-bigger: 12px !default;
$be-checkmark-line-height-bigger: 12px !default;
$be-checkbox-border-bigger: 1px !default;
$be-checklist-marker-border-color: $gray-400 !default;
$be-checklist-marker-checked-bg-color: $primary !default;
$be-checklist-marker-checked-border-color: $primary !default;
$be-checklist-marker-checked-color: $primary-font !default;
$be-checked-block-strikethrough-color: $msg-color !default;

/* ======== User and Label Mention Chip Syles ======== */
$be-user-mention-chip-height: 22px !default;
$be-user-mention-avatar-height: 20px !default;
$be-user-mention-avatar-width: 20px !default;
$be-user-mention-chip-padding: 1px 4px !default;
$be-user-mention-chip-font-size: 14px !default;
$be-user-mention-chip-font-weight: 400 !default;
$be-user-mention-chip-line-height: 22px !default;
$be-user-mention-chip-border-radius: 2px !default;
$be-label-mention-chip-height: 30px !default;
$be-label-mention-chip-padding: 4px !default;
$be-label-mention-chip-font-size: 14px !default;
$be-label-mention-chip-line-height: 22px !default;
$be-label-mention-chip-border-radius: 4px !default;
$be-user-mention-chip-height-bigger: 26px !default;
$be-user-mention-avatar-height-bigger: 24px !default;
$be-user-mention-avatar-width-bigger: 24px !default;
$be-user-mention-chip-padding-bigger: 1px 4px !default;
$be-user-mention-chip-font-size-bigger: 16px !default;
$be-user-mention-chip-line-height-bigger: 24px !default;
$be-label-mention-chip-height-bigger: 32px !default;
$be-label-mention-chip-padding-bigger: 4px !default;
$be-label-mention-chip-font-size-bigger: 16px !default;
$be-label-mention-chip-line-height-bigger: 24px !default;

/* ======== User and Label Mention Syles ======== */
$be-user-mention-item-padding: 1px 4px !default;
$be-label-mention-item-padding: 5px 8px !default;
$be-mention-avatar-width: 30px !default;
$be-mention-avatar-height: 30px !default;
$be-label-avatar-width: 20px !default;
$be-label-avatar-height: 20px !default;
$be-user-mention-item-padding-bigger: 2px 6px !default;
$be-label-mention-item-padding-bigger: 5px 6px !default;
$be-mention-avatar-width-bigger: 34px !default;
$be-mention-avatar-height-bigger: 34px !default;
$be-label-avatar-width-bigger: 20px !default;
$be-label-avatar-height-bigger: 20px !default;
$be-mention-menu-avatar-text-color: $content-bg !default;

/* ======== Code Block Styles ======== */
$be-code-block-border-radius: 6px !default;
$be-code-block-container-border-width: 1px !default;
$be-code-block-toolbar-padding: 12px !default;
$be-code-block-lang-padding: 5px 8px !default;
$be-code-block-lang-border-radius: 4px !default;
$be-code-block-lang-border-width: 1px !default;
$be-code-copy-btn-padding: 9px !default;
$be-code-copy-btn-border-radius: 4px !default;
$be-code-toolbar-height: 32px !default;
$be-code-lang-height: 32px !default;
$be-code-copy-btn-height: 32px !default;
$be-code-copy-btn-width: 32px !default;
$be-code-copy-btn-font-size: 14px !default;
$be-code-block-toolbar-padding-bigger: 16px !default;
$be-code-block-lang-padding-bigger: 7px 12px !default;
$be-code-copy-btn-padding-bigger: 11px !default;
$be-code-toolbar-height-bigger: 38px !default;
$be-code-lang-height-bigger: 38px !default;
$be-code-copy-btn-height-bigger: 38px !default;
$be-code-copy-btn-width-bigger: 38px !default;
$be-code-copy-btn-font-size-bigger: 16px !default;
$be-code-copy-btn-bg-color: $gray-100 !default;
$be-code-copy-btn-color: $gray-700 !default;
$be-code-copy-btn-bg-color-hover: $gray-400 !default;
$be-code-copy-btn-color-hover: $gray-900 !default;
$be-code-block-lang-border-color: $msg-border-color !default;
$be-code-block-lang-bg-color: $gray-100 !default;
$be-code-block-container-border-color: $msg-border-color !default;
$be-code-block-container-bg-color: $gray-100 !default;

/* ======== Table syles ======== */
$be-table-heading-height: 34px !default;
$be-table-heading-padding: 7px !default;
$be-table-heading-font-weight: 500 !default;
$be-table-heading-font-size: 14px !default;
$be-table-heading-line-height: 22px !default;
$be-table-col-height: 34px !default;
$be-table-col-padding: 6px !default;
$be-table-col-font-weight: 400 !default;
$be-table-col-font-size: 14px !default;
$be-table-col-line-height: 22px !default;
$be-table-heading-height-bigger: 40px !default;
$be-table-heading-padding-bigger: 8px !default;
$be-table-heading-font-size-bigger: 16px !default;
$be-table-heading-line-height-bigger: 24px !default;
$be-table-col-height-bigger: 40px !default;
$be-table-col-padding-bigger: 8px !default;
$be-table-col-font-size-bigger: 16px !default;
$be-table-col-line-height-bigger: 24px !default;
$be-table-border-color: $gray-300 !default;
$be-table-header-row-bg-color: $gray-100 !default;
$be-table-header-color: $msg-color !default;
$be-table-body-row-bg-color: $white !default;
$be-table-body-color: $msg-color !default;
$be-table-cell-focus-color: $primary !default;
$be-table-cell-focus-shadow: unset !default;
$be-table-add-indicator-bg-color: $primary !default;
$be-table-add-indicator-color: $primary-font !default;
$be-table-hover-line-bg-color: $primary !default;
$be-table-row-hover-bg-color: $gray-200 !default;
$be-table-row-hover-color: $gray-900 !default;
$be-table-row-focus-bg-color: $gray-400 !default;
$be-table-row-focus-color: $gray-900 !default;
$be-table-cell-hover-border: $primary !default;
$be-table-dot-bg-color: $gray-600 !default;
$be-table-gripper-border-radius: 4px !default;
$be-table-gripper-hover-bg: rgba(179, 215, 255, 1) !default;
$be-table-gripper-hover-color: $primary !default;
$be-table-row-selected-bg: $gray-400 !default;
$be-table-row-gripper-pressed-bg: $primary !default;
$be-table-row-gripper-pressed-color: $primary-font !default;
$be-table-col-selected-bg: $gray-400 !default;
$be-table-col-gripper-pressed-bg: $primary !default;
$be-table-col-gripper-pressed-color: $primary-font !default;
$be-table-row-col-selected-border: $primary !default;
$be-table-insert-handle-border: $primary !default;
$be-table-insert-handle-color: $primary !default;
$be-table-row-col-hover-line: $primary !default;
$be-table-row-col-insert-handle-size: 10px !default;
$be-table-row-col-insert-handle-line-height: 10px !default;
$be-table-row-col-action-handle-size-bigger: 16px !default;
$be-table-action-handle-line-height-bigger: 100% !default;
$be-table-icons-border-radius: 50% !default;
$be-table-gripper-action-popup-border-radius: 4px !default;
$be-table-gripper-action-popup-padding: 3px !default;

/* ======== scrollbar syles ======== */
$be-scrollbar-width: 6px !default;
$be-scrollbar-color: $gray-500 !default;

/* ======== Selection syles ======== */
$be-text-selection-bg-color: rgba(179, 215, 255, 1) !default;

$be-heading-margin: 0 !default;
$be-heading-padding: 0 !default;
$be-h1-font-size: 2.857em !default;
$be-h1-font-weight: 600 !default;
$be-h1-line-height: 1.2 !default;
$be-h2-font-size: 2.285em !default;
$be-h2-font-weight: 600 !default;
$be-h2-line-height: 1.2 !default;
$be-h3-font-size: 2em !default;
$be-h3-font-weight: 600 !default;
$be-h3-line-height: 1.2 !default;
$be-h4-font-size: 1.714em !default;
$be-h4-font-weight: 600 !default;
$be-h4-line-height: 1.2 !default;
$be-h5-font-size: 1.428em !default;
$be-h5-font-weight: 600 !default;
$be-h5-line-height: 1.2 !default;
$be-h6-font-size: 1.142em !default;
$be-h6-font-weight: 600 !default;
$be-h6-line-height: 1.5 !default;
$be-editable-element-padding: 20px !default;
$be-editable-element-border: unset !default;
$be-hr-margin: 6px 0 !default;
$be-block-padding: 4px 8px !default;
$be-block-border: 1px !default;
$be-block-border-radius: 4px !default;
$be-block-table-padding: 16px 8px 4px !default;
$be-list-block-margin-left: 15px !default;
$be-list-ul-li-padding-left: 8px !default;
$be-list-ol-li-padding-left: 4px !default;
$be-block-Checklist-margin-left: 0 !default;
$be-callout-icon-margin-top: 8px !default;
$be-callout-icon-margin-left: 10px !default;
$be-toggle-header-margin-bottom: 5px !default;
$be-user-chip-gap: 4px !default;
$be-em-avatar-border-radius: 50% !default;
$be-em-img-border-radius: 50% !default;
$be-drop-indicator-margin: 4px 0 !default;
$be-drop-indicator-border-radius: 50% !default;
$be-divider-drop-indicator-top: 30px !default;
$be-block-container-margin-top: 4px !default;
$be-code-block-languages-margin-left: auto !default;
$be-code-block-copy-btn-margin-left: 8px !default;
$be-code-block-margin: 0 !default;
$be-code-block-padding: 10px 24px !default;
$be-code-block-border: 0 !default;
$be-code-block-radius: 0 !default;
$be-row-col-indicator-border-radius: 50% !default;
$be-row-col-indicator-font-size: 14px !default;
$be-image-container-margin: 6px 2px !default;
$be-rtl-callout-block-padding-left: 0 !default;
$be-rtl-toggle-block-padding-left: 0 !default;
$be-rtl-list-block-margin-right: 23px !default;
$be-rtl-list-block-margin-left: 0 !default;
$be-rtl-ul-li-padding-right: 8px !default;
$be-rtl-ul-li-padding-left: 0 !default;
$be-rtl-ol-li-padding-right: 4px !default;
$be-rtl-ol-li-padding-left: 0 !default;
$be-rtl-block-Checklist-margin-right: 8px !default;
$be-rtl-block-Checklist-margin-left: unset !default;
$be-floating-icons-gap: 4px !default;
$be-rtl-list-item-padding-right: 15px !default;
$be-rtl-list-item-padding-left: 0 !default;
$be-blockaction-menu-line-height: 32px !default;
$be-blockaction-menu-padding: 0 !default;
$be-blockaction-item-padding-right: 4px !default;
$be-mention-margin-top: 5px !default;
$be-fixed-head-padding-left: 0 !default;
$be-dropdownbase-list-padding-left: unset !default;
$be-inline-bgColor-icon-size: 14px !default;
$be-toolbar-bgcolor-dropdown-size: 12px !default;
$be-toolbar-btn-icon-line-height: unset !default;
$be-toolbar-icon-left-margin-left: unset !default;
$be-toolbar-icon-left-margin-right: unset !default;
$be-toolbar-first-child-margin-left: 8px !default;
$be-rtl-toolbar-first-child-margin-left: 0 !default;
$be-rtl-toolbar-first-child-margin-right: 8px !default;
$be-link-content-gap: 15px !default;
$be-link-footer-gap: 8px !default;
$be-link-footer-btn-margin-left: 0 !default;
$be-link-footer-btn-margin-right: 0 !default;
$be-label-mention-item-gap: 8px !default;
$be-popup-em-avatar-border-radius: 50% !default;
$be-popup-em-img-border-radius: 50% !default;
$be-popup-em-content-gap: 8px !default;
$be-color-picker-margin-top: 5px !default;

$be-code-block-copy-btn-bigger-margin: 12px !default;
$be-code-block-bigger-margin: 0 !default;
$be-code-block-bigger-padding-left: 24px !default;
$be-menu-item-bigger-line-height: 40px !default;
$be-menu-item-bigger-padding: 0 !default;
$be-fixed-head-bigger-padding-left: 0 !default;
$be-inline-bgColor-icon-bigger-size: 16px !default;
$be-inline-btn-icon-bigger-size: 14px !default;
$be-toolbar-child-bigger-margin-left: 10px !default;
$be-rtl-toolbar-child-bigger-margin-left: 0 !default;
$be-rtl-toolbar-child-bigger-margin-right: 10px !default;
$be-label-mention-item-bigger-gap: 8px !default;
$be-em-content-bigger-gap: 8px !default;

$be-hr-border: 2px !default;
$be-table-block-border: 1px !default;
$be-cell-focus-outline: 1px !default;
$be-image-focus-outline: 2px !default;
$be-audio-block-outline: 2px !default;
$be-video-block-outline: 2px !default;

//height variables
$be-hr-wrapper-height: 100% !default;
$be-callout-block-svg-height: inherit !default;
$be-toggle-block-svg-height: inherit !default;
$be-em-img-height: 100% !default;
$be-code-block-container-ddl-height: auto !default;
$be-code-block-toolbar-height: auto !default;
$be-col-add-indicator-height: 20px !default;
$be-row-hover-line-height: 2px !default;
$be-image-block-height: auto !default;
$be-menu-item-height: 32px !default;
$be-ctmenu-item-template-height: 100% !default;
$be-popup-em-img-height: 100% !default;
$be-menu-item-bigger-height: 40px !default;

$be-col-add-indicator-width: 20px !default;
$be-block-padding-left: calc(50px + var(--block-indent) * 1px) !default;
$be-block-table-padding-left: calc(50px + var(--block-indent) * 1px) !default;
$be-callout-block-padding-left: calc(45px + var(--block-indent) * 1px) !default;
$be-toggle-block-padding-left: calc(21px + var(--block-indent) * 1px) !default;
$be-dragging-clone-block-padding-left: calc(4px + var(--block-indent) * 1px) !default;
$be-dragging-clone-callout-block-padding-left: calc(45px + var(--block-indent) * 1px) !default;
$be-dragging-clone-toggle-block-padding-left: calc(21px + var(--block-indent) * 1px) !default;
$be-rtl-callout-block-padding-right: calc(45px + var(--block-indent) * 1px) !default;
$be-rtl-toggle-block-padding-right: calc(21px + var(--block-indent) * 1px) !default;
$be-rtl-list-block-padding-left: calc(50px - var(--block-indent) * 1px) !default;
$be-rtl-list-block-padding-right: calc(var(--block-indent) * 1px) !default;
$be-drop-indicator-width: calc(100% - 58px) !default;
$be-row-col-dot-width: 6.4px !default;
$be-table-insert-handle-bg: $content-bg !default;
$be-table-popup-icon-color: $gray-700 !default;
$be-table-col-gripper-height: 20px !default;
$be-table-row-gripper-width: 34px !default;
$be-table-col-gripper-height-bigger: 28px !default;
$be-table-row-gripper-width-bigger: 29px !default;
$be-table-col-gripper-top: -4px !default;
$be-table-row-gripper-left: 16px !default;
$be-table-col-gripper-top-bigger: -12px !default;
$be-table-row-gripper-left-bigger: 21px !default;
$be-table-popup-icon-hover-bg: $gray-600 !default;
$be-table-popup-icon-hover-color: $gray-100 !default;
$be-table-popup-icon-pressed-bg: $gray-700 !default;
$be-table-popup-icon-pressed-color: $gray-100 !default;
$be-table-popup-icon-size: 16px !default;
$be-table-popup-icon-size-bigger: 18px !default;
$be-table-popup-icon-padding: 8px !default;
$be-table-popup-icon-padding-bigger: 11px !default;