/*******************************
            Button
*******************************/

/*-------------------
       Element
--------------------*/
@buttonBorderRadius: @circularRadius;
@buttonTextTransform: uppercase;
@buttonBackgroundColor: #FFFFFF;
@buttonBackgroundImage: none;
@buttonFontWeight: bold;
@buttonTextColor: rgba(0, 0, 0, 0.6);
@boxShadow:
  0px 0px 0px 2px rgba(0, 0, 0, 0.2) inset
;

/* Padding */
@buttonVerticalPadding: 1.25em;
@buttonHorizontalPadding: 3em;

/* Icon */
@buttonIconOpacity: 0.8;
@buttonIconDistance: 0.4em;
@buttonIconTransition: opacity @defaultDuration @defaultEasing;
@buttonIconMargin: 0em @buttonIconDistance 0em -(@buttonIconDistance / 2);
@buttonIconVerticalAlign: top;

/*-------------------
        Group
--------------------*/

@buttonVerticalBoxShadow: 0px 0px 0px 1px @borderColor inset;


/*-------------------
        States
--------------------*/

@buttonHoverBackgroundColor: #FAFAFA;
@buttonHoverBackgroundImage: none;
@buttonHoverBoxShadow: 0px 0px 0px 2px rgba(0, 0, 0, 0.3) inset;

@buttonDownBackgroundColor: #F0F0F0;
@buttonDownBackgroundImage: none;
@downBoxShadow: 0px 0px 0px 2px rgba(0, 0, 0, 0.35) inset !important;

@buttonActiveBackgroundColor: #DDDDDD;
@buttonActiveBackgroundImage: none;
@buttonActiveBoxShadow: 0px 0px 0px 2px rgba(0, 0, 0, 0.3) inset !important;

@loadingBackgroundColor: #FFFFFF;

/*-------------------
        Types
--------------------*/

/* Labeled Icon */
@buttonLabeledIconWidth: 1em + (@buttonVerticalPadding * 2);
@buttonLabeledIconBackgroundColor: transparent;
@buttonLabeledIconPadding: (@buttonHorizontalPadding + 1em);
@buttonLabeledIconBorder: rgba(0, 0, 0, 0.05);
@buttonLabeledIconColor: '';

@buttonLabeledIconLeftShadow: none;
@buttonLabeledIconRightShadow: none;

/* Basic */
@buttonBasicBoxShadow: 0px 0px 0px 1px @borderColor;
@iconOffset: 0.05em;
@buttonBasicLoadingColor: #FFFFFF;

@buttonBasicHoverBackground: #FAFAFA;
@basicHoverBoxShadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.15);

@buttonBasicDownBackground: rgba(0, 0, 0, 0.02);
@basicDownBoxShadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.2);

@buttonBasicActiveBackground: @transparentBlack;
@basicActiveColor: @selectedTextColor;

/* Basic Inverted */
@buttonBasicInvertedBackground: transparent;
@basicInvertedHoverBackground: transparent;
@buttonBasicInvertedDownBackground: @transparentWhite;
@buttonBasicInvertedActiveBackground: @transparentWhite;

@buttonBasicInvertedBoxShadow: 0px 0px 0px 2px rgba(255, 255, 255, 0.5);
@buttonBasicInvertedHoverBoxShadow: 0px 0px 0px 2px @selectedWhiteBorderColor;
@buttonBasicInvertedDownBoxShadow: 0px 0px 0px 2px @selectedWhiteBorderColor;
@buttonBasicInvertedActiveBoxShadow: 0px 0px 0px 2px @selectedWhiteBorderColor;

@buttonBasicInvertedColor: @darkWhite;
@buttonBasicInvertedHoverColor: @darkWhiteHover;
@buttonBasicInvertedDownColor: @darkWhiteActive;
@buttonBasicInvertedActiveColor: @buttonInvertedTextColor;


/* Basic Group */
@buttonBasicGroupBorder: 1px solid @borderColor;
@buttonBasicGroupBoxShadow: 0px 0px 0px 1px @borderColor;

/*-------------------
      Variations
--------------------*/

/* Colors */
@buttonColoredBackgroundImage: linear-gradient(rgba(255, 255, 255, 0.05), rgba(0, 0, 0, 0.1));
@buttonColoredBoxShadow: @buttonShadowBoxShadow;

/* Compact */
@buttonCompactVerticalPadding: (@buttonVerticalPadding * 0.75);
@buttonCompactHorizontalPadding: (@buttonHorizontalPadding * 0.75);

/* Attached */
@buttonAttachedOffset: -1px;
@buttonAttachedBoxShadow: 0px 0px 0px 1px rgba(0, 0, 0, 0.1);
@buttonAttachedHorizontalPadding: 0.75em;

/* Floated */
@buttonFloatedMargin: 0.25em;

/* Animated */
@buttonAnimationDuration: 0.3s;
@buttonAnimationEasing: ease;
@buttonFadeScaleHigh: 1.5;
@buttonFadeScaleLow: 0.75;

/* Sizing */
@mini: 0.7rem;
@tiny: 0.8rem;
@small: 0.875rem;
@medium: 1rem;
@large: 1.125rem;
@big: 1.25rem;
@huge: 1.375rem;
@massive: 1.5rem;