// Bootstrap Variables
// https://github.com/twbs/bootstrap-sass/blob/master/templates/project/_bootstrap-variables.sass

// $gray-darker:            #222222
// $gray-dark:              #333333
// $gray:                   #555555
// $gray-light:             #777777
// $gray-lighter:           #eeeeee

// OSF-Style variables

/* Sizes */
$sizes: ('xs', 'sm', 'md', 'lg', 'xl');
$margins: (5, 10, 15, 25, 50);
$spinner-size: (10, 20, 30, 50, 75);
$weights: (200, 300, 400, 500, 600);
$mobile-width: 768px;

/* Defaults */
$radius: 2px;
$bg-light: #f8f8f8;
$border-light: 1px solid #eee;
$tall-line-height: 1.42857;

$osf-teal-navbar: #2e6a74;
$osf-highlight-navbar: #5a8288;
$osf-dark-blue-navbar: #263947;

/* default bootstrap colors so osf-style can compile without bootstrap */
$brand-success: #5cb85c !default;
$brand-info: #5bc0de !default;
$brand-warning: #f0ad4e !default;
$brand-danger: #d9534f;

/* overrides with darkened colors for a11y contrast */
$brand-success: darken($brand-success, 10%);
$brand-info: darken($brand-info, 15%);
// no override needed for brand-warning (will use dark text instead)
$brand-danger: darken($brand-danger, 15%);


// Internal variables
// Color variations ordered darkest to lightest within each section.

$color-border-white: #fff;
$color-border-gray-darker: #ababab;
$color-border-gray-dark: #e5e5e5;
$color-border-gray: #ddd;
$color-border-gray-light: #d9d9d9;
$color-border-gray-cool: #d6dbdc;
$color-border-blue-dark: #263947;

$color-gradient-primary: #eee;
$color-gradient-secondary: #ccc;

$color-text-white: #fff;
$color-text-black: #333;
$color-text-gray: #555;
$color-text-gray-light: #777770; // 4.5 color contrast against fff background
$color-text-gray-dark: #888;
$color-text-gray-cool: #e0ebf3;
$color-text-gray-blue: #263947;
$color-text-blue-light: #adcce6;
$color-text-blue-dark: #337ab7;
$color-text-blue-heading: #365062;
$color-text-slate-gray: #a5b3bd;

$color-link-black: #000;
$color-link-light: #08c;
$color-link-dark: #2d6a9f;
$color-link-blue: #80c2f7;
$color-link-lighter: #15a5eb;

$color-bg-black: #333;
$color-bg-white: #fff;
$color-bg-gray-darker: #4c4c4c;
$color-bg-gray: #e0e0e0;
$color-bg-gray-light: #efefef;
$color-bg-gray-lighter: #f7f7f7;
$color-bg-gray-dark: #d9d9d9;
$color-bg-gray-blue: #263947;
$color-bg-gray-blue-dark: #34495e;
$color-bg-gray-blue-light: #ecf0f1;
$color-bg-blue-dark: #337ab7;
$color-bg-blue-darker: #214661;
$color-bg-blue-light: #def;
$color-bg-blue-lighter: rgba($color-bg-blue-dark, 0.2);
$color-bg-blue-highlight: #15a5eb;
$color-bg-red: #a00;
$color-bg-white-transparent: rgba(255, 255, 255, 0.49);
$color-bg-success: #dff0d8;
$color-bg-warning: #fcf8e3;
$color-bg-danger: #f2dede;


$color-shadow-white: #fff;
$color-shadow-light: rgba(0, 0, 0, 0.05);
$color-shadow-dark: rgba(0, 0, 0, 0.2);
$color-shadow-gray-light: #ccc;
$color-shadow-gray-dark: #898787;

$color-text-placeholder-grey-dark: #666;

$btn-success-high-contrast-color: #fff;
$btn-info-high-contrast-color: #fff;
$btn-danger-high-contrast-color: #fff;

$primary-box-shadow: rgba(0, 0, 0, 0.2);
$alto: #ddd; //Borders
$secondary-blue: #15a5eb; // Link Hover

$ember-power-select-placeholder-color: #555;

$progress-bar-bg-bright: (primary: #428bca,
info: #5bc0de,
success: #5cb85c,
warning: #f0ad4e,
danger: #d9534f,
);

/*
 * OSF Color Palette
 */
$color-osf-primary: #337ab7;
$color-osf-secondary: #15a5eb;

$color-blue: #204762;
$color-pure-blue: #00f;
$color-hover: #e0ebf3;
$color-light: #eee;
$color-alt: #c7ffc7;
$color-select: #337ab7;
$color-grey: #333;
$color-filter-bg: #a4b3bd;
$color-red: #f00;
$color-green: #090;
$color-green-light: #90ee90;
$color-yellow: #ff0;
$color-turquoise: rgb(64, 224, 211);
$color-purple: rgb(154, 0, 192);
$color-black: #000;

.bg-color-blue {
    background-color: $color-blue;
}

.bg-color-hover {
    background-color: $color-hover;
}

.bg-color-light {
    background-color: $color-light;
}

.bg-color-alt {
    background-color: $color-alt;
}

.bg-color-select {
    background-color: $color-select;
}

.bg-color-grey {
    background-color: $color-grey;
}

/*
* Affiliated Institutions Color Palette
*/

$orcid-logo-color: #a6ce39;
