@color-header-home-bg: #0B4361;
@color-header-home-title: #fff;

/* primary panel */
@color-primary-panel-header-bg: #DD0033;
@color-primary-panel-header-title: #fff;
@color-primary-panel-header-button-bg: #F40846;
@color-primary-panel-action-icon: #fff;

@color-primary-panel-border: #C6C7E4;

@color-primary-panel-item-icon: #C6C7E4;
@color-primary-panel-item-action-icon: #829AB2;
@color-primary-panel-item-active: #DD0033;
@color-primary-panel-item-text: #466A87;
@color-primary-panel-item-text-active: #0B4361;
@color-primary-panel-item-bg-active: #F4F4F4;
@color-primary-panel-item-border : #CBD5E1;

@color-primary-panel-create: #DD0033;

/* default panel */
@color-default-panel-header-bg: #0B4361;
@color-default-panel-header-title: #fff;
@color-default-panel-header-button-bg: #0E678E;
@color-default-panel-action-icon: #fff;

@color-default-panel-border: #C6C7E4;

@color-default-panel-item-icon: #C6C7E4;
@color-default-panel-item-action-icon: #829AB2;
@color-default-panel-item-active: #0E678E;
@color-default-panel-item-text: #466A87;
@color-default-panel-item-text-active: #0B4361;
@color-default-panel-item-bg-active: #F4F4F4;
@color-default-panel-item-border : #CBD5E1;

@color-default-panel-create: #0B4361;

/* panel content */
@color-search-list: #CBD5E1;

/**
 * bootstrap override
 */
@border-radius-base: 3px;
@border-radius-large: 4px; // used in modal
@border-radius-small: 2px;

@btn-bonita-primary-color:              #fff;
@btn-bonita-primary-bg:                 #DD0033;
@btn-bonita-primary-border:             darken(@btn-bonita-primary-bg, 5%);

@btn-bonita-default-color:              #fff;
@btn-bonita-default-bg:                 #0B4361;
@btn-bonita-default-border:             darken(@btn-bonita-default-bg, 5%);

@btn-bonita-property-color:              #001936;
@btn-bonita-property-bg:                 #CBD5E1;
@btn-bonita-property-border:             @btn-bonita-property-bg;
@btn-bonita-property-linked-color:       #fff;
@btn-bonita-property-linked-bg:          @btn-bonita-property-color;
@btn-bonita-property-linked-border:      @btn-bonita-property-color;

@btn-bonita-asset-color:                 #404853;
@btn-bonita-asset-bg:                    #fff;
@btn-bonita-asset-border:                darken(@btn-bonita-asset-bg, 5%);
@btn-bonita-asset-type-bg:               lighten(@color-properties-bg, 30%);

@btn-bonita-help-color:                  #fff;
@btn-bonita-help-bg:                     lighten(@btn-bonita-default-bg, 10%);
@btn-bonita-help-border:                 transparent;

@btn-bonita-help-widget-color:           #fff;
@btn-bonita-help-widget-bg:              lighten(@color-properties-bg, 10%);
@btn-bonita-help-widget-border:          transparent;

@btn-bonita-action-widget-color:         @btn-bonita-property-color;
@btn-bonita-action-widget-bg:            @btn-bonita-property-bg;
@btn-bonita-action-widget-border:        transparent;

@Artifact-button--favorite-color:        #ffe502;

.btn-bonita-default {
  .button-variant(@btn-bonita-default-color, @btn-bonita-default-bg, @btn-bonita-default-border);
}

.btn-bonita-property {
  .button-variant(@btn-bonita-property-color, @btn-bonita-property-bg, @btn-bonita-property-border);
}

.linked .btn-bonita-property {
  .button-variant(@btn-bonita-property-linked-color, @btn-bonita-property-linked-bg, @btn-bonita-property-linked-border);
}

.btn-bonita-primary {
  .button-variant(@btn-bonita-primary-color, @btn-bonita-primary-bg, @btn-bonita-primary-border);
}
.btn-bonita-asset {
  .button-variant(@btn-bonita-asset-color, @btn-bonita-asset-bg, @btn-bonita-asset-border);
}

.btn-bonita-help {
  .button-variant(@btn-bonita-help-color, @btn-bonita-help-bg, @btn-bonita-help-border);

  &:hover {
    background-color: lighten(@btn-bonita-help-bg, 5%);
  }
}

.btn-bonita-help-widget {
  .button-variant(@btn-bonita-help-widget-color, @btn-bonita-help-widget-bg, @btn-bonita-help-widget-border);

  &:hover {
    background-color: lighten(@btn-bonita-help-widget-bg, 5%);
  }
}

.btn-bonita-action-widget {
  .button-variant(@btn-bonita-action-widget-color, @btn-bonita-action-widget-bg, @btn-bonita-action-widget-border);

  &:hover {
    background-color: darken(@btn-bonita-action-widget-bg, 10%);
  }
}

/**
 * Editor
 */
@color-editor-header-back-bg: #1F2735;
@color-editor-header-bg: #0B4361;
@color-editor-header-text: #fff;
@color-editor-header-placeholder: darken(#CBD5E1, 20%);

/**
 * Palette
 */
@color-palette-bg: #1F2735;
@color-palette-section-bg: #E21938;
@color-palette-section-bg-active: #86001F;
@color-palette-section-text: #fff;
@color-palette-item-bg: #404853;
@color-palette-item-text: #fff;
@color-palette-search: #909192;
@color-palette-search-active: #fff;

@color-palette-section-data-bg: lighten(@btn-bonita-default-bg, 10%);
@color-palette-section-data-bg-active: darken(@color-palette-section-data-bg,15%);
@color-palette-section-data-text: #fff;

/**
 * Data panel
 */
@color-data-bg: #CBD5E1;
@color-table-header-bg: #404853;
@color-table-header-text: #fff;
@color-table-tr-odd: #eff2f6;
@color-table-tr-even: #e5eaf0;
@color-table-tr-text: #404853;
@color-data-search: #6d6e6f;

/**
 * Properties
 */
@color-properties-header-bg: #4B5461;
@color-properties-header-border: #1F2735;
@color-properties-bg: #404853;
@color-properties-text: #fff;
@color-properties-help: #CBD5E1;
@color-properties-placeholder: #a7afb9;

/**
 * Custom Editor
 */

@color-custom-editor-section: #E21938;
@color-custom-editor-helper: #0B4361;
@color-custom-editor-widget-name: #CBD5E1;
@color-custom-editor-disable-background: #EEEEEE;


/**
 * Alerts
 */
@color-alert-success: #8DC63F;
@color-alert-warning: #F89728;
@color-alert-error: #E31837;
@color-alert-info: #10638f;
