/**
 *  Button settings
 *  Default
 *
 */

// Function dependencies
@import '../functions/colors';
@import '../functions/spacing';

$context--button-line-height: 1.3;
$context--button-font-size-xsmall: .875rem;
$context--button-font-size-small: .875rem;
$context--button-font-size-large: 1.125rem;
$context--button-icon-margin: spacing(8);
$context--button-justify-content: center;
$context--button-border-radius: 32px;
$context--button-border-width-style: 4px solid;
$context--button-font-size-normal: .875rem;
$context--button-padding: 16px 32px;
$context--button-padding-xsmall: 2px 8px;
$context--button-padding-small: 8px 16px;
$context--button-padding-large: 10px 35px;
$context--button-font-family: $t-a-typography-font-family-default;
$context--button-transition: all 0.2s;
$context--button-brand-color: color('universal-blue');

// Button Themes
// Variables to set themes styles

$context--button-default: (
	'color': color('white'),
	'backgroundColor': $context--button-brand-color,
	'backgroundImage': none,
	'border': $context--button-border-width-style transparent,
	'boxShadow': 0 0 0 1px $context--button-brand-color,
	'visitedColor': color('white'),
	'hoverColor': $context--button-brand-color,
	'hoverBorder': $context--button-border-width-style color('white'),
	'hoverBoxShadow': 0 0 0 1px $context--button-brand-color,
	'hoverBackgroundColor': color('white'),
	'hoverBackgroundImage': none,
	'hoverTextDecoration': none,
	'focusBorder': $context--button-border-width-style $context--focus-color,
	'focusTextDecoration': none,
	'focusBoxShadow': none,
	'focusOutline': none,
	'fontWeight': $t-a-typography-font-weight-bold,
);

$context--button-primary: $context--button-default;

$context--button-secondary: (
	'color': $context--button-brand-color,
	'border': $context--button-border-width-style color('white'),
	'visitedColor': $context--button-brand-color,
	'backgroundColor': color('white'),
	'hoverColor': color('white'),
	'hoverBorder': $context--button-border-width-style $context--button-brand-color,
	'hoverBoxShadow': none,
	'hoverBackgroundColor': $context--button-brand-color,
	'fontWeight': $t-a-typography-font-weight-bold,
);

$context--button-tertiary: (
	'color': color('grey-dark2'),
	'border': $context--button-border-width-style transparent,
	'boxShadow': none,
	'visitedColor': color('grey-dark2'),
	'backgroundColor': color('blue-light1'),
	'hoverColor': color('white'),
	'hoverBorder': $context--button-border-width-style $context--button-brand-color,
	'hoverBoxShadow': none,
	'hoverBackgroundColor': $context--button-brand-color,
	'fontWeight': $t-a-typography-font-weight-bold,
);

$context--button-contrast: (
	'color': white,
	'backgroundColor': transparent,
	'backgroundImage': none,
	'border': $context--button-border-width-style white,
	'visitedColor': white,
	'hoverColor': greyscale(),
	'hoverBorder': $context--button-border-width-style white,
	'hoverBackgroundColor': white,
	'hoverBackgroundImage': none,
	'focusBorder': $context--button-border-width-style white,
	'fontWeight': normal,
);

$context--button-disabled: (
	'color': greyscale(),
	'backgroundColor': transparent,
	'backgroundImage': none,
	'border': $context--button-border-width-style greyscale(80),
	'visitedColor': greyscale(),
	'opacity': 0.7,
	'hoverColor': greyscale(),
	'hoverBorder': $context--button-border-width-style greyscale(80),
	'hoverBackgroundColor': transparent,
	'hoverBackgroundImage': none,
	'hoverTextDecoration': none,
	'focusBorder': $context--button-border-width-style greyscale(80),
	'focusTextDecoration': none,
	'fontWeight': normal,
);