/** Import Compass */
/* ========================================================================== Icon Library Mixin ========================================================================== */
/* ========================================================================== Shadows ========================================================================== */
/* ========================================================================== Buttons ========================================================================== */
/** Core Button Component This is a core button component.  This only contains the relevant structural styles necessary to render a button.  This class can be applied to buttons, links, or input buttons. Example HTML: <button class="t-Button [modifiers]" type="submit">Button Label</button> <a class="t-Button [modifiers]" href="#" role="button">Button Label</a> <input class="t-Button [modifiers]" type="submit" value="Button Label"> */
/** Button 1. Use proper box-model for button sizing across all browsers 2. Reset webkit based browser appearance 4. Inherit font from ancestor 5. Normalize line-height 6. Prevent text selection on buttons 7. Prevent wrapping of text in buttons */
.t-Button { box-sizing: border-box; /* 1 */ -webkit-appearance: none; /* 2 */ background: transparent; background-clip: padding-box; border: .1rem solid; cursor: pointer; display: inline-block; font: inherit; /* 4 */ line-height: normal; /* 5 */ margin: 0; padding: .4rem 1.2rem; position: relative; text-align: center; text-decoration: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; /* 6 */ vertical-align: middle; white-space: nowrap; /* 7 */ }

.t-Button .t-Icon { vertical-align: top; }

.apex-icons-fontawesome .t-Button .t-Icon { padding: .1rem 0; }

/** Hover, Focus and Click States */
.t-Button:hover, .t-Button:focus, .t-Button:active { text-decoration: none; }

/** Disabled States */
.t-Button.is-disabled, .t-Button[disabled], .a-Button.is-disabled, .a-Button[disabled] { opacity: .5; pointer-events: none; cursor: not-allowed; }

/** Firefox padding / border issue */
.t-Button::-moz-focus-inner { border: 0; padding: 0; }

/** Spacing between buttons */
.t-Button + .t-Button { margin-left: .4rem; }

.u-RTL .t-Button + .t-Button { margin-right: .4rem; margin-left: 0px; }

.t-Button + .t-Button.t-Button--pill, .t-Button + .t-Button.t-Button--pillEnd { margin-left: -.1rem !important; }

.u-RTL .t-Button + .t-Button.t-Button--pill, .u-RTL .t-Button + .t-Button.t-Button--pillEnd { margin-right: -.1rem !important; margin-left: 0px !important; }

.t-Button + .t-Button.t-Button--stretch { margin-left: 0 !important; }

.u-RTL .t-Button + .t-Button.t-Button--stretch { margin-right: 0 !important; }

/** Pill Buttons */
.t-Button--pill:not(.t-Button--pillStart):not(.t-Button--pillEnd) { border-radius: 0 !important; margin-right: -.1rem !important; }

.t-Button--pillStart { border-top-right-radius: 0 !important; border-bottom-right-radius: 0 !important; margin-right: 0 !important; }

.t-Button--pillEnd { border-top-left-radius: 0 !important; border-bottom-left-radius: 0 !important; margin-left: 0 !important; }

.t-Button--pillStart + .t-Button--pillEnd { margin-left: -.1rem !important; }

.t-Button--padLeft { margin-left: .4rem !important; }

.t-Button--padRight { margin-right: .4rem !important; }

.t-Button--gapLeft { margin-left: 1.2rem !important; }

.t-Button--gapRight { margin-right: 1.2rem !important; }

.t-Button--gapTop { margin-top: 1.2rem !important; }

.t-Button--gapBottom { margin-bottom: 1.2rem !important; }

.t-Button--padTop { margin-top: 0.8rem !important; }

.t-Button--padBottom { margin-bottom: 0.8rem !important; }

.t-Button-badge { padding: 0 .6rem; display: inline-block; margin-left: .4rem; }

.t-Button-badge:empty { display: none; }

/** Stretch Button */
.t-Button--stretch { width: 100%; display: block; margin-bottom: .8rem; }

.t-Button--stretch:last-child { margin-bottom: 0; }

/** Buttons with Icons or Icon and Text */
.t-Button--icon { line-height: 1.6rem; text-align: center; min-width: 4.0rem; }

.t-Button--icon.t-Button--slim { padding-right: .8rem; padding-left: .8rem; min-width: 3.2rem; }

/** Buttons with Icons or Icon and Text */
.t-Button--iconLeft .t-Icon { margin-right: .4rem; }

.u-RTL .t-Button--iconLeft .t-Icon { margin-right: 0px; margin-left: .4rem; }

.t-Button--iconLeft .t-Icon.t-Icon--right { display: none; }

.t-Button--iconRight .t-Icon { margin-left: .4rem; }

.u-RTL .t-Button--iconRight .t-Icon { margin-left: 0px; margin-right: .4rem; }

.t-Button--iconRight .t-Icon.t-Icon--left { display: none; }

.t-Button { font-size: 1.2rem; line-height: 1.6rem; padding: .8rem 1.2rem; font-weight: 400; }

.t-Button--hot { font-weight: bold; }

/** Button Label */
/** Tiny Button */
.t-Button--tiny { font-size: 1.0rem; line-height: 1.2rem; padding: 0.4rem 0.6rem; }

.t-Button--tiny .t-Icon { font-size: 1.2rem; line-height: 1; }

/** Small Button */
.t-Button--small { font-size: 1.1rem; line-height: 1.6rem; padding: .4rem .8rem; }

.t-Button--small .t-Icon { font-size: 1.2rem; line-height: inherit; }

.t-Button--tiny, .t-Button--small { min-width: 0; }

/** Hide Show Icon */
.t-Button--hideShow { font-size: 1.1rem; line-height: 1.4rem; padding: .4rem; min-width: 2.4rem; }

.t-Button--hideShow.t-Button { border-radius: 2.4rem; }

/** Large Button */
.t-Button--large { padding: 1.2rem 1.6rem; line-height: 1.6rem; font-size: 1.4rem; }

.t-Button--large.t-Button--withIcon { line-height: 1.6rem; padding: 1.2rem 1.4rem; }

/** Nav Control Button */
.t-Button.t-Button--header { padding: 0.8rem; vertical-align: top; box-shadow: none; text-align: center; }

.t-Button.t-Button--header + .t-Button.t-Button--header { margin: 0; }

.t-Button.t-Button--header.t-Button--headerRight { border-radius: 0; }

.u-RTL .t-Button.t-Button--header.t-Button--headerRight { right: 0px; }

.apex-icons-fontawesome .t-Button.t-Button--header .t-Icon.fa { font-size: 1.4rem; }

.t-Button--navBar { min-width: 40px; }

.t-Button--navBar .t-Button-badge { margin-left: 4px; font-size: 11px; }

.t-Button--navBar .t-Icon { line-height: 16px; }

.t-Button--navBar .t-Icon.fa, .t-Button--navBar .t-Icon.a-Icon { margin-right: 4px; }

.u-RTL .t-Button--navBar .t-Icon.fa, .u-RTL .t-Button--navBar .t-Icon.a-Icon { margin-right: 0px; margin-left: 4px; }

.t-Button--headerUser { text-transform: lowercase; cursor: default; }

/******************************************************************************
Button in Region Header
******************************************************************************/
.t-Region-headerItems--buttons .t-Button + .js-maximizeButtonContainer { margin-left: 1.1rem; }

.js-maximizeButtonContainer .t-Button { margin-right: 0.4rem; }

.t-Region-headerItems--buttons .t-Button--icon + .t-Button--icon { margin-left: 0; }

.t-Region--hideShow .t-Region-headerItems--buttons .t-Button:last-child { margin-right: 1.1rem; }

.t-Button--noUI:not(.t-Button--simple), .t-Button--noUI:not(.t-Button--simple):hover, .t-Button--noUI:not(.t-Button--simple):active { text-shadow: none; background-color: transparent; box-shadow: none; }

/* Radio Button Pills ========================================================================== */
.apex-button-group label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc label { min-width: 48px; padding: 4px 8px; }

.apex-button-group .apex-item-option, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc .apex-item-option { padding: 0; }

.apex-button-group input + label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label { padding: 4px 8px; width: 100%; text-align: center; outline: none !important; }

.apex-button-group input + label:before, .apex-button-group input + label:after, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:before, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label:after { display: none; }

.apex-button-group .apex-item-option label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc .apex-item-option label { margin: 0; display: block; }

.apex-button-group .apex-item-option:not(:last-of-type):not(:first-of-type) label, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc .apex-item-option:not(:last-of-type):not(:first-of-type) label { border-radius: 0; }

.apex-button-group input + label .t-Icon, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc input + label .t-Icon { vertical-align: top; }

/* Radio Button Pills with Radio/Check ========================================================================== */
.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc.apex-item-checkbox input + label { text-align: left; padding-left: 24px; }

.t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc.apex-item-checkbox input + label:before, .t-Form-fieldContainer--radioButtonGroup .apex-item-group--rc.apex-item-checkbox input + label:after { display: block; top: 4px; left: 4px; }

@media (max-width: 640px) { .t-Button--navBar .t-Button-badge { position: absolute; margin-left: 0; top: 4px; right: 4px; font-size: 10px; line-height: 1.4rem; padding: 0 0.4rem; }
  .t-Button--navBar .t-Button-label { display: none; }
  .t-Button--navBar .a-Icon.icon-down-arrow { margin-right: -4px; } .apex-item-group--rc { /* .apex-item-option:first-child:nth-last-child(1) { width: 100%; } */ }
  .apex-item-group--rc .apex-item-grid { overflow: hidden; display: block; }
  .apex-item-group--rc .apex-item-grid-row { display: inline; }
  .apex-item-group--rc .apex-item-option { float: left; display: block; }
  .apex-item-group--rc .apex-item-option:first-child:nth-last-child(2), .apex-item-group--rc .apex-item-option:first-child:nth-last-child(2) ~ .apex-item-option { width: 50%; }
  .apex-item-group--rc .apex-item-option:first-child:nth-last-child(3), .apex-item-group--rc .apex-item-option:first-child:nth-last-child(3) ~ .apex-item-option { width: 33.3333%; }
  .apex-item-group--rc .apex-item-option:first-child:nth-last-child(4), .apex-item-group--rc .apex-item-option:first-child:nth-last-child(4) ~ .apex-item-option { width: 50%; }
  .apex-item-group--rc .apex-item-option:first-child:nth-last-child(5), .apex-item-group--rc .apex-item-option:first-child:nth-last-child(5) ~ .apex-item-option { width: 50%; }
  .apex-item-group--rc .apex-item-option:first-child:nth-last-child(6), .apex-item-group--rc .apex-item-option:first-child:nth-last-child(6) ~ .apex-item-option { width: 33.3333%; }
  .apex-item-group--rc .apex-item-option:first-child:nth-last-child(7), .apex-item-group--rc .apex-item-option:first-child:nth-last-child(7) ~ .apex-item-option { width: 50%; }
  .apex-item-group--rc .apex-item-option:first-child:nth-last-child(8), .apex-item-group--rc .apex-item-option:first-child:nth-last-child(8) ~ .apex-item-option { width: 50%; } }

@media screen and (-ms-high-contrast: active) { .t-Button, .a-Button { border: 1px solid; } }
