/* Color related variable defintions. */

/* Base Colors */

// Grays
@plone-gray-darker: lighten(#000, 20%);   // #333
@plone-gray-dark: lighten(#000, 30%);   // #4c4c4c
@plone-gray: lighten(#000, 41%);   // #696969
@plone-gray-light: lighten(#000, 46.5%); // #767676 //discreet
@plone-gray-lighter: lighten(#000, 80%);   // #ccc //disableds like

// Colors
@plone-default-published-color: @plone-link-color; //published and external same color
@plone-default-draft-color: darken(@plone-toolbar-draft-color, 15%); // lime-yellow //draft is visible
@plone-default-pending-color: darken(@plone-toolbar-pending-color, 15%); // orange
@plone-default-private-color: @plone-toolbar-private-color; // red
@plone-default-internal-color: darken(@plone-toolbar-internal-color, 15%); // is draft
@plone-default-internally-published-color: darken(@plone-toolbar-internally-published-color, 5%); // is intranet

// Scaffolding
@plone-body-bg: #fafafa; //almost-white
@plone-footer-bg: #2e3133; //blued-darkgray
@plone-text-color: @plone-gray-dark;
@plone-link-hover-color: darken(@plone-link-color, 15%);


/* Typography */
@plone-headings-color: inherit;


/* Components */
// Global colors for active items (e.g., navs or dropdowns).
@plone-component-active-color: #fff;
// Global background color for active items (e.g., navs or dropdowns).
@plone-component-active-bg: @plone-link-color;


/* Tables */
@plone-table-bg: #fff;
@plone-table-bg-accent: #f6f6f6;
@plone-table-bg-hover: #f0f0f0;
@plone-table-bg-active: @plone-table-bg-hover;
@plone-table-border-color: #e5e5e5;


/* States */
@plone-state-info-text: rgba(0,0,0,.5);
@plone-state-info-bg: #aad6ea;
@plone-state-info-border: 1px solid darken(@plone-state-info-bg,4%);
@plone-state-info-bullet: #3e7b91;
@plone-state-warning-text: rgba(0,0,0,.5);
@plone-state-warning-bg: #ebd380;
@plone-state-warning-border: 1px solid darken(@plone-state-warning-bg,6%);
@plone-state-warning-bullet: #bc8d0d;
@plone-state-error-text: rgba(0,0,0,.5);
@plone-state-error-bg: #EC9C8D;
@plone-state-error-border: 1px solid darken(@plone-state-error-bg,2%);
@plone-state-error-bullet: #ac493f;


/* Buttons */
@plone-btn-standalone-color: @plone-gray-dark;
@plone-btn-standalone-bg: #e5e5e5;
@plone-btn-standalone-border: darken(@plone-btn-standalone-bg, 20%);
@plone-btn-context-color: #fff;
@plone-btn-context-bg: @plone-link-color;
@plone-btn-context-border: darken(@plone-btn-context-bg, 10%);
@plone-btn-destructive-color: #fff;
@plone-btn-destructive-bg: #bb4f45;
@plone-btn-destructive-border: darken(@plone-btn-destructive-bg, 10%);

/* Forms */
// `<input>` background color
@plone-input-bg: #fff;
// `<input disabled>` background color
@plone-input-bg-disabled: @plone-table-border-color;
// Text color for `<input>`s
@plone-input-color: @plone-gray;
// `<input>` border color
@plone-input-border: #ccc;
// Border color for inputs on focus
@plone-input-border-focus: @plone-portlet-list-bullet;
// Placeholder text color
@plone-input-color-placeholder: @plone-gray-light;
@plone-legend-color: @plone-gray-dark;
@plone-legend-border-color: #e5e5e5;

// Background color for textual input addons
@plone-input-group-addon-bg: @plone-gray-lighter;
// Border color for textual input addons
@plone-input-group-addon-border-color: @plone-input-border;


/* Alerts */
@plone-alert-info-bg: @plone-state-info-bg;
@plone-alert-info-text: @plone-state-info-text; //the text on alert is black with opacity to use the same color and match the bg.
@plone-alert-info-border: @plone-state-info-border;
@plone-alert-info-bullet: @plone-state-info-bullet;
@plone-alert-warning-bg: @plone-state-warning-bg;
@plone-alert-warning-text: @plone-state-warning-text;
@plone-alert-warning-border: @plone-state-warning-border;
@plone-alert-warning-bullet: @plone-state-warning-bullet;
@plone-alert-error-bg: @plone-state-error-bg;
@plone-alert-error-text: @plone-state-error-text;
@plone-alert-error-border: @plone-state-error-border;
@plone-alert-error-bullet: @plone-state-error-bullet;


/* Portlets */
@plone-border-base: 1px solid;
@plone-portlet-header-bg: #f2f1f1;
@plone-portlet-header-color: @plone-gray;
@plone-portlet-content-bg: #fff;
@plone-portlet-footer-bg: #fcfcfd;
@plone-portlet-border: @plone-border-base #e5e5e5;
@plone-portlet-contrast-bg: #e5e5e5;
@plone-portlet-event-bullet: #dbecfe;
// @plone-portlet-list-bullet: #64bee8;
@plone-portlet-list-bullet: @plone-sitenav-link-hover-bg;
@plone-portlet-list-hover-bg: #fcfcfd;
@plone-portlet-list-small-text: @plone-gray;


/* Thumbnails */
// Thumbnail background color
@plone-thumbnail-bg: @plone-body-bg;
// Thumbnail border color
@plone-thumbnail-border: #ddd;
// Custom text color for thumbnail captions
@plone-thumbnail-caption-color: @plone-text-color;


/* Breadcrumbs */
// Breadcrumb background color
@plone-breadcrumb-bg: darken(@plone-portlet-header-bg, 5%);
// Breadcrumb text color
@plone-breadcrumb-color: @plone-gray-lighter;
// Text color of current page in the breadcrumb
@plone-breadcrumb-active-color: @plone-gray-light;


/* Site navigation */
// @plone-sitenav-link-hover-bg: lighten(desaturate(spin(@plone-link-color, 10.5557), 61.8357), 24.7059);
@plone-sitenav-bg: @plone-link-color;
@plone-sitenav-hover-bg: @plone-link-color;

//*// PAGINATION
@plone-pagination-color:                     @plone-link-color;
  @plone-pagination-bg:                        @plone-portlet-content-bg;
  @plone-pagination-border:                    @plone-portlet-border;
@plone-pagination-hover-color:               @plone-link-hover-color;
  @plone-pagination-hover-bg:                  @plone-portlet-header-bg;
  @plone-pagination-hover-border:              @plone-portlet-border;
@plone-pagination-active-color:              @plone-portlet-content-bg;
  @plone-pagination-active-bg:                 @plone-link-color;
  @plone-pagination-active-border:             @plone-border-base @plone-link-color;
@plone-pagination-disabled-color:            @plone-gray-lighter;
  @plone-pagination-disabled-bg:               @plone-portlet-footer-bg;
  @plone-pagination-disabled-border:           @plone-portlet-border;



//*// CODE
@plone-code-color:                  #c7254e;
  @plone-code-bg:                     #f9f2f4;
@plone-kbd-color:                   #fff;
  @plone-kbd-bg:                      #333;
@plone-pre-bg:                      #f5f5f5;
  @plone-pre-color:                   @plone-gray-dark;
  @plone-pre-border-color:            #ccc;



//*// TYPE
//** Text muted color
@plone-text-discreet:               @plone-gray;
//** Abbreviations and acronyms border color
@plone-abbr-border-color:           @plone-gray-light;
//** Headings small color
@plone-headings-small-color:        @plone-gray-light;
//** Blockquote small color
@plone-blockquote-small-color:      @plone-gray-light;
//** Blockquote border color
@plone-blockquote-border-color:     @plone-gray-lighter;
//** Page header border color
@plone-page-header-border-color:    @plone-gray-lighter;



//*// MISC
//** Horizontal line color.
@plone-hr-border:                   @plone-gray-lighter;


//*// TOOLBAR
@plone-toolbar-bg:                          rgba(0,0,0,.9);
@plone-toolbar-submenu-bg:                  rgba(20,20,20,.95);
@plone-toolbar-separator-color:             rgba(255,255,255,.17);
@plone-toolbar-link:                        @plone-link-color;
@plone-toolbar-text-color:                  rgba(255,255,255,.9);
@plone-toolbar-submenu-text-color:          #fff;
@plone-toolbar-submenu-header-color:        lighten(#000, 80%);
@plone-toolbar-published-color:             @plone-link-color;  // published and external same color
@plone-toolbar-draft-color:                 #fab82a;  // lime-yellow //draft is visible
@plone-toolbar-pending-color:               #e2e721;  // orange
@plone-toolbar-private-color:               #c4183c;  // red
@plone-toolbar-internal-color:              #fab82a;  // is draft
@plone-toolbar-internally-published-color:  #883dfa;  // is intranet



//** Background for the dropdown menu.
@dropdown-bg:                    @plone-portlet-content-bg;
//** Dropdown menu `border-color`.
@dropdown-border:                rgba(0,0,0,.15);
//** Dropdown menu `border-color` **for IE8**.
@dropdown-fallback-border:       @plone-gray-lighter;
//** Divider color for between dropdown items.
@dropdown-divider-bg:            @plone-table-border-color;

//** Dropdown link text color.
@dropdown-link-color:            @plone-text-color;
//** Hover color for dropdown links.
@dropdown-link-hover-color:      darken(@plone-text-color, 5%);
//** Hover background for dropdown links.
@dropdown-link-hover-bg:         #f5f5f5;

//** Active dropdown menu item text color.
@dropdown-link-active-color:     @plone-link-hover-color;
//** Active dropdown menu item background color.
@dropdown-link-active-bg:        @plone-component-active-bg;

//** Disabled dropdown menu item background color.
@dropdown-link-disabled-color:   @plone-gray-light;

//** Text color for headers within dropdown menus.
@dropdown-header-color:          @plone-gray-light;
//*// END
