@import "./react-common-breakpoints.less";


@defaultFont: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;

/****************************************************
 *                    Buttons                       *
 ****************************************************/


@buttonFocusOutlineDarkBackground: var(--pxt-neutral-background1) solid 1px;
@buttonFocusOutlineLightBackground: var(--pxt-neutral-stencil1) solid 1px;

/****************************************************
 *                    Modals                        *
 ****************************************************/

@modalSeparatorBorder: 1px solid var(--pxt-neutral-stencil1);
@modalDimmerZIndex: 1000;
@modalFullscreenZIndex: @modalDimmerZIndex;

/****************************************************
 *                    Checkboxes                    *
 ****************************************************/

@checkboxFocusOutline: var(--pxt-neutral-stencil1) solid 1px;

/****************************************************
 *              EditorToggle                        *
 ****************************************************/

@editorToggleBorderWidth: 3px;

/****************************************************
 *                 High Contrast                    *
 ****************************************************/

@highContrastTextColor: #ffffff;
@highContrastBackgroundColor: #000000;
@highContrastHighlightColor: #ffff00;
@highContrastFocusOutline: 2px solid @highContrastHighlightColor;
@highContrastFocusZIndex: 1;

/****************************************************
 *                 Extension Card                   *
 ****************************************************/
@loadingAnimation: linear-gradient(-45deg, #ffffff46, #f3f3f350, #dee2ff6e, #f1f1f149);