@use 'layout-vars';
@use 'components-vars';
@use 'typography-vars';

// label
$form-label-text-transform:                 var(--c8y-form-label-text-transform);
$form-label-font-weight:                    var(--c8y-form-label-font-weight);
$form-label-font-size:                      var(--c8y-form-label-font-size);
$form-label-color:                          var(--c8y-form-label-color);

//legend
$form-legend-color:                         var(--c8y-form-legend-color);
$form-legend-text-transform:                var(--c8y-form-legend-text-transform);
$form-legend-font-weight:                   var(--c8y-form-legend-font-weight);
$form-legend-font-size:                     var(--c8y-form-legend-font-size);

/* Form-control */
$form-control-color-default:                var(--c8y-form-control-color-default);
$form-control-background-default:           var(--c8y-form-control-background-default);
$form-control-border-color-default:         var(--c8y-form-control-border-color-default);

$form-control-border-color-focus:           var(--c8y-form-control-border-color-focus);
$form-control-background-focus:             var(--c8y-form-control-background-focus);
$form-control-color-focus:                  var(--c8y-form-control-color-focus);

$form-control-placeholder-color:            var(--c8y-form-control-placeholder-color);
$form-control-placeholder-font-style:       var(--c8y-form-control-placeholder-font-style);

$form-control-disabled-opacity:             var(--c8y-form-control-disabled-opacity);

$form-control-background-disabled:          var(--c8y-form-control-background-disabled);
$form-control-color-disabled:               var(--c8y-form-control-color-disabled);



$form-control-validation-error:             var(--palette-status-danger, var(--c8y-form-validation-color-error));
$form-control-validation-warning:           var(--palette-status-warning, var(--c8y-form-validation-color-warning));
$form-control-validation-success:           var(--palette-status-success, var(--c8y-form-validation-color-success));
$form-control-validation-info:              var(--palette-status-info, var(--c8y-form-validation-color-info));
$form-validation-bottom-margin:             var(--c8y-form-validation-bottom-margin);
$form-control-icon-color:                   var(--c8y-form-control-icon-color);

// Size and spacing
$form-control-padding-base-vertical:        var(--c8y-form-control-padding-base-vertical);
$form-control-padding-base-horizontal:      var(--c8y-form-control-padding-base-horizontal);
$form-control-height-base:                  var(--c8y-form-control-height-base);

$form-control-padding-small-vertical:       calc($form-control-padding-base-vertical * .75);
$form-control-padding-small-horizontal:     calc($form-control-padding-base-horizontal * .75);
$form-control-height-sm:                    var(--c8y-form-control-height-sm);
$form-control-height-lg:                    var(--c8y-form-control-height-lg);
$form-control-padding-large-vertical:       calc($form-control-padding-base-vertical * 1.25);
$form-control-padding-large-horizontal:     calc($form-control-padding-base-horizontal * 1.25);

//Border
$form-control-border-width:                 var(--c8y-form-control-border-width, 1px);
$form-control-border-radius:                var(--c8y-form-control-border-radius);

// typography
$form-control-font-family:                  var(--font-family-base, var(--c8y-form-control-font-family));
$form-control-font-weight:                  var(--c8y-form-control-font-weight);
$form-control-line-height:                  var(--c8y-form-control-line-height);
$form-control-placeholder-font-style:       var(--c8y-form-control-placeholder-font-style);

// Checkboxes
$checkbox-size:                             layout-vars.$size-16;
$checkbox-icon-size:                        10px;

//misc
$cursor-disabled:                           not-allowed;

/* Input type="range" */
$thumb-radius:                              24px;
$thumb-height:                              24px;
$thumb-width:                               $thumb-height;
$thumb-border-width:                        0;
$track-width:                               100%;
$track-height:                              8px;
$track-border-width:                        1px;
$track-radius:                              4px;

$track-color:                               $form-control-background-default;
$track-focus-color:                         $form-control-border-color-focus;
$thumb-color:                               components-vars.$component-background-default;
$thumb-border-color:                        $form-control-border-color-default;
$track-border-color:                        transparent;

// SWITCH
$switch-width:                              var(--c8y-switch-width);
$switch-height:                             var(--c8y-switch-height);
$switch-radius:                             var(--c8y-switch-radius);
$switch-sm:                                 typography-vars.$line-height-computed;
$switch-background-default:                 var(--c8y-switch-background-default);
$switch-background-active:                  var(--c8y-switch-background-active);

// ** input-group addons
$input-group-addon-background-default:      $form-control-border-color-default;
$input-group-addon-border-color:            $form-control-border-color-default;