/**
 * AppBuckets UI
 *
 * _Label @ src/styles/elements/_label.scss
 *
 * Defined at 09 ott 2020
 * Copyright Marco Cavanna • 2020
 *
 * ---
 *
 *
 */

/******
    Base Label Style
******/
.label {
  display: inline-block;
  padding: $label-padding-vertical $label-padding-horizontal;
  border-radius: $label-border-radius;

  > .content {
    font-size: $label-font-size;
    font-weight: $label-font-weight;
    display: inline-block;
    line-height: 1;
    color: inherit;

    // ----
    //  Change Margin
    // ----
    > :not([hidden]) {
      margin-left: 0;
      margin-right: 0;

      ~ :not([hidden]) {
        margin-left: $label-content-spacer;
      }
    }
  }

  @include color-property-variation(
    $base-color: $label-base-background-color,
    $properties-list: background-color,
    $use-brands: $generate-button-brands-variation,
    $use-ui: $generate-button-ui-variation,
    $is-interactive: true,
    $interactive-class: 'clickable',
    $hover-will-drop-shadow: $button-hover-will-drop-shadow,
    $with-hover: true,
    $with-focus: true,
    $with-active: true
  )
}


/******
    Label Group
******/
.labels {
  display: block;
  margin: $labels-spacer * -1;

  > .label {
    margin: $labels-spacer;
  }
}


/******
    Disabled Label has lower opacity
******/
.disabled.label {
  opacity: $disabled-element-opacity;
}