@charset 'utf-8';

$_color0: #fff;
$_color1: #464646;

$layout-wrapper-min-width: 900px;
$layout-wrapper-max-width: 1400px;
$content-background: #fff;
$light-background-color: #f9f9f9;
// commons - use these in other files
$font-color: $_color1;
$label-color: lighten($font-color, 40%);
$highlight-color: $_color2;
$border-color: #dfdfdf;
$focus-color: ivory;

$brand-orange: #ff7314;
$brand-blue: #4a90e2;
$light-color:  #aaa;

$form-background-color: $_color0;

$link-color: $highlight-color;
$link-hover-color: $_color1;
$icon-hover-color: $_color2;

$dirty-color: #fdf4df;
$success-color: #54b45d;
$error-color: #ca4a4b;
$error-background-color: rgba($error-color, 0.1);
$disabled-color: #ccc;

$create-color: $success-color;
$delete-color: $error-color;
$delete-background-color: $error-background-color;

$warning-color: orange;
$flash-color: white;

$table-search-background-color: $light-background-color;
$tr-odd-color: transparent; //#f0f5f8;
$tr-even-color: transparent; //white;

$body-background: $_color0;
$wrapper-color: none;


$tab-background-color: lighten(black,95%);
$tab-menu-border-color: lighten($border-color, 10%);
$tab-border-color: darken($tab-menu-border-color,5%);
$tab-menu-active-color: $_color2;
$tab-menu-active-background-color: $content-background;
$tab-menu-hover-bg-color: $content-background;
$tab-alt-border-color: none; // darken($_color0, 10%);
$tab-content-color: $content-background;
$tab-submenu-color: $_color0;
$tab-submenu-color: #eee;

// view specific colors
$overview-widget-border: darken($_color0, 40%);
$overview-widget-background: $tab-content-color;

$ribbon-color:  #aa0000;
$ribbon-text-color: white;
$ribbon-shadow-color: #888888;

$menu-background-color: $content-background; //$light-background-color;
$menu-color: $_color1;
$menu-active-color: $_color2;
$menu-hover-color: $_color2;

$submenu-color: $_color1;
$submenu-hover-color: $_color2;
$submenu-active-color: $_color2;
$submenu-border-color: $border-color;

$subsubmenu-active-color: $_color1;
$chart-background-color: $_color0;

$log-entries-error-bg-color: $error-background-color;
$log-entries-warning-bg-color: lighten($warning-color, 22%);

$sample-data-color: $_color0;
$sample-data-bg-color: $_color2;
$sample-data-border-color: $_color2;

$important-button-color: $_color0;
$important-button-bg-color: $_color2;
$important-button-border-color: $_color2;


$metrics-subtable-color: $highlight-color;
$metrics-subtable-border-color: darken(white, 20%);
$metrics-subtable-toggle-hover-color: #f5dd63;
/// --- login ---

// dark version
$login-content-color: darken(white,57%);
$login-content-color-alt: darken(white,52%);
$login-background: linear-gradient(color-stops($login-content-color, $login-content-color-alt));
$login-text-color: white;
$login-stripe-bg-color: transparentize(black, 0.9);
$login-input-border-color: darken($border-color,50%);

$login-shadow-color: darken(white,80%);
$login-tip-color: lighten(black, 30%);
$login-tip-title-color: $_color2;
$login-stripe-border-color: transparentize(white, 0.87);
$login-input-bg-color: darken(white, 5%);


$codemirror-border: darken(white,7%);
$codemirror-bg: #232323; // darken(white,75%);
$codemirror-bg-readonly: darken(white,70%);
$codemirror-cursor-color: red;
$codemirror-vars-color: #6e9cbe;
$codemirror-vars2-color: #d0d0ff; //  darken(#faa21b, 15%);
$codemirror-selected-bg: lighten($codemirror-bg, 30%);
$codemirror-meta-color: #e8bf6a;
$codemirror-attr-color: #e8bf6a;
$codemirror-number-color: #a5c261;
$codemirror-comment-color: #bc9458;
$codemirror-keyword-color: #cc7833;
$codemirror-builtin-color: #6e9cbe;
$codemirror-color-def: #ffc66d;
$codemirror-color-tag: #e8bf6a;
$codemirror-liquid-bg-color: rgba(100, 100, 100, 0.5);
$codemirror-liquid-color: white;
$codemirror-liquid-tag-color: #da4939;
$codemirror-liquid-markup-delim-color: #eeeeee;
$codemirror-liquid-string-color: #a5c261;

@mixin potato-background($color) {
  @include background(linear-gradient(color-stops(lighten($color, 10%), $color )));
}

$twitter-color: #55acee;
$facebook-color: #3b5998;

$footer-background-color: transparent;
$footer-link-color: #bbb;
$footer-link-hover-color: $link-hover-color;
