@mediusinc/mng-commons-layout 6.0.0-rc.5 → 6.0.0-rc.6

package/scss/theme/theme-light/_variables.scss

@@ -1,937 +0,0 @@
-$blue: #2196f3 !default;
-$green: #4caf50 !default;
-$yellow: #fbc02d !default;
-$cyan: #00bcd4 !default;
-$pink: #e91e63 !default;
-$indigo: #3f51b5 !default;
-$teal: #009688 !default;
-$orange: #f57c00 !default;
-$bluegray: #607d8b !default;
-$purple: #9c27b0 !default;
-$red: #ff3d32 !default;
-
-$colors: (
-    'blue': $blue,
-    'green': $green,
-    'yellow': $yellow,
-    'cyan': $cyan,
-    'pink': $pink,
-    'indigo': $indigo,
-    'teal': $teal,
-    'orange': $orange,
-    'bluegray': $bluegray,
-    'purple': $purple,
-    'red': $red,
-    'primary': $primaryColor
-);
-
-//reused color variables
-$shade000: transparent !default; //surface
-$shade100: rgba(68, 72, 109, 0.07) !default; //Alpha - 01
-$shade200: rgba(68, 72, 109, 0.12) !default; //Alpha - 02
-$shade300: rgba(68, 72, 109, 0.17) !default; //Alpha - 03
-$shade400: rgba(255, 255, 255, 0.9) !default; //CardBg
-$shade500: #8a8ea6 !default; //text third color
-$shade600: #676b89 !default; //text secondary color
-$shade700: #44486d !default; //text color
-
-$solidSurfaceColor: #ececf9 !default;
-
-//global
-$fontFamily: 'Inter var', sans-serif !default;
-$fontSize: 1rem !default;
-$fontWeight: normal !default;
-$textColor: $shade700 !default;
-$textSecondaryColor: $shade600 !default;
-$borderRadius: 6px !default;
-$transitionDuration: 0.2s !default;
-$formElementTransition:
-    background-color $transitionDuration,
-    color $transitionDuration,
-    border-color $transitionDuration,
-    box-shadow $transitionDuration !default;
-$actionIconTransition:
-    background-color $transitionDuration,
-    color $transitionDuration,
-    box-shadow $transitionDuration !default;
-$listItemTransition: box-shadow $transitionDuration !default;
-$primeIconFontSize: 1rem !default;
-$divider: 1px solid $shade300 !default;
-$inlineSpacing: 0.5rem !default;
-$disabledOpacity: 0.6 !default;
-$maskBg: rgba(0, 0, 0, 0.4) !default;
-$loadingIconFontSize: 2rem !default;
-$errorColor: #fc6161 !default;
-
-//selected state
-$highlightBg: rgba($primaryColor, 0.12) !default;
-$highlightTextColor: darken($primaryDarkerColor, 12%) !default;
-$highlightFocusBg: rgba($primaryColor, 0.24) !default;
-
-//scale
-$scaleSM: 0.875 !default;
-$scaleLG: 1.25 !default;
-
-//focus
-$focusOutlineColor: $primaryColor !default;
-$focusOutline: 0 none !default;
-$focusOutlineOffset: 0 !default;
-$focusShadow: 0 none !default;
-
-//action icons
-$actionIconWidth: 2rem !default;
-$actionIconHeight: 2rem !default;
-$actionIconBg: transparent !default;
-$actionIconBorder: 0 none !default;
-$actionIconColor: $shade600 !default;
-$actionIconHoverBg: $shade200 !default;
-$actionIconHoverBorderColor: transparent !default;
-$actionIconHoverColor: $shade700 !default;
-$actionIconBorderRadius: 50% !default;
-
-//input field (e.g. inputtext, spinner, inputmask)
-$inputPadding: 0.429rem 0.571rem !default;
-$inputTextFontSize: 1rem !default;
-$inputBg: $shade100 !default;
-$inputTextColor: $shade700 !default;
-$inputIconColor: $shade600 !default;
-$inputBorder: 1px solid transparent !default;
-$inputHoverBorderColor: transparent !default;
-$inputFocusBorderColor: $primaryColor !default;
-$inputErrorBorderColor: $errorColor !default;
-$inputPlaceholderTextColor: $shade500 !default;
-$inputFilledBg: $shade000 !default;
-$inputFilledHoverBg: $inputFilledBg !default;
-$inputFilledFocusBg: $shade100 !default;
-
-//input groups
-$inputGroupBg: $shade100 !default;
-$inputGroupTextColor: $shade600 !default;
-$inputGroupAddOnMinWidth: 2.357rem !default;
-
-//input lists (e.g. dropdown, autocomplete, multiselect, orderlist)
-$inputListBg: $shade100 !default;
-$inputListTextColor: $shade700 !default;
-$inputListBorder: $inputBorder !default;
-$inputListPadding: 0.286rem !default;
-$inputListItemPadding: 0.429rem 0.286rem !default;
-$inputListItemBg: transparent !default;
-$inputListItemTextColor: $shade700 !default;
-$inputListItemHoverBg: $shade100 !default;
-$inputListItemTextHoverColor: $shade700 !default;
-$inputListItemFocusBg: $shade300 !default;
-$inputListItemTextFocusColor: $shade700 !default;
-$inputListItemBorder: 0 none !default;
-$inputListItemBorderRadius: 4px !default;
-$inputListItemMargin: 0 !default;
-$inputListItemFocusShadow: 0 none !default;
-$inputListHeaderPadding: 0.429rem 0.286rem !default;
-$inputListHeaderMargin: 0 !default;
-$inputListHeaderBg: $shade100 !default;
-$inputListHeaderTextColor: $shade700 !default;
-$inputListHeaderBorder: 0 none !default;
-
-//inputs with overlays (e.g. autocomplete, dropdown, multiselect)
-$inputOverlayBg: white !default;
-$inputOverlayHeaderBg: $inputListHeaderBg !default;
-$inputOverlayBorder: 0 none !default;
-$inputOverlayShadow:
-    0 2px 4px -1px rgba(0, 0, 0, 0.2),
-    0 4px 5px 0 rgba(0, 0, 0, 0.14),
-    0 1px 10px 0 rgba(0, 0, 0, 0.12) !default;
-
-//password
-$passwordMeterBg: $solidSurfaceColor !default;
-$passwordWeakBg: #d32f2f !default;
-$passwordMediumBg: #fbc02d !default;
-$passwordStrongBg: #689f38 !default;
-
-//button
-$buttonPadding: 0.429rem 0.571rem !default;
-$buttonIconOnlyWidth: 2.286rem !default;
-$buttonIconOnlyPadding: 0.429rem 0 !default;
-$buttonBg: $primaryColor !default;
-$buttonTextColor: $primaryTextColor !default;
-$buttonBorder: 1px solid $primaryColor !default;
-$buttonHoverBg: $primaryDarkColor !default;
-$buttonTextHoverColor: $primaryTextColor !default;
-$buttonHoverBorderColor: $primaryDarkColor !default;
-$buttonActiveBg: $primaryDarkerColor !default;
-$buttonTextActiveColor: $primaryTextColor !default;
-$buttonActiveBorderColor: $primaryDarkerColor !default;
-$raisedButtonShadow:
-    0 3px 1px -2px rgba(0, 0, 0, 0.2),
-    0 2px 2px 0 rgba(0, 0, 0, 0.14),
-    0 1px 5px 0 rgba(0, 0, 0, 0.12) !default;
-$roundedButtonBorderRadius: 2rem !default;
-
-$textButtonHoverBgOpacity: 0.04 !default;
-$textButtonActiveBgOpacity: 0.16 !default;
-$outlinedButtonBorder: 1px solid !default;
-$plainButtonTextColor: $textSecondaryColor !default;
-$plainButtonHoverBgColor: $shade100 !default;
-$plainButtonActiveBgColor: $shade300 !default;
-
-$secondaryButtonBg: $shade100 !default;
-$secondaryButtonTextColor: #44486d !default;
-$secondaryButtonBorder: 1px solid transparent !default;
-$secondaryButtonHoverBg: $shade200 !default;
-$secondaryButtonTextHoverColor: $secondaryButtonTextColor !default;
-$secondaryButtonHoverBorderColor: transparent !default;
-$secondaryButtonActiveBg: $shade300 !default;
-$secondaryButtonTextActiveColor: $secondaryButtonTextColor !default;
-$secondaryButtonActiveBorderColor: transparent !default;
-$secondaryButtonShadow: none !default;
-$secondaryButtonFocusShadow: none !default;
-
-$infoButtonBg: #873efe !default;
-$infoButtonTextColor: #ffffff !default;
-$infoButtonBorder: 1px solid transparent !default;
-$infoButtonHoverBg: #6c1af2 !default;
-$infoButtonTextHoverColor: $infoButtonTextColor !default;
-$infoButtonHoverBorderColor: transparent !default;
-$infoButtonActiveBg: #5310c1 !default;
-$infoButtonTextActiveColor: $infoButtonTextColor !default;
-$infoButtonActiveBorderColor: transparent !default;
-$infoButtonShadow: 0px 0px 10px rgba(135, 62, 254, 0.25) !default;
-$infoButtonFocusShadow: none !default;
-
-$successButtonBg: #0bd18a !default;
-$successButtonTextColor: #ffffff !default;
-$successButtonBorder: 1px solid transparent !default;
-$successButtonHoverBg: #049b65 !default;
-$successButtonTextHoverColor: $successButtonTextColor !default;
-$successButtonHoverBorderColor: transparent !default;
-$successButtonActiveBg: #017e52 !default;
-$successButtonTextActiveColor: $successButtonTextColor !default;
-$successButtonActiveBorderColor: transparent !default;
-$successButtonShadow: 0px 0px 10px rgba(11, 209, 138, 0.25) !default;
-$successButtonFocusShadow: none !default;
-
-$warningButtonBg: #eee500 !default;
-$warningButtonTextColor: #44486d !default;
-$warningButtonBorder: 1px solid transparent !default;
-$warningButtonHoverBg: #d1c901 !default;
-$warningButtonTextHoverColor: $warningButtonTextColor !default;
-$warningButtonHoverBorderColor: transparent !default;
-$warningButtonActiveBg: #bab302 !default;
-$warningButtonTextActiveColor: $warningButtonTextColor !default;
-$warningButtonActiveBorderColor: transparent !default;
-$warningButtonShadow: 0px 0px 10px rgba(238, 229, 0, 0.25) !default;
-$warningButtonFocusShadow: none !default;
-
-$helpButtonBg: #ec4dbc !default;
-$helpButtonTextColor: #ffffff !default;
-$helpButtonBorder: 1px solid transparent !default;
-$helpButtonHoverBg: #e80ea6 !default;
-$helpButtonTextHoverColor: $helpButtonTextColor !default;
-$helpButtonHoverBorderColor: transparent !default;
-$helpButtonActiveBg: #b30c81 !default;
-$helpButtonTextActiveColor: $helpButtonTextColor !default;
-$helpButtonActiveBorderColor: transparent !default;
-$helpButtonShadow: 0px 0px 10px rgba(236, 77, 188, 0.25) !default;
-$helpButtonFocusShadow: none !default;
-
-$dangerButtonBg: #fc6161 !default;
-$dangerButtonTextColor: #ffffff !default;
-$dangerButtonBorder: 1px solid transparent !default;
-$dangerButtonHoverBg: #e73a3a !default;
-$dangerButtonTextHoverColor: $dangerButtonTextColor !default;
-$dangerButtonHoverBorderColor: transparent !default;
-$dangerButtonActiveBg: #c42424 !default;
-$dangerButtonTextActiveColor: $dangerButtonTextColor !default;
-$dangerButtonActiveBorderColor: transparent !default;
-$dangerButtonShadow: 0px 0px 10px rgba(252, 97, 97, 0.25) !default;
-$dangerButtonFocusShadow: none !default;
-
-$linkButtonColor: $primaryDarkerColor !default;
-$linkButtonHoverColor: $primaryDarkerColor !default;
-$linkButtonTextHoverDecoration: underline !default;
-$linkButtonFocusShadow: 0 0 0 0.2rem $focusOutlineColor !default;
-
-//checkbox
-$checkboxWidth: 20px !default;
-$checkboxHeight: 20px !default;
-$checkboxBorder: 2px solid #8a8ea6 !default;
-$checkboxIconFontSize: 14px !default;
-$checkboxActiveBorderColor: $primaryColor !default;
-$checkboxActiveBg: $primaryColor !default;
-$checkboxIconActiveColor: $primaryTextColor !default;
-$checkboxActiveHoverBg: $primaryDarkerColor !default;
-$checkboxIconActiveHoverColor: $primaryTextColor !default;
-$checkboxActiveHoverBorderColor: $primaryDarkerColor !default;
-
-//radiobutton
-$radiobuttonWidth: 20px !default;
-$radiobuttonHeight: 20px !default;
-$radiobuttonBorder: 2px solid #8a8ea6 !default;
-$radiobuttonIconSize: 12px !default;
-$radiobuttonActiveBorderColor: $primaryColor !default;
-$radiobuttonActiveBg: $primaryColor !default;
-$radiobuttonIconActiveColor: $primaryTextColor !default;
-$radiobuttonActiveHoverBg: $primaryDarkerColor !default;
-$radiobuttonIconActiveHoverColor: $primaryTextColor !default;
-$radiobuttonActiveHoverBorderColor: $primaryDarkerColor !default;
-
-//colorpicker
-$colorPickerPreviewWidth: 2rem !default;
-$colorPickerPreviewHeight: 2rem !default;
-$colorPickerBg: $shade100 !default;
-$colorPickerBorder: 1px solid #191919 !default;
-$colorPickerHandleColor: $shade000 !default;
-
-//togglebutton
-$toggleButtonBg: $inputBg !default;
-$toggleButtonBorder: 1px solid transparent !default;
-$toggleButtonTextColor: $shade700 !default;
-$toggleButtonIconColor: $shade600 !default;
-$toggleButtonHoverBg: $shade200 !default;
-$toggleButtonHoverBorderColor: transparent !default;
-$toggleButtonTextHoverColor: $shade700 !default;
-$toggleButtonIconHoverColor: $shade600 !default;
-$toggleButtonActiveBg: $primaryColor !default;
-$toggleButtonActiveBorderColor: $primaryColor !default;
-$toggleButtonTextActiveColor: $primaryTextColor !default;
-$toggleButtonIconActiveColor: $primaryTextColor !default;
-$toggleButtonActiveHoverBg: $primaryDarkColor !default;
-$toggleButtonActiveHoverBorderColor: $primaryDarkColor !default;
-$toggleButtonTextActiveHoverColor: $primaryTextColor !default;
-$toggleButtonIconActiveHoverColor: $primaryTextColor !default;
-
-//inplace
-$inplacePadding: $inputPadding !default;
-$inplaceHoverBg: $shade100 !default;
-$inplaceTextHoverColor: $shade700 !default;
-
-//rating
-$ratingIconFontSize: 1.286rem !default;
-$ratingCancelIconColor: #fc6161 !default;
-$ratingCancelIconHoverColor: #fc6161 !default;
-$ratingStarIconOffColor: $shade700 !default;
-$ratingStarIconOnColor: $primaryColor !default;
-$ratingStarIconHoverColor: $primaryColor !default;
-
-//slider
-$sliderBg: $shade200 !default;
-$sliderBorder: 0 none !default;
-$sliderHorizontalHeight: 0.429rem !default;
-$sliderVerticalWidth: 0.429rem !default;
-$sliderHandleWidth: 1.143rem !default;
-$sliderHandleHeight: 1.143rem !default;
-$sliderHandleBg: #ffffff !default;
-$sliderHandleBorder: 4px solid $primaryColor !default;
-$sliderHandleBorderRadius: 50% !default;
-$sliderHandleHoverBorderColor: $primaryColor !default;
-$sliderHandleHoverBg: $primaryColor !default;
-$sliderRangeBg: $primaryColor !default;
-
-//calendar
-$calendarTableMargin: 0.5rem 0 !default;
-$calendarPadding: 0.857rem !default;
-$calendarBg: white !default;
-$calendarInlineBg: transparent !default;
-$calendarTextColor: $shade700 !default;
-$calendarBorder: $inputListBorder !default;
-$calendarOverlayBorder: $inputOverlayBorder !default;
-
-$calendarHeaderPadding: 0 0 0.75rem 0 !default;
-$calendarHeaderBg: transparent !default;
-$calendarInlineHeaderBg: $calendarInlineBg !default;
-$calendarHeaderBorder: 0 none !default;
-$calendarHeaderTextColor: $shade700 !default;
-$calendarHeaderFontWeight: 400 !default;
-$calendarHeaderCellPadding: 0.357rem !default;
-$calendarMonthYearHeaderHoverTextColor: $primaryColor !default;
-
-$calendarCellDatePadding: 0.357rem !default;
-$calendarCellDateWidth: 2.571rem !default;
-$calendarCellDateHeight: 2.571rem !default;
-$calendarCellDateBorderRadius: $borderRadius !default;
-$calendarCellDateBorder: 2px solid transparent !default;
-$calendarCellDateHoverBg: $shade200 !default;
-$calendarCellDateTodayBg: $shade100 !default;
-$calendarCellDateTodayBorderColor: $shade200 !default;
-$calendarCellDateTodayTextColor: $shade700 !default;
-
-$calendarButtonBarPadding: 1rem 0 !default;
-$calendarTimePickerPadding: 0.5rem !default;
-$calendarTimePickerElementPadding: 0 0.5rem !default;
-$calendarTimePickerTimeFontSize: 1.25rem !default;
-
-$calendarBreakpoint: 769px !default;
-$calendarCellDatePaddingSM: 0 !default;
-
-//input switch
-$inputSwitchWidth: 2.714rem !default;
-$inputSwitchHeight: 1.429rem !default;
-$inputSwitchBorderRadius: 12px !default;
-$inputSwitchHandleWidth: 1.143rem !default;
-$inputSwitchHandleHeight: 1.143rem !default;
-$inputSwitchHandleBorderRadius: 8px !default;
-$inputSwitchSliderPadding: 0.25rem !default;
-$inputSwitchSliderOffBg: $shade100 !default;
-$inputSwitchHandleOffBg: $shade600 !default;
-$inputSwitchSliderOffHoverBg: $shade200 !default;
-$inputSwitchSliderOnBg: $primaryColor !default;
-$inputSwitchSliderOnHoverBg: $primaryDarkColor !default;
-$inputSwitchHandleOnBg: #ffffff !default;
-
-//panel
-$panelHeaderBorderColor: $shade300 !default;
-$panelHeaderBorder: 1px solid $shade300 !default;
-$panelHeaderBg: transparent !default;
-$panelHeaderTextColor: $shade700 !default;
-$panelHeaderFontWeight: 500 !default;
-$panelHeaderPadding: 0.714rem 1.143rem !default;
-$panelToggleableHeaderPadding: 0.429rem 0.571rem !default;
-
-$panelHeaderHoverBg: $shade100 !default;
-$panelHeaderHoverBorderColor: $shade300 !default;
-$panelHeaderTextHoverColor: $shade700 !default;
-
-$panelContentBorderColor: $shade300 !default;
-$panelContentBorder: 1px solid $shade300 !default;
-$panelContentBg: transparent !default;
-$panelContentEvenRowBg: scale-color($panelContentBg, $lightness: -1%) !default;
-$panelContentTextColor: $shade700 !default;
-$panelContentPadding: 1.143rem !default;
-
-$panelFooterBorder: 1px solid $shade300 !default;
-$panelFooterBg: transparent !default;
-$panelFooterTextColor: $shade700 !default;
-$panelFooterPadding: 0.714rem 1.143rem !default;
-
-//accordion
-$accordionSpacing: 0 !default;
-$accordionHeaderBorder: $panelHeaderBorder !default;
-$accordionHeaderBg: $panelHeaderBg !default;
-$accordionHeaderTextColor: $panelHeaderTextColor !default;
-$accordionHeaderFontWeight: $panelHeaderFontWeight !default;
-$accordionHeaderPadding: $panelHeaderPadding !default;
-
-$accordionHeaderHoverBg: $shade100 !default;
-$accordionHeaderHoverBorderColor: $shade300 !default;
-$accordionHeaderTextHoverColor: $shade700 !default;
-
-$accordionHeaderActiveBg: $shade200 !default;
-$accordionHeaderActiveBorderColor: $shade300 !default;
-$accordionHeaderTextActiveColor: $shade700 !default;
-
-$accordionHeaderActiveHoverBg: $shade200 !default;
-$accordionHeaderActiveHoverBorderColor: $shade300 !default;
-$accordionHeaderTextActiveHoverColor: $shade700 !default;
-
-$accordionContentBorder: $panelContentBorder !default;
-$accordionContentBg: $panelContentBg !default;
-$accordionContentTextColor: $panelContentTextColor !default;
-$accordionContentPadding: $panelContentPadding !default;
-
-//tabview
-$tabviewNavBorder: 1px solid $shade300 !default;
-$tabviewNavBorderWidth: 0 0 2px 0 !default;
-$tabviewNavBg: transparent !default;
-
-$tabviewHeaderSpacing: 0.857rem !default;
-$tabviewHeaderBorder: solid transparent !default;
-$tabviewHeaderBorderWidth: 0 0 2px 0 !default;
-$tabviewHeaderBorderColor: transparent transparent transparent transparent !default;
-$tabviewHeaderBg: transparent !default;
-$tabviewHeaderTextColor: $shade500 !default;
-$tabviewHeaderFontWeight: $panelHeaderFontWeight !default;
-$tabviewHeaderPadding: 0.571rem 0.429rem !default;
-$tabviewHeaderMargin: 0 0 -2px 0 !default;
-
-$tabviewHeaderHoverBg: transparent !default;
-$tabviewHeaderHoverBorderColor: $shade700 !default;
-$tabviewHeaderTextHoverColor: $shade700 !default;
-
-$tabviewHeaderActiveBg: transparent !default;
-$tabviewHeaderActiveBorderColor: $primaryColor !default;
-$tabviewHeaderTextActiveColor: $primaryColor !default;
-
-$tabviewContentBorder: 0 none !default;
-$tabviewContentBg: transparent !default;
-$tabviewContentTextColor: $panelContentTextColor !default;
-$tabviewContentPadding: 1.143rem 0 !default;
-
-//upload
-$fileUploadProgressBarHeight: 0.25rem !default;
-$fileUploadContentPadding: 2rem 1rem !default;
-$fileUploadContentHoverBorder: 1px dashed $primaryColor !default;
-$fileUploadFileBorder: 1px solid $shade300 !default;
-$fileUploadFilePadding: 1rem !default;
-
-//scrollpanel
-$scrollPanelTrackBorder: 0 none !default;
-$scrollPanelTrackBg: $shade100 !default;
-
-//card
-$cardBodyPadding: 0.857rem 1.143rem !default;
-$cardTitleFontSize: 1.143rem !default;
-$cardTitleFontWeight: 500 !default;
-$cardSubTitleFontWeight: 500 !default;
-$cardSubTitleColor: $shade500 !default;
-$cardContentPadding: 1rem 0 !default;
-$cardFooterPadding: 1rem 0 0 0 !default;
-$cardShadow:
-    0 2px 1px -1px rgba(0, 0, 0, 0.2),
-    0 1px 1px 0 rgba(0, 0, 0, 0.14),
-    0 1px 3px 0 rgba(0, 0, 0, 0.12) !default;
-
-//editor
-$editorToolbarBg: $panelHeaderBg !default;
-$editorToolbarBorder: $panelHeaderBorder !default;
-$editorToolbarPadding: $panelHeaderPadding !default;
-$editorToolbarIconColor: $textSecondaryColor !default;
-$editorToolbarIconHoverColor: $textColor !default;
-$editorIconActiveColor: $primaryColor !default;
-$editorContentBorder: $panelContentBorder !default;
-$editorContentBg: $panelContentBg !default;
-
-//paginator
-$paginatorBg: transparent !default;
-$paginatorTextColor: $shade700 !default;
-$paginatorBorder: solid $shade300 !default;
-$paginatorBorderWidth: 0 !default;
-$paginatorPadding: 0.571rem 0.571rem !default;
-$paginatorElementWidth: 1.429rem !default;
-$paginatorElementHeight: 1.429rem !default;
-$paginatorElementBg: transparent !default;
-$paginatorElementBorder: 0 none !default;
-$paginatorElementIconColor: $shade700 !default;
-$paginatorElementHoverBg: $shade100 !default;
-$paginatorElementHoverBorderColor: transparent !default;
-$paginatorElementIconHoverColor: $shade700 !default;
-$paginatorElementBorderRadius: 4px !default;
-$paginatorElementMargin: 0.143rem !default;
-$paginatorElementPadding: 0 !default;
-
-//table
-$tableHeaderBorder: 1px solid $shade300 !default;
-$tableHeaderBorderWidth: 1px 0 1px 0 !default;
-$tableHeaderBg: var(--surface-section) !default;
-$tableHeaderTextColor: $shade500 !default;
-$tableHeaderFontWeight: 500 !default;
-$tableHeaderPadding: 0.571rem 0.571rem !default;
-
-$tableHeaderCellPadding: 0.571rem 0.571rem !default;
-$tableHeaderCellBg: var(--surface-section) !default;
-$tableHeaderCellTextColor: $shade500 !default;
-$tableHeaderCellFontWeight: 500 !default;
-$tableHeaderCellBorder: 1px solid $shade300 !default;
-$tableHeaderCellBorderWidth: 0 0 1px 0 !default;
-$tableHeaderCellHoverBg: $shade100 !default;
-$tableHeaderCellTextHoverColor: $shade500 !default;
-$tableHeaderCellIconColor: $shade500 !default;
-$tableHeaderCellIconHoverColor: $shade500 !default;
-$tableHeaderCellHighlightBg: $shade200 !default;
-$tableHeaderCellHighlightTextColor: $shade500 !default;
-$tableHeaderCellHighlightHoverBg: $shade200 !default;
-$tableHeaderCellHighlightTextHoverColor: $shade500 !default;
-$tableSortableColumnBadgeSize: 1.143rem !default;
-
-$tableBodyRowBg: var(--surface-section) !default;
-$tableBodyRowTextColor: $shade700 !default;
-$tableBodyRowEvenBg: var(--surface-section) !default;
-$tableBodyRowHoverBg: $shade100 !default;
-$tableBodyRowTextHoverColor: $shade700 !default;
-$tableBodyCellBorder: 1px solid $shade300 !default;
-$tableBodyCellBorderWidth: 0 0 0 0 !default;
-$tableBodyCellPadding: 0.429rem 0.571rem !default;
-
-$tableFooterCellPadding: 0.571rem 0.571rem !default;
-$tableFooterCellBg: var(--surface-section) !default;
-$tableFooterCellTextColor: $shade500 !default;
-$tableFooterCellFontWeight: 500 !default;
-$tableFooterCellBorder: 1px solid $shade300 !default;
-$tableFooterCellBorderWidth: 0 0 1px 0 !default;
-$tableResizerHelperBg: $primaryColor !default;
-
-$tableFooterBorder: 1px solid $shade300 !default;
-$tableFooterBorderWidth: 0 0 1px 0 !default;
-$tableFooterBg: var(--surface-section) !default;
-$tableFooterTextColor: $shade500 !default;
-$tableFooterFontWeight: 500 !default;
-$tableFooterPadding: 1rem 1rem !default;
-
-$tableCellContentAlignment: left !default;
-$tableTopPaginatorBorderWidth: 1px 0 1px 0 !default;
-$tableBottomPaginatorBorderWidth: 1px 0 1px 0 !default;
-
-$tableScaleSM: 0.5 !default;
-$tableScaleLG: 1.25 !default;
-
-//dataview
-$dataViewContentPadding: 0 !default;
-$dataViewContentBorder: 0 none !default;
-$dataViewListItemBorder: solid $shade100 !default;
-$dataViewListItemBorderWidth: 0 0 0 0 !default;
-
-//schedule
-$fullCalendarEventBg: $primaryDarkColor !default;
-$fullCalendarEventBorderColor: $primaryDarkColor !default;
-$fullCalendarEventBorder: 1px solid $primaryDarkColor !default;
-$fullCalendarEventTextColor: $primaryTextColor !default;
-
-//tree
-$treeContainerPadding: 0.286rem !default;
-$treeNodePadding: 0.143rem !default;
-$treeNodeContentPadding: 0.429rem 0.571rem !default;
-$treeNodeChildrenPadding: 0 0 0 1rem !default;
-$treeNodeIconColor: $shade700 !default;
-
-//timeline
-$timelineVerticalEventContentPadding: 0 1rem !default;
-$timelineHorizontalEventContentPadding: 1rem 0 !default;
-$timelineEventMarkerWidth: 1rem !default;
-$timelineEventMarkerHeight: 1rem !default;
-$timelineEventMarkerBorderRadius: 50% !default;
-$timelineEventMarkerBorder: 2px solid $primaryColor !default;
-$timelineEventMarkerBackground: $shade100 !default;
-$timelineEventConnectorSize: 2px !default;
-$timelineEventColor: $shade300 !default;
-
-//org chart
-$organizationChartConnectorColor: $shade300 !default;
-
-//message
-$messageMargin: 1rem 0 !default;
-$messagePadding: 1.143rem 1.357rem !default;
-$messageBorderWidth: 0 0 0 20px !default;
-$messageIconFontSize: 1.286rem !default;
-$messageTextFontSize: 1rem !default;
-$messageTextFontWeight: 400 !default;
-
-//inline message
-$inlineMessagePadding: $inputPadding !default;
-$inlineMessageMargin: 0 !default;
-$inlineMessageIconFontSize: 1.286rem !default;
-$inlineMessageTextFontSize: 1rem !default;
-$inlineMessageBorderWidth: 0 0 0 20px !default;
-
-//toast
-$toastIconFontSize: 1.286rem !default;
-$toastMessageTextMargin: 0 0 0 1rem !default;
-$toastMargin: 0 0 1rem 0 !default;
-$toastPadding: 1.143rem 1.357rem !default;
-$toastBorderWidth: 0 0 0 20px !default;
-$toastShadow: none !default;
-$toastOpacity: 0.9 !default;
-$toastTitleFontWeight: 400 !default;
-$toastDetailMargin: $inlineSpacing 0 0 0 !default;
-
-//severities
-$infoMessageBg: $shade100 !default;
-$infoMessageBorder: solid #873efe !default;
-$infoMessageTextColor: $shade700 !default;
-$infoMessageIconColor: $shade700 !default;
-$successMessageBg: $shade100 !default;
-$successMessageBorder: solid #0bd18a !default;
-$successMessageTextColor: $shade700 !default;
-$successMessageIconColor: $shade700 !default;
-$warningMessageBg: $shade100 !default;
-$warningMessageBorder: solid #eee500 !default;
-$warningMessageTextColor: $shade700 !default;
-$warningMessageIconColor: $shade700 !default;
-$errorMessageBg: $shade100 !default;
-$errorMessageBorder: solid #fc6161 !default;
-$errorMessageTextColor: $shade700 !default;
-$errorMessageIconColor: $shade700 !default;
-
-//overlays
-$overlayContentBorder: 0 none !default;
-$overlayContentBg: white !default;
-$overlayContainerShadow: 0px 18px 50px -4px rgba(68, 72, 109, 0.1) !default;
-
-//dialog
-$dialogBorderRadius: 20px;
-$dialogHeaderBg: white !default;
-$dialogHeaderBorder: 0 none !default;
-$dialogHeaderTextColor: $shade700 !default;
-$dialogHeaderFontWeight: 500 !default;
-$dialogHeaderFontSize: 1.143rem !default;
-$dialogHeaderPadding: 1.286rem 1.714rem !default;
-$dialogContentPadding: 0 1.714rem 1.714rem 1.714rem !default;
-$dialogFooterBorder: 0 none !default;
-$dialogFooterPadding: 0 1.714rem 1.714rem 1.714rem !default;
-
-//confirmpopup
-$confirmPopupContentPadding: $panelContentPadding !default;
-$confirmPopupFooterPadding: 0 1.25rem 1.25rem 1.25rem !default;
-
-//tooltip
-$tooltipBg: white !default;
-$tooltipTextColor: $shade700 !default;
-$tooltipPadding: $inputPadding !default;
-
-//steps
-$stepsItemBg: transparent !default;
-$stepsItemBorder: 0 none !default;
-$stepsItemTextColor: $shade500 !default;
-$stepsItemNumberWidth: 1.714rem !default;
-$stepsItemNumberHeight: 1.714rem !default;
-$stepsItemNumberFontSize: 1.143rem !default;
-$stepsItemNumberColor: $shade500 !default;
-$stepsItemNumberBorderRadius: 12px !default;
-$stepsItemActiveFontWeight: 400 !default;
-
-//progressbar, progressspinner
-$progressBarHeight: 0.571rem !default;
-$progressBarBorder: 0 none !default;
-$progressBarBg: $shade300 !default;
-$progressBarValueBg: $primaryColor !default;
-$progressBarValueTextColor: $primaryTextColor !default;
-
-$progressSpinnerStrokeColor: $errorMessageTextColor !default;
-$progressSpinnerColorOne: $errorMessageTextColor !default;
-$progressSpinnerColorTwo: $infoMessageTextColor !default;
-$progressSpinnerColorThree: $successMessageTextColor !default;
-$progressSpinnerColorFour: $warningMessageTextColor !default;
-
-//menu (e.g. menu, menubar, tieredmenu)
-$menuWidth: 12.5rem !default;
-$menuBg: transparent !default;
-$menuBorder: 1px solid $shade300 !default;
-$menuTextColor: $shade600 !default;
-$menuitemPadding: 0.571rem 0.429rem !default;
-$menuitemBorderRadius: $borderRadius !default;
-$menuitemTextColor: $shade600 !default;
-$menuitemIconColor: $shade600 !default;
-$menuitemTextHoverColor: $shade700 !default;
-$menuitemIconHoverColor: $shade700 !default;
-$menuitemHoverBg: $shade100 !default;
-$menuitemTextFocusColor: $shade700 !default;
-$menuitemIconFocusColor: $shade700 !default;
-$menuitemFocusBg: $shade300 !default;
-$menuitemTextActiveColor: $shade700 !default;
-$menuitemIconActiveColor: $shade700 !default;
-$menuitemActiveBg: $highlightBg !default;
-$menuitemActiveFocusBg: $highlightFocusBg !default;
-$menuitemSubmenuIconFontSize: 0.875rem !default;
-$submenuHeaderMargin: 0 !default;
-$submenuHeaderPadding: 0.571rem 0.429rem !default;
-$submenuHeaderBg: transparent !default;
-$submenuHeaderTextColor: $shade500 !default;
-$submenuHeaderBorderRadius: $borderRadius !default;
-$submenuHeaderFontWeight: 500 !default;
-$overlayMenuBg: white !default;
-$overlayMenuBorder: 1px solid transparent !default;
-$overlayMenuShadow: 0px 9px 30px rgba(68, 72, 109, 0.06) !default;
-$verticalMenuPadding: 0.429rem !default;
-$menuSeparatorMargin: 0.25rem 0 !default;
-
-$breadcrumbPadding: 0.857rem !default;
-$breadcrumbBg: $menuBg !default;
-$breadcrumbBorder: $menuBorder !default;
-$breadcrumbItemTextColor: $menuitemTextColor !default;
-$breadcrumbItemIconColor: $menuitemIconColor !default;
-$breadcrumbLastItemTextColor: $menuitemTextColor !default;
-$breadcrumbLastItemIconColor: $menuitemIconColor !default;
-$breadcrumbSeparatorColor: $menuitemTextColor !default;
-
-$horizontalMenuPadding: 0.857rem !default;
-$horizontalMenuBg: $menuBg !default;
-$horizontalMenuBorder: $menuBorder !default;
-$horizontalMenuTextColor: $menuTextColor !default;
-$horizontalMenuRootMenuitemPadding: $menuitemPadding !default;
-$horizontalMenuRootMenuitemBorderRadius: $borderRadius !default;
-$horizontalMenuRootMenuitemTextColor: $menuitemTextColor !default;
-$horizontalMenuRootMenuitemIconColor: $menuitemIconColor !default;
-$horizontalMenuRootMenuitemTextHoverColor: $menuitemTextHoverColor !default;
-$horizontalMenuRootMenuitemIconHoverColor: $menuitemIconHoverColor !default;
-$horizontalMenuRootMenuitemHoverBg: $menuitemHoverBg !default;
-$horizontalMenuRootMenuitemTextActiveColor: $menuitemTextActiveColor !default;
-$horizontalMenuRootMenuitemIconActiveColor: $menuitemIconActiveColor !default;
-$horizontalMenuRootMenuitemActiveBg: $menuitemActiveBg !default;
-
-//badge and tag
-$badgeBg: $primaryColor !default;
-$badgeTextColor: $primaryTextColor !default;
-$badgeMinWidth: 1.429rem !default;
-$badgeHeight: 1.429rem !default;
-$badgeFontWeight: 500 !default;
-$badgeFontSize: 1rem !default;
-
-$tagPadding: 0 0.429rem !default;
-
-//carousel
-$carouselIndicatorsPadding: 1rem !default;
-$carouselIndicatorBg: $shade200 !default;
-$carouselIndicatorHoverBg: rgba(68, 72, 109, 0.15) !default;
-$carouselIndicatorBorderRadius: 3px !default;
-$carouselIndicatorWidth: 1.429rem !default;
-$carouselIndicatorHeight: 0.572rem !default;
-
-//galleria
-$galleriaMaskBg: rgba(0, 0, 0, 0.9) !default;
-$galleriaCloseIconMargin: 0.5rem !default;
-$galleriaCloseIconFontSize: 2rem !default;
-$galleriaCloseIconBg: transparent !default;
-$galleriaCloseIconColor: $shade700 !default;
-$galleriaCloseIconHoverBg: rgba(68, 72, 109, 0.15) !default;
-$galleriaCloseIconHoverColor: $shade700 !default;
-$galleriaCloseIconWidth: 4rem !default;
-$galleriaCloseIconHeight: 4rem !default;
-$galleriaCloseIconBorderRadius: 50% !default;
-
-$galleriaItemNavigatorBg: transparent !default;
-$galleriaItemNavigatorColor: $shade700 !default;
-$galleriaItemNavigatorMargin: 0 0.5rem !default;
-$galleriaItemNavigatorFontSize: 2rem !default;
-$galleriaItemNavigatorHoverBg: rgba(68, 72, 109, 0.15) !default;
-$galleriaItemNavigatorHoverColor: $shade700 !default;
-$galleriaItemNavigatorWidth: 4rem !default;
-$galleriaItemNavigatorHeight: 4rem !default;
-$galleriaItemNavigatorBorderRadius: $borderRadius !default;
-
-$galleriaCaptionBg: rgba(0, 0, 0, 0.5) !default;
-$galleriaCaptionTextColor: $shade000 !default;
-$galleriaCaptionPadding: 1rem !default;
-
-$galleriaIndicatorsPadding: 1rem !default;
-$galleriaIndicatorBg: $shade200 !default;
-$galleriaIndicatorHoverBg: rgba(68, 72, 109, 0.15) !default;
-$galleriaIndicatorBorderRadius: 3px !default;
-$galleriaIndicatorWidth: 1.429rem !default;
-$galleriaIndicatorHeight: 0.286rem !default;
-$galleriaIndicatorsBgOnItem: rgba(0, 0, 0, 0.5) !default;
-$galleriaIndicatorBgOnItem: $shade600 !default;
-$galleriaIndicatorHoverBgOnItem: $shade700 !default;
-
-$galleriaThumbnailContainerBg: $solidSurfaceColor !default;
-$galleriaThumbnailContainerPadding: 1rem 0.25rem !default;
-$galleriaThumbnailNavigatorBg: transparent !default;
-$galleriaThumbnailNavigatorColor: $shade700 !default;
-$galleriaThumbnailNavigatorHoverBg: rgba(68, 72, 109, 0.15) !default;
-$galleriaThumbnailNavigatorHoverColor: $shade700 !default;
-$galleriaThumbnailNavigatorBorderRadius: 50% !default;
-$galleriaThumbnailNavigatorWidth: 2rem !default;
-$galleriaThumbnailNavigatorHeight: 2rem !default;
-
-//divider
-$dividerHorizontalMargin: 1rem 0 !default;
-$dividerHorizontalPadding: 0 1rem !default;
-$dividerVerticalMargin: 0 1rem !default;
-$dividerVerticalPadding: 1rem 0 !default;
-$dividerSize: 1px !default;
-$dividerColor: $shade300 !default;
-
-//avatar
-$avatarBg: $shade300 !default;
-$avatarTextColor: $textColor !default;
-
-//chip
-$chipBg: $shade300 !default;
-$chipTextColor: $textColor !default;
-$chipBorderRadius: 16px !default;
-$chipFocusBg: $shade400 !default;
-$chipFocusTextColor: $textColor !default;
-
-//scrollTop
-$scrollTopBg: rgba(0, 0, 0, 0.7) !default;
-$scrollTopHoverBg: rgba(0, 0, 0, 0.8) !default;
-$scrollTopWidth: 3rem !default;
-$scrollTopHeight: 3rem !default;
-$scrollTopBorderRadius: 50% !default;
-$scrollTopFontSize: 1.5rem !default;
-$scrollTopTextColor: $shade100 !default;
-
-//skeleton
-$skeletonBg: $shade300 !default;
-$skeletonAnimationBg: rgba(255, 255, 255, 0.4) !default;
-
-//splitter
-$splitterGutterBg: $shade100 !default;
-$splitterGutterHandleBg: $shade300 !default;
-
-//speeddial
-$speedDialButtonWidth: 4rem !default;
-$speedDialButtonHeight: 4rem !default;
-$speedDialButtonIconFontSize: 1.3rem !default;
-$speedDialActionWidth: 3rem !default;
-$speedDialActionHeight: 3rem !default;
-$speedDialActionBg: $shade600 !default;
-$speedDialActionHoverBg: $shade700 !default;
-$speedDialActionTextColor: #fff !default;
-$speedDialActionTextHoverColor: #fff !default;
-
-//dock
-$dockActionWidth: 4rem !default;
-$dockActionHeight: 4rem !default;
-$dockItemPadding: 0.5rem !default;
-$dockItemBorderRadius: $borderRadius !default;
-$dockCurrentItemMargin: 1.5rem !default;
-$dockFirstItemsMargin: 1.3rem !default;
-$dockSecondItemsMargin: 0.9rem !default;
-$dockBg: rgba(255, 255, 255, 0.1) !default;
-$dockBorder: 1px solid rgba(255, 255, 255, 0.2) !default;
-$dockPadding: 0.5rem 0.5rem !default;
-$dockBorderRadius: 0.5rem !default;
-
-//image
-$imageMaskBg: rgba(0, 0, 0, 0.9) !default;
-$imagePreviewToolbarPadding: 1rem !default;
-$imagePreviewIndicatorColor: #f8f9fa !default;
-$imagePreviewIndicatorBg: rgba(0, 0, 0, 0.5) !default;
-$imagePreviewActionIconBg: transparent !default;
-$imagePreviewActionIconColor: #f8f9fa !default;
-$imagePreviewActionIconHoverBg: rgba(255, 255, 255, 0.1) !default;
-$imagePreviewActionIconHoverColor: #f8f9fa !default;
-$imagePreviewActionIconWidth: 3rem !default;
-$imagePreviewActionIconHeight: 3rem !default;
-$imagePreviewActionIconFontSize: 1.5rem !default;
-$imagePreviewActionIconBorderRadius: 50% !default;
-
-:root {
-    font-family: 'Inter var', sans-serif;
-    font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
-    font-variation-settings: normal;
-    --font-family: 'Inter var', sans-serif;
-    --font-feature-settings: 'cv02', 'cv03', 'cv04', 'cv11';
-    --surface-a: #{$shade000};
-    --surface-b: #{$shade100};
-    --surface-c: #{$shade200};
-    --surface-d: #{$shade300};
-    --surface-e: #{$shade000};
-    --surface-f: #{$shade000};
-    --text-color: #{$shade700};
-    --text-color-secondary: #{$shade600};
-    --primary-color: #{$primaryColor};
-    --primary-color-text: #{$primaryTextColor};
-    --surface-0: #ffffff;
-    --surface-50: #e1e2e8;
-    --surface-100: #cbccd6;
-    --surface-200: #b4b6c5;
-    --surface-300: #9ea0b3;
-    --surface-400: #878aa2;
-    --surface-500: #717490;
-    --surface-600: #5a5e7f;
-    --surface-700: #44486d;
-    --surface-800: #3c3f60;
-    --surface-900: #343753;
-    --gray-50: #e1e2e8;
-    --gray-100: #cbccd6;
-    --gray-200: #b4b6c5;
-    --gray-300: #9ea0b3;
-    --gray-400: #878aa2;
-    --gray-500: #717490;
-    --gray-600: #5a5e7f;
-    --gray-700: #44486d;
-    --gray-800: #3c3f60;
-    --gray-900: #343753;
-    --content-padding: #{$panelContentPadding};
-    --inline-spacing: #{$inlineSpacing};
-    --border-radius: #{$borderRadius};
-    --surface-ground: linear-gradient(180deg, #f6f9fc 0%, #ececf9 100%);
-    --surface-section: transparent;
-    --surface-card: rgba(255, 255, 255, 0.9);
-    --surface-toast: #ffffff;
-    --surface-overlay: #ececf9;
-    --surface-border: rgba(68, 72, 109, 0.2);
-    --surface-hover: rgba(68, 72, 109, 0.07);
-    --focus-ring: #{$focusShadow};
-    --maskbg: #{$maskBg};
-    --highlight-bg: #{$highlightBg};
-    --highlight-text-color: #{$highlightTextColor};
-    color-scheme: light;
-}