//
// Component: Label
//
// ========================================================================


// Variables
// ========================================================================

@label-font-size:                               10px;

@label-padding-vertical:                        3px;
@label-padding-horizontal:                      9px;
@label-background:                              @global-secondary-background;
@label-color:                                   @global-inverse-color;

@label-success-background:                      @global-success-background;
@label-success-color:                           @global-inverse-color;
@label-warning-background:                      @global-warning-background;
@label-warning-color:                           @global-inverse-color;
@label-danger-background:                       @global-danger-background;
@label-danger-color:                            @global-inverse-color;

//
// Master
//

@label-box-shadow:                              1px 3px 15px fade(@label-background, 20%);

@label-success-box-shadow:                      1px 3px 15px fade(@label-success-background, 20%);
@label-warning-box-shadow:                      1px 3px 15px fade(@label-warning-background, 20%);
@label-danger-box-shadow:                       1px 3px 15px fade(@label-danger-background, 20%);

@label-text-transform:                          uppercase;
@label-letter-spacing:                          1.7px;


// Component
// ========================================================================

.hook-label() {}


// Color modifiers
// ========================================================================

.hook-label-success() {}

.hook-label-warning() {}

.hook-label-danger() {}


// Miscellaneous
// ========================================================================

.hook-label-misc() {}


// Inverse
// ========================================================================

@inverse-label-background:                     transparent;
@inverse-label-color:                          @inverse-global-emphasis-color;
@inverse-label-border:                         @inverse-global-primary-background;

.hook-inverse-label() {}