/*******************************
             Popup
*******************************/

/*-------------------
       Element
--------------------*/

@popupZIndex: 1900;
@popupBackground: @white;

@popupMaxWidth: 250px;
@popupBorderColor: @solidBorderColor;
@popupBorderWidth: 1px;
@popupBoxShadow: @floatingShadow;
@popupColor: @textColor;

@popupVerticalPadding: 0.833em;
@popupHorizontalPadding: 1em;
@popupFontWeight: @normal;
@popupFontStyle: @normal;
@popupBorderRadius: @defaultBorderRadius;

/*-------------------
       Parts
--------------------*/

/* Placement */
@popupArrowSize: @relative10px;
@popupArrowWidth: 1em;
@popupArrowDistanceFromEdge: 1em;
@popupBoxArrowOffset: 0em;
@popupPopupDistanceAway: @popupArrowSize;


/* Header */
@popupHeaderFontFamily: @headerFont;
@popupHeaderFontWeight: @bold;
@popupHeaderFontSize: @relativeLarge;
@popupHeaderDistance: @relative7px;
@popupHeaderLineHeight: 1.2;

/* Content Border */
@popupBorder: @popupBorderWidth solid @popupBorderColor;

/* Arrow */
@popupArrowBackground: @popupBackground;
@popupArrowZIndex: 2;
@popupArrowJitter: 0.05em;
@popupArrowOffset: -(@popupArrowSize / 2) + @popupArrowJitter;

@popupArrowStroke: @popupBorderWidth;
@popupArrowColor: darken(@popupBorderColor, 10);

/* Arrow color by position */
@popupArrowTopBackground: @popupArrowBackground;
@popupArrowCenterBackground: @popupArrowBackground;
@popupArrowBottomBackground: @popupArrowBackground;

@popupArrowBoxShadow: @popupArrowStroke @popupArrowStroke 0px 0px @popupArrowColor;
@popupLeftArrowBoxShadow: @popupArrowStroke -@popupArrowStroke 0px 0px @popupArrowColor;
@popupRightArrowBoxShadow: -@popupArrowStroke @popupArrowStroke 0px 0px @popupArrowColor;
@popupBottomArrowBoxShadow: -@popupArrowStroke -@popupArrowStroke 0px 0px @popupArrowColor;

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

/* Tooltip */
@popupTooltipBackground: @popupBackground;
@popupTooltipBorderRadius: @popupBorderRadius;
@popupTooltipPadding: @popupVerticalPadding @popupHorizontalPadding;
@popupTooltipFontWeight: @popupFontWeight;
@popupTooltipFontStyle: @popupFontStyle;
@popupTooltipColor: @popupColor;
@popupTooltipBorder: @popupBorder;
@popupTooltipBoxShadow: @popupBoxShadow;
@popupTooltipMaxWidth: none;
@popupTooltipFontSize: @medium;
@popupTooltipLineHeight: @lineHeight;
@popupTooltipDistanceAway: @relative7px;
@popupTooltipZIndex: 1;
@popupTooltipDuration: @defaultDuration;
@popupTooltipEasing: @defaultEasing;

/* Inverted */
@popupTooltipInvertedBackground: @popupInvertedBackground;
@popupTooltipInvertedColor: @popupInvertedColor;
@popupTooltipInvertedBorder: @popupInvertedBorder;
@popupTooltipInvertedBoxShadow: @popupInvertedBoxShadow;
@popupTooltipInvertedHeaderBackground: @popupInvertedHeaderBackground;
@popupTooltipInvertedHeaderColor: @popupInvertedHeaderColor;

/* Arrow */
@popupTooltipArrowVerticalOffset: -@2px;
@popupTooltipArrowHorizontalOffset: -@1px;
@popupTooltipArrowBoxShadow: @popupArrowBoxShadow;
@popupTooltipArrowBackground: @popupArrowBackground;
@popupTooltipArrowTopBackground: @popupArrowTopBackground;
@popupTooltipArrowCenterBackground: @popupArrowCenterBackground;
@popupTooltipArrowBottomBackground: @popupArrowBottomBackground;

/*-------------------
       Coupling
--------------------*/

/* Grid Inside Popup */
@popupNestedGridMargin: -0.7rem -0.875rem; /* (padding * @medium) */
@popupNestedGridWidth: ~"calc(100% + 1.75rem)";

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

@popupLoadingZIndex: -1;

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

/* Wide */
@popupWideWidth: 350px;
@popupVeryWideWidth: 550px;

/* Inverted */
@popupInvertedBackground: @black;
@popupInvertedColor: @white;
@popupInvertedBorder: none;
@popupInvertedBoxShadow: none;

@popupInvertedHeaderBackground: none;
@popupInvertedHeaderColor: @white;
@popupInvertedArrowColor: @popupInvertedBackground;

/* Arrow color by position */
@popupInvertedArrowTopBackground: @popupInvertedBackground;
@popupInvertedArrowCenterBackground: @popupInvertedBackground;
@popupInvertedArrowBottomBackground: @popupInvertedBackground;
