@use 'color-vars' as *;

$btn-font-family:                      var(--c8y-btn-font-family);
$btn-font-weight:                      var(--c8y-btn-font-weight);
$btn-font-size-base:                   var(--c8y-btn-font-size-base);
$btn-font-size-large:                  var(--c8y-btn-font-size-large);
$btn-font-size-small:                  var(--c8y-btn-font-size-small);
$btn-font-size-xs:                     var(--c8y-btn-font-size-xs);
$btn-line-height-base:                 var(--c8y-btn-line-height-base);
$btn-line-height-large:                var(--c8y-btn-line-height-large);
$btn-line-height-small:                var(--c8y-btn-line-height-small);
$btn-line-height-xs:                   var(--c8y-btn-line-height-xs);
$btn-padding-vertical:                 var(--c8y-btn-padding-base-vertical);
$btn-padding-horizontal:               var(--c8y-btn-padding-base-horizontal);
$btn-padding-large-vertical:           var(--c8y-btn-padding-large-vertical);
$btn-padding-large-horizontal:         var(--c8y-btn-padding-large-horizontal);
$btn-padding-small-vertical:           var(--c8y-btn-padding-small-vertical);
$btn-padding-small-horizontal:         var(--c8y-btn-padding-small-horizontal);
$btn-padding-xs-vertical:              var(--c8y-btn-padding-xs-vertical);
$btn-padding-xs-horizontal:            var(--c8y-btn-padding-xs-horizontal);
$btn-padding-icon-horizontal:          var(--c8y-btn-padding-icon-horizontal);
$btn-padding-icon-vertical:            var(--c8y-btn-padding-icon-vertical);

$btn-border-radius-base:               calc( var(--btn-border-radius-base, var(--c8y-btn-border-radius-base)) * 1px );
$btn-border-radius-large:              var(--c8y-btn-border-radius-large);
$btn-border-radius-small:              var(--c8y-btn-border-radius-small);
$btn-border-radius-xs:                 var(--c8y-btn-border-radius-xs);
$btn-border-radius-pill:               var(--c8y-btn-border-radius-pill);
$btn-group-border-radius:              var(--c8y-btn-group-border-radius);

$btn-shadow:                           var(--c8y-btn-shadow-default);
$btn-transition:                       var(--c8y-btn-transition-default);

// Switch
$switch-width:                         60px;
$switch-height:                        30px;
$switch-radius:                        30px;
$switch-sm:                            20px;
$padding-btn-xs-horizontal:            12px;
$padding-btn-small-horizontal:         14px;

// Colors
$btn-default-color-default:                           var(--c8y-btn-default-color-default);
$btn-default-background-default:                      var(--c8y-btn-default-background-default);
$btn-default-border-color-default:                    var(--c8y-btn-default-border-color-default);

$btn-default-color-hover:                             var(--c8y-btn-default-color-hover);
$btn-default-background-hover:                        var(--c8y-btn-default-background-hover);
$btn-default-border-color-hover:                      var(--c8y-btn-default-border-color-hover);

$btn-default-color-focus:                             var(--c8y-btn-default-color-focus);
$btn-default-background-focus:                        var(--c8y-btn-default-background-focus);
$btn-default-border-color-focus:                      var(--c8y-btn-default-border-color-focus);

$btn-default-color-active:                            var(--c8y-btn-default-color-active);
$btn-default-background-active:                       var(--c8y-btn-default-background-active);
$btn-default-border-color-active:                     var(--c8y-btn-default-border-color-active);

$btn-primary-color-default:                           var(--c8y-btn-primary-color-default);
$btn-primary-background-default:                      var(--c8y-btn-primary-background-default);
$btn-primary-border-color-default:                    var(--c8y-btn-primary-border-color-default);

$btn-primary-color-hover:                             var(--c8y-btn-primary-color-hover);
$btn-primary-background-hover:                        var(--c8y-btn-primary-background-hover);
$btn-primary-border-color-hover:                      var(--c8y-btn-primary-border-color-hover);

$btn-primary-color-focus:                             var(--c8y-btn-primary-color-focus);
$btn-primary-background-focus:                        var(--c8y-btn-primary-background-focus);
$btn-primary-border-color-focus:                      var(--c8y-btn-primary-border-color-focus);

$btn-primary-color-active:                            var(--c8y-btn-primary-color-active);
$btn-primary-background-active:                       var(--c8y-btn-primary-background-active);
$btn-primary-border-color-active:                     var(--c8y-btn-primary-border-color-active);

$btn-accent-color-default:                            var(--c8y-btn-accent-color-default);
$btn-accent-background-default:                       var(--c8y-btn-accent-background-default);
$btn-accent-border-color-default:                     var(--c8y-btn-accent-border-color-default);

$btn-accent-color-hover:                             var(--c8y-btn-accent-color-hover);
$btn-accent-background-hover:                        var(--c8y-btn-accent-background-hover);
$btn-accent-border-color-hover:                      var(--c8y-btn-accent-border-color-hover);

$btn-accent-color-focus:                             var(--c8y-btn-accent-color-focus);
$btn-accent-background-focus:                        var(--c8y-btn-accent-background-focus);
$btn-accent-border-color-focus:                      var(--c8y-btn-accent-border-color-focus);

$btn-accent-color-active:                            var(--c8y-btn-accent-color-active);
$btn-accent-background-active:                       var(--c8y-btn-accent-background-active);
$btn-accent-border-color-active:                     var(--c8y-btn-accent-border-color-active);

$btn-danger-color-default:                            var(--c8y-btn-danger-color-default);
$btn-danger-background-default:                       var(--c8y-btn-danger-background-default);
$btn-danger-border-color-default:                     var(--c8y-btn-danger-border-color-default);

$btn-danger-color-hover:                              var(--c8y-btn-danger-color-hover);
$btn-danger-background-hover:                         var(--c8y-btn-danger-background-hover);
$btn-danger-border-color-hover:                       var(--c8y-btn-danger-border-color-hover);

$btn-danger-color-focus:                              var(--c8y-btn-danger-color-focus);
$btn-danger-background-focus:                         var(--c8y-btn-danger-background-focus);
$btn-danger-border-color-focus:                       var(--c8y-btn-danger-border-color-focus);

$btn-danger-color-active:                             var(--c8y-btn-danger-color-active);
$btn-danger-background-active:                        var(--c8y-btn-danger-background-active);
$btn-danger-border-color-active:                      var(--c8y-btn-danger-border-color-active);

$btn-link-disabled-color:                             $component-color-disabled;