// NOTE: this file contains the variables for all types of form fields.  This is done 
// (as opposed to having separate files for Text.scss, Checkbox.scss etc) so that grid 
// editor sass vars (in Editor.scss) can derive from any of the form field vars simply 
// because Ext.grid.plugin.Editing requires Ext.form.field.Base.  Grid editor sass 
// vars cannot live in the same files as normal form field vars because they also derive 
// some of their values from grid vars. 
 
// <editor-fold desc="Base Variables"> 
/**
 * @class Ext.form.field.Base
 */
 
/**
 * @var {number} $form-field-height
 * Height for form fields.
 */
$form-field-height: 24px !default;
 
/**
 * @var {number} $form-toolbar-field-height
 * Height for form fields in toolbar.
 */
$form-toolbar-field-height: $form-field-height !default;
 
/**
 * @var {number} $form-field-padding
 * Padding around form fields.
 */
$form-field-padding: 1px 3px 2px !default;
 
/**
 * @var {number} $form-field-font-size
 * Font size for form fields.
 */
$form-field-font-size: $font-size !default;
 
/**
 * @var {string} $form-field-font-family
 * Font family for form fields.
 */
$form-field-font-family: $font-family !default;
 
/**
 * @var {string} $form-field-font-weight
 * Font weight for form fields.
 */
$form-field-font-weight: $font-weight !default;
 
/**
 * @var {number} $form-toolbar-field-font-size
 * Font size for toolbar form fields.
 */
$form-toolbar-field-font-size: $form-field-font-size !default;
 
/**
 * @var {string} $form-toolbar-field-font-family
 * Font family for toolbar form fields.
 */
$form-toolbar-field-font-family: $form-field-font-family !default;
/**
 * @var {string} $form-toolbar-field-font-weight
 * Font weight for toolbar form fields.
 */
$form-toolbar-field-font-weight: $form-field-font-weight !default;
 
/**
 * @var {color} $form-field-color
 * Text color for form fields.
 */
$form-field-color: $color !default;
 
/**
 * @var {color} $form-field-empty-color
 * Text color for empty form fields.
 */
$form-field-empty-color: gray !default;
 
/**
 * @var {color} $form-field-border-color
 * Border color for form fields.
 */
$form-field-border-color: $neutral-color !default;
 
/**
 * @var {number} $form-field-border-width
 * Border width for form fields.
 */
$form-field-border-width: 1px !default;
 
/**
 * @var {string} $form-field-border-style
 * Border style for form fields.
 */
$form-field-border-style: solid !default;
 
/**
 * @var {color} $form-field-focus-border-color
 * Border color for focused form fields.
 *
 * In the default Neptune color scheme this is the same as $base-highlight-color
 * but it does not change automatically when one changes the $base-color.  This is because
 * checkboxes and radio buttons have this focus color hard coded into their background
 * images.  If this color is changed, you should also modify checkbox and radio button
 * background images to match
 */
$form-field-focus-border-color: $base-color !default;
 
/**
 * @var {color} $form-field-invalid-border-color
 * Border color for invalid form fields.
 */
$form-field-invalid-border-color: #c30 !default;
 
/**
 * @var {color} $form-field-background-color
 * Background color for form fields.
 */
$form-field-background-color: #fff !default;
/**
 * @var {string} $form-field-background-image
 * Background image for form fields.
 */
$form-field-background-image: 'form/text-bg' !default;
 
/**
 * @var {color} $form-field-invalid-background-color
 * Background color for invalid form fields.
 */
$form-field-invalid-background-color: #fff !default;
/**
 * @var {string} $form-field-invalid-background-image
 * Background image for invalid form fields.
 */
$form-field-invalid-background-image: 'grid/invalid_line' !default;
/**
 * @var {string} $form-field-invalid-background-repeat
 * Background repeat for invalid form fields.
 */
$form-field-invalid-background-repeat: repeat-x !default;
/**
 * @var {string/list} $form-field-invalid-background-position
 * Background position for invalid form fields.
 */
$form-field-invalid-background-position: bottom !default;
 
/**
 * @var {boolean}
 * True to include the "default" field UI
 */
$include-field-default-ui: $include-default-uis !default;
 
/**
 * @var {boolean}
 * True to include the "toolbar" field UI
 */
$include-field-toolbar-ui: false !default;
 
// </editor-fold> 
 
// <editor-fold desc="Labelable Variables"> 
/**
 * @class Ext.form.Labelable
 */
 
/**
 * @var {color}
 * The text color of form field labels
 */
$form-label-font-color: $color !default;
 
/**
 * @var {string}
 * The font-weight of form field labels
 */
$form-label-font-weight: $font-weight !default;
 
/**
 * @var {number}
 * The font-size of form field labels
 */
$form-label-font-size: $font-size !default;
 
/**
 * @var {string}
 * The font-family of form field labels
 */
$form-label-font-family: $font-family !default;
 
/**
 * @var {number}
 * The line-height of form field labels
 */
$form-label-line-height: round($form-label-font-size * 1.15) !default;
 
/**
 * @var {number}
 * Horizontal space between the label and the field body when the label is left-aligned.
 */
$form-label-horizontal-spacing: 5px !default;
 
/**
 * @var {number}
 * Vertical space between the label and the field body when the label is top-aligned.
 */
$form-label-vertical-spacing: 5px !default;
 
/**
 * @var {string}
 * The background image for error icons
 */
$form-error-icon-background-image: 'form/exclamation' !default;
 
/**
 * @var {number}
 * Width for form error icons.
 */
$form-error-icon-width: 16px !default;
 
/**
 * @var {number}
 * Height for form error icons.
 */
$form-error-icon-height: 16px !default;
 
/**
 * @var {number/list}
 * Margin for error icons that are aligned to the side of the field
 */
$form-error-icon-side-margin: 0 1px !default;
 
/**
 * @var {number}
 * The space between the icon and the message for errors that display under the field
 */
$form-error-under-icon-spacing: 4px !default;
 
/**
 * @var {number/list}
 * The padding on errors that display under the form field
 */
$form-error-under-padding: 2px 2px 2px 0 !default;
 
/**
 * @var {color}
 * The text color of form error messages
 */
$form-error-msg-color: $form-field-invalid-border-color !default;
 
/**
 * @var {string}
 * The font-weight of form error messages
 */
$form-error-msg-font-weight: $font-weight !default;
 
/**
 * @var {number}
 * The font-size of form error messages
 */
$form-error-msg-font-size: $font-size !default;
 
/**
 * @var {string}
 * The font-family of form error messages
 */
$form-error-msg-font-family: $font-family !default;
 
/**
 * @var {number}
 * The line-height of form error messages
 */
$form-error-msg-line-height: $form-error-icon-height !default;
 
/**
 * @var {number}
 * The bottom margin to apply to form items when in auto, anchor, vbox, or table layout.
 * This value is also used as the default border-spacing in a form-layout.
 */
$form-item-margin-bottom: 5px !default;
 
/**
 * @var {number}
 * Opacity of disabled form fields
 */
$form-field-disabled-opacity: .3 !default;
 
/**
 * @var {color}
 * The text color of toolbar form field labels
 */
$form-toolbar-label-font-color: $color !default;
 
/**
 * @var {string}
 * The font-weight of toolbar form field labels
 */
$form-toolbar-label-font-weight: $font-weight !default;
 
/**
 * @var {number}
 * The font-size of toolbar form field labels
 */
$form-toolbar-label-font-size: $font-size !default;
 
/**
 * @var {string}
 * The font-family of toolbar form field labels
 */
$form-toolbar-label-font-family: $font-family !default;
 
/**
 * @var {number}
 * The line-height of toolbar form field labels
 */
$form-toolbar-label-line-height: round($form-toolbar-label-font-size * 1.15) !default;
 
/**
 * @var {number}
 * Horizontal space between the toolbar field's label and the field body when the label is left-aligned.
 */
$form-toolbar-label-horizontal-spacing: 5px !default;
 
/**
 * @var {number}
 * Vertical space between the toolbar field's label and the field body when the label is top-aligned.
 */
$form-toolbar-label-vertical-spacing: 5px !default;
 
/**
 * @var {string}
 * The background image for toolbar field error icons
 */
$form-toolbar-error-icon-background-image: 'form/exclamation' !default;
 
/**
 * @var {number}
 * Width for toolbar field error icons.
 */
$form-toolbar-error-icon-width: 16px !default;
 
/**
 * @var {number}
 * Height for toolbar field error icons.
 */
$form-toolbar-error-icon-height: 16px !default;
 
/**
 * @var {number/list}
 * Margin for toolbar field error icons that are aligned to the side of the field
 */
$form-toolbar-error-icon-side-margin: 0 1px !default;
 
/**
 * @var {number}
 * The space between the icon and the message for errors that display under a toolbar field
 */
$form-toolbar-error-under-icon-spacing: 4px !default;
 
/**
 * @var {number/list}
 * The padding on errors that display under the toolbar form field
 */
$form-toolbar-error-under-padding: 2px 2px 2px 0 !default;
 
/**
 * @var {color}
 * The text color of toolbar form error messages
 */
$form-toolbar-error-msg-color: $form-field-invalid-border-color !default;
 
/**
 * @var {string}
 * The font-weight of toolbar form field error messages
 */
$form-toolbar-error-msg-font-weight: $font-weight !default;
 
/**
 * @var {number}
 * The font-size of toolbar form field error messages
 */
$form-toolbar-error-msg-font-size: $font-size !default;
 
/**
 * @var {string}
 * The font-family of toolbar form field error messages
 */
$form-toolbar-error-msg-font-family: $font-family !default;
 
/**
 * @var {number}
 * The line-height of toolbar form field error messages
 */
$form-toolbar-error-msg-line-height: $form-toolbar-error-icon-height !default;
 
/**
 * @var {number}
 * Opacity of disabled toolbar form fields
 */
$form-toolbar-field-disabled-opacity: .3 !default;
 
/**
 * @var {boolean}
 * True to include the "default" label UI
 */
$include-label-default-ui: $include-field-default-ui !default;
 
/**
 * @var {boolean}
 * True to include the "default" label UI
 */
$include-label-toolbar-ui: $include-field-toolbar-ui !default;
 
// </editor-fold> 
 
// <editor-fold desc="Text Field Variables"> 
/**
 * @class Ext.form.field.Text
 */
 
/**
 * @var {number}
 * The height of text fields
 */
$form-text-field-height: $form-field-height !default;
 
/**
 * @var {number}
 * Font size for text fields.
 */
$form-text-field-font-size: $form-field-font-size !default;
 
/**
 * @var {string}
 * Font family for text fields.
 */
$form-text-field-font-family: $form-field-font-family !default;
 
/**
 * @var {string}
 * Font weight for text fields.
 */
$form-text-field-font-weight: $form-field-font-weight !default;
 
/**
 * @var {color}
 * The color of the text field's input element
 */
$form-text-field-color: $form-field-color !default;
 
/**
 * @var {color}
 * The background color of the text field's input element
 */
$form-text-field-background-color: $form-field-background-color !default;
 
/**
 * @var {number/list}
 * The border width of text fields
 */
$form-text-field-border-width: $form-field-border-width !default;
 
/**
 * @var {string/list}
 * The border style of text fields
 */
$form-text-field-border-style: $form-field-border-style !default;
 
/**
 * @var {color/list}
 * The border color of text fields
 */
$form-text-field-border-color: $form-field-border-color !default;
 
/**
 * @var {color/list}
 * The border color of the focused text field
 */
$form-text-field-focus-border-color: $form-field-focus-border-color !default;
 
/**
 * @var {color}
 * Border color for invalid text fields.
 */
$form-text-field-invalid-border-color: $form-field-invalid-border-color !default;
 
/**
 * @var {number/list}
 * Border radius for text fields
 */
$form-text-field-border-radius: 0 !default;
 
/**
 * @var {string}
 * The background image of the text field's input element
 */
$form-text-field-background-image: $form-field-background-image !default;
 
/**
 * @var {number/list}
 * The padding of the text field's input element
 */
$form-text-field-padding: $form-field-padding !default;
 
/**
 * @var {color}
 * Text color for empty text fields.
 */
$form-text-field-empty-color: $form-field-empty-color !default;
 
/**
 * @var {number}
 * The default width of the text field's body element (the element that contains the input
 * element and triggers) when the field is not sized explicitly using the {@link #width}
 * config, or sized by it's containing layout.
 */
$form-text-field-body-width: 150px !default;
 
/**
 * @var {color}
 * Background color of the text field's input element when the field value is invalid.
 */
$form-text-field-invalid-background-color: $form-field-invalid-background-color !default;
 
/**
 * @var {string}
 * Background image of the text field's input element when the field value is invalid.
 */
$form-text-field-invalid-background-image: $form-field-invalid-background-image !default;
 
/**
 * @var {string}
 * Background repeat of the text field's input element when the field value is invalid.
 */
$form-text-field-invalid-background-repeat: $form-field-invalid-background-repeat !default;
 
/**
 * @var {string/list}
 * Background position of the text field's input element when the field value is invalid.
 */
$form-text-field-invalid-background-position: $form-field-invalid-background-position !default;
 
/**
 * @var {boolean}
 * `true` to use classic-theme styled border for text fields.
 */
$form-text-field-classic-border: false !default;
 
/**
 * @var {number} $form-textarea-line-height
 * The line-height to use for the TextArea's text
 */
// 1.15 is a rough approximation of the ratio of a "normal" line-height to font-size. 
// we use this as opposed to using "normal" so it can be involved in the calculation of 
// $form-textarea-body-height 
$form-textarea-line-height: round($form-text-field-font-size * 1.15) !default;
 
/**
 * @var {number} $form-textarea-body-height
 * The default width of the TextArea's body element (the element that contains the textarea
 * html element when the field is not sized explicitly using the {@link #width}config, or
 * sized by it's containing layout.
 */
// In 4.x the "rows" config defaulted to "4", so we attempt to preserves roughly the same 
// height using a multiple of line-height. 
$form-textarea-body-height: $form-textarea-line-height * 4 !default;
 
/**
 * @var {color}
 * Text color for file fields
 */
$form-file-field-color: $form-field-empty-color !default;
 
/**
 * @var {number}
 * The width of the text field's trigger element
 */
$form-trigger-width: 22px !default;
 
/**
 * @var {number/list}
 * The width of the text field's trigger's border
 */
$form-trigger-border-width: 0 !default;
 
/**
 * @var {color/list}
 * The color of the text field's trigger's border
 */
$form-trigger-border-color: $form-field-border-color !default;
 
/**
 * @var {string/list}
 * The style of the text field's trigger's border
 */
$form-trigger-border-style: $form-field-border-style !default;
 
/**
 * @var {color}
 * The color of the text field's trigger's border when hovered
 */
$form-trigger-border-color-over: $form-field-border-color !default;
 
/**
 * @var {color}
 * The color of the text field's trigger's border when the field is focused
 */
$form-trigger-border-color-focus: $form-field-focus-border-color !default;
 
/**
 * @var {color}
 * The color of the text field's trigger's border when the field is focused and the trigger is hovered
 */
$form-trigger-border-color-pressed: $form-trigger-border-color-over !default;
 
/**
 * @var {string}
 * The default background image for text field triggers
 */
$form-trigger-background-image: 'form/trigger' !default;
 
/**
 * @var {color}
 * The background color of the text field's trigger element
 */
$form-trigger-background-color: $form-field-background-color !default;
 
/**
 * @var {number}
 * The height of toolbar text fields
 */
$form-toolbar-text-field-height: $form-toolbar-field-height !default;
 
/**
 * @var {number}
 * Font size for toolbar text fields.
 */
$form-toolbar-text-field-font-size: $form-text-field-font-size !default;
 
/**
 * @var {string}
 * Font family for toolbar text fields.
 */
$form-toolbar-text-field-font-family: $form-text-field-font-family !default;
 
/**
 * @var {string}
 * Font weight for toolbar text fields.
 */
$form-toolbar-text-field-font-weight: $form-text-field-font-weight !default;
 
/**
 * @var {color}
 * The color of the toolbar text field's input element
 */
$form-toolbar-text-field-color: $form-text-field-color !default;
 
/**
 * @var {color}
 * The background color of the toolbar text field's input element
 */
$form-toolbar-text-field-background-color: $form-text-field-background-color !default;
 
/**
 * @var {number/list}
 * The border width of toolbar text fields
 */
$form-toolbar-text-field-border-width: $form-text-field-border-width !default;
 
/**
 * @var {string/list}
 * The border style of toolbar text fields
 */
$form-toolbar-text-field-border-style: $form-text-field-border-style !default;
 
/**
 * @var {color/list}
 * The border color of toolbar text fields
 */
$form-toolbar-text-field-border-color: $form-text-field-border-color !default;
 
/**
 * @var {color/list}
 * The border color of the focused toolbar text field
 */
$form-toolbar-text-field-focus-border-color: $form-text-field-focus-border-color !default;
 
/**
 * @var {color} $form-toolbar-text-field-invalid-border-color
 * Border color for invalid toolbar text fields.
 */
$form-toolbar-text-field-invalid-border-color: $form-text-field-invalid-border-color !default;
 
/**
 * @var {number/list}
 * Border radius for toolbar text fields
 */
$form-toolbar-text-field-border-radius: $form-text-field-border-radius !default;
 
/**
 * @var {string}
 * The background image of the toolbar text field's input element
 */
$form-toolbar-text-field-background-image: $form-text-field-background-image !default;
 
/**
 * @var {number/list}
 * The padding of the toolbar text field's input element
 */
$form-toolbar-text-field-padding: $form-text-field-padding !default;
 
/**
 * @var {color}
 * Text color for empty toolbar text fields.
 */
$form-toolbar-text-field-empty-color: $form-text-field-empty-color !default;
 
/**
 * @var {number}
 * The default width of the toolbar text field's body element (the element that contains the input
 * element and triggers) when the field is not sized explicitly using the {@link #width}
 * config, or sized by it's containing layout.
 */
$form-toolbar-text-field-body-width: $form-text-field-body-width !default;
 
/**
 * @var {color}
 * Background color of the toolbar text field's input element when the field value is invalid.
 */
$form-toolbar-text-field-invalid-background-color: $form-text-field-invalid-background-color !default;
 
/**
 * @var {string}
 * Background image of the toolbar text field's input element when the field value is invalid.
 */
$form-toolbar-text-field-invalid-background-image: $form-text-field-invalid-background-image !default;
 
/**
 * @var {string}
 * Background repeat of the toolbar text field's input element when the field value is invalid.
 */
$form-toolbar-text-field-invalid-background-repeat: $form-text-field-invalid-background-repeat !default;
 
/**
 * @var {string/list}
 * Background position of the toolbar text field's input element when the field value is invalid.
 */
$form-toolbar-text-field-invalid-background-position: $form-text-field-invalid-background-position !default;
 
/**
 * @var {boolean}
 * `true` to use classic-theme styled border for toolbar text fields.
 */
$form-toolbar-text-field-classic-border: $form-text-field-classic-border !default;
 
/**
 * @var {number/string}
 * The line-height to use for the toolbar TextArea's text
 */
$form-toolbar-textarea-line-height: $form-textarea-line-height !default;
 
/**
 * @var {number}
 * The default width of the toolbar TextArea's body element (the element that contains the
 * textarea html element when the field is not sized explicitly using the {@link #width}
 * config, or sized by it's containing layout.
 */
$form-toolbar-textarea-body-height: $form-textarea-body-height !default;
 
/**
 * @var {color}
 * Text color for toolbar file fields
 */
$form-toolbar-file-field-color: $form-file-field-color !default;
 
/**
 * @var {number}
 * The width of the toolbar text field's trigger element
 */
$form-toolbar-trigger-width: $form-trigger-width !default;
 
/**
 * @var {number/list}
 * The width of the toolbar text field's trigger's border
 */
$form-toolbar-trigger-border-width: $form-trigger-border-width !default;
 
/**
 * @var {color/list}
 * The color of the toolbar text field's trigger's border
 */
$form-toolbar-trigger-border-color: $form-trigger-border-color !default;
 
/**
 * @var {string/list}
 * The style of the toolbar text field's trigger's border
 */
$form-toolbar-trigger-border-style: $form-trigger-border-style !default;
 
/**
 * @var {color}
 * The color of the toolbar text field's trigger's border when hovered
 */
$form-toolbar-trigger-border-color-over: $form-trigger-border-color !default;
 
/**
 * @var {color}
 * The color of the toolbar text field's trigger's border when the field is focused
 */
$form-toolbar-trigger-border-color-focus: $form-trigger-border-color-focus !default;
 
/**
 * @var {color}
 * The color of the toolbar text field's trigger's border when the field is focused and the trigger is hovered
 */
$form-toolbar-trigger-border-color-pressed: $form-toolbar-trigger-border-color-over !default;
 
/**
 * @var {string}
 * The default background image for toolbar text field triggers
 */
$form-toolbar-trigger-background-image: $form-trigger-background-image !default;
 
/**
 * @var {color}
 * The background color of the toolbar text field's trigger element
 */
$form-toolbar-trigger-background-color: $form-text-field-background-color !default;
 
/**
 * @var {boolean}
 * True to include the "default" text field UI
 */
$include-text-field-default-ui: $include-field-default-ui !default;
 
/**
 * @var {boolean}
 * True to include the "toolbar" text field UI
 */
$include-text-field-toolbar-ui: $include-field-toolbar-ui !default;
 
// </editor-fold> 
 
// <editor-fold desc="Spinner Variables" 
/**
 * @class Ext.form.field.Spinner
 */
 
/**
 * @var {boolean}
 * True to use vertically oriented triggers. False to use horizontally oriented triggers.
 * Themes that set this property to true must also override the
 * {@link Ext.form.trigger.Spinner#vertical} config to match. Defaults to true.  When
 * 'vertical' orientation is used, the background image for both triggers is
 * 'form/spinner'.  When 'horizontal' is used, the triggers use separate background
 * images - 'form/spinner-up', and 'form/spinner-down'.
 */
$spinner-trigger-vertical: true !default;
 
/**
 * @var {string}
 * Background image for vertically oriented spinner triggers
 */
$spinner-trigger-vertical-background-image: 'form/spinner' !default;
 
/**
 * @var {string}
 * Background image for the "up" trigger when trigger buttons are horizontally aligned
 */
$spinner-trigger-up-background-image: 'form/spinner-up' !default;
 
/**
 * @var {string}
 * Background image for the "down" trigger when trigger buttons are horizontally aligned
 */
$spinner-trigger-down-background-image: 'form/spinner-down' !default;
 
/**
 * @var {boolean}
 * `true` to use vertically oriented triggers for fields with the 'toolbar' UI.
 */
$spinner-toolbar-trigger-vertical: true !default;
 
/**
 * @var {string}
 * Background image for vertically oriented toolbar spinner triggers
 */
$spinner-toolbar-trigger-vertical-background-image: $spinner-trigger-vertical-background-image !default;
 
/**
 * @var {string}
 * Background image for the "up" toolbar trigger when trigger buttons are horizontally aligned
 */
$spinner-toolbar-trigger-up-background-image: $spinner-trigger-up-background-image !default;
 
/**
 * @var {string}
 * Background image for the "down" toolbar trigger when trigger buttons are horizontally aligned
 */
$spinner-toolbar-trigger-down-background-image: $spinner-trigger-down-background-image !default;
 
/**
 * @var {boolean}
 * True to include the "default" spinner UI
 */
$include-spinner-trigger-default-ui: $include-default-uis !default;
 
/**
 * @var {boolean}
 * True to include the "toolbar" spinner UI
 */
$include-spinner-trigger-toolbar-ui: $include-text-field-toolbar-ui !default;
 
// </editor-fold> 
 
// <editor-fold desc="Checkbox Variables" 
/**
 * @class Ext.form.field.Checkbox
 */
 
/**
 * @var {number}
 * The size of the checkbox
 */
$form-checkbox-size: 13px !default;
 
/**
 * @var {string}
 * The background-image of the checkbox
 */
$form-checkbox-background-image: 'form/checkbox' !default;
 
/**
 * @var {string}
 * The background-image of the radio button
 */
$form-radio-background-image: 'form/radio' !default;
 
/**
 * @var {color}
 * The color of the checkbox's {@link #boxLabel}
 */
$form-checkbox-label-color: $form-label-font-color !default;
 
/**
 * @var {string}
 * The font-weight of the checkbox's {@link #boxLabel}
 */
$form-checkbox-label-font-weight: $form-label-font-weight !default;
 
/**
 * @var {string}
 * The font-size of the checkbox's {@link #boxLabel}
 */
$form-checkbox-label-font-size: $form-label-font-family !default;
 
/**
 * @var {string}
 * The font-family of the checkbox's {@link #boxLabel}
 */
$form-checkbox-label-font-family: $form-label-font-family !default;
 
/**
 * @var {string}
 * The line-height of the checkbox's {@link #boxLabel}
 */
$form-checkbox-label-line-height: $form-label-line-height !default;
 
/**
 * @var {number}
 * The space between the {@link #boxLabel} and the checkbox.
 */
$form-checkbox-label-spacing: 4px !default;
 
/**
 * @var {number}
 * The size of the toolbar checkbox
 */
$form-toolbar-checkbox-size: 13px !default;
 
/**
 * @var {string}
 * The background-image of the toolbar checkbox
 */
$form-toolbar-checkbox-background-image: 'form/checkbox' !default;
 
/**
 * @var {string}
 * The background-image of the toolbar radio button
 */
$form-toolbar-radio-background-image: 'form/radio' !default;
 
/**
 * @var {color}
 * The color of the toolbar checkbox's {@link #boxLabel}
 */
$form-toolbar-checkbox-label-color: $form-toolbar-label-font-color !default;
 
/**
 * @var {string}
 * The font-weight of the toolbar checkbox's {@link #boxLabel}
 */
$form-toolbar-checkbox-label-font-weight: $form-toolbar-label-font-weight !default;
 
/**
 * @var {string}
 * The font-size of the toolbar checkbox's {@link #boxLabel}
 */
$form-toolbar-checkbox-label-font-size: $form-toolbar-label-font-family !default;
 
/**
 * @var {string}
 * The font-family of the toolbar checkbox's {@link #boxLabel}
 */
$form-toolbar-checkbox-label-font-family: $form-toolbar-label-font-family !default;
 
/**
 * @var {string}
 * The line-height of the toolbar checkbox's {@link #boxLabel}
 */
$form-toolbar-checkbox-label-line-height: $form-toolbar-label-line-height !default;
 
/**
 * @var {number}
 * The space between the {@link #boxLabel} and the toolbar checkbox.
 */
$form-toolbar-checkbox-label-spacing: 4px !default;
 
/**
 * @var {boolean}
 * True to include the "default" checkbox UI
 */
$include-checkbox-default-ui: $include-field-default-ui !default;
 
/**
 * @var {boolean}
 * True to include the "toolbar" checkbox UI
 */
$include-checkbox-toolbar-ui: $include-field-toolbar-ui !default;
 
// </editor-fold> 
 
// <editor-fold desc="Display Field Variables"> 
/**
 * @class Ext.form.field.Display
 */
 
/**
 * @var {color}
 * The text color of display fields
 */
$form-display-field-color: $form-field-color !default;
 
/**
 * @var {number}
 * The font-size of display fields
 */
$form-display-field-font-size: $form-field-font-size !default;
 
/**
 * @var {string}
 * The font-family of display fields
 */
$form-display-field-font-family: $form-field-font-family !default;
 
/**
 * @var {string}
 * The font-weight of display fields
 */
$form-display-field-font-weight: $form-field-font-weight !default;
 
/**
 * @var {number}
 * The line-height of display fields
 */
$form-display-field-line-height: round($form-display-field-font-size * 1.15) !default;
 
/**
 * @var {color}
 * The text color of toolbar display fields
 */
$form-toolbar-display-field-color: $form-display-field-color !default;
 
/**
 * @var {number}
 * The font-size of toolbar display fields
 */
$form-toolbar-display-field-font-size: $form-display-field-font-size !default;
 
/**
 * @var {string}
 * The font-family of toolbar display fields
 */
$form-toolbar-display-field-font-family: $form-display-field-font-family !default;
 
/**
 * @var {string}
 * The font-weight of toolbar display fields
 */
$form-toolbar-display-field-font-weight: $form-display-field-font-weight !default;
 
/**
 * @var {number}
 * The line-height of toolbar display fields
 */
$form-toolbar-display-field-line-height: round($form-toolbar-display-field-font-size * 1.15) !default;
 
/**
 * @var {boolean}
 * True to include the "default" display field UI
 */
$include-display-field-default-ui: $include-field-default-ui !default;
 
/**
 * @var {boolean}
 * True to include the "toolbar" display field UI
 */
$include-display-field-toolbar-ui: $include-field-toolbar-ui !default;
 
// </editor-fold>