/*******************************

Segment

*******************************/

/*——————-

Element

——————–*/

@background: @white; @borderWidth: 1px; @border: none;

@borderShadow: 0px 0px 0px @borderWidth @borderColor; @boxShadow:

@borderShadow,
@subtleShadow

; @verticalPadding: 1em; @horizontalPadding: 1em;

@margin: 1rem; @borderRadius: @defaultBorderRadius;

/*——————-

Coupling

——————–*/

/* Page Grid Segment */ @pageGridMargin: (2 * @verticalPadding);

/*******************************

States

*******************************/

/* Loading Dimmer */ @loaderDimmerColor: rgba(255, 255, 255, 0.8); @loaderDimmerZIndex: 100;

/* Loading Spinner */ @loaderSize: 3em; @loaderOffset: -(@loaderSize / 2); @loaderMargin: @loaderOffset 0em 0em @loaderOffset; @loaderLineZIndex: 101;

/*******************************

Variations

*******************************/

/* Piled */ @piledZIndex: auto; @piledMargin: 3em; @piledBoxShadow: 0px 0px 1px 1px @borderColor; @piledDegrees: 1.2deg;

/* Circular */ @circularPadding: 2em;

/* Stacked */ @stackedHeight: 6px; @stackedPageBackground: @subtleTransparentBlack; @stackedPadding: @verticalPadding + (0.4em); @tallStackedPadding: @verticalPadding + (0.8em);

/* Raised */ @raisedShadow: 0px 1px 4px 0px rgba(0, 0, 0, 0.15); @raisedBoxShadow:

@borderShadow,
@raisedShadow

;

/* Attached */ @attachedTopOffset: 0px; @attachedBottomOffset: 0px; @attachedHorizontalOffset: -1px; @attachedWidth: ~“calc(100% + ”-@attachedHorizontalOffset * 2~“)”; @attachedBoxShadow: none; @attachedBorder: 1px solid @solidBorderColor; @attachedBottomBoxShadow:

@attachedBoxShadow,
@subtleShadow

;

/* Colors */ @coloredBorderSize: 2px; @coloredBorderRadius: @borderRadius;

/* Ordinality */ @secondaryBackground: FAF9FA; @secondaryColor: @textColor;

@tertiaryBackground: EBEBEB; @tertiaryColor: @lightTextColor;

@secondaryInvertedBackground: linear-gradient(rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 100%); @secondaryInvertedColor: @offWhite;

@tertiaryInvertedBackground: linear-gradient(rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0.5) 100%); @tertiaryInvertedColor: @darkWhite;