/** 
 * The Kind of Blue Theme 
 * was inspired by the Absolution Theme 
 * by Michael Vanderheeren
 * Copyright (c) 2010 Michael Vanderheeren
 * 
 * Please follow the his Github project to stay up to date on that theme:
 * https://github.com/michaelvanderheeren/Absolution
 * 
 * Kind of Blue will be maintained within the compass-ui project. 
 */
@import "compass/css3/border-radius";
@import "compass/css3/images";
@import "compass/css3/opacity";
@import "compass/css3/box-shadow";
@import "compass/css3/text-shadow";
@import "compass/utilities/general/clearfix";

@import "compass-ui";
@import "kindofblue/dialog";
@import "kindofblue/accordion";
@import "kindofblue/autocomplete";
@import "kindofblue/datepicker";
@import "kindofblue/slider";
@import "kindofblue/tabs";
@import "kindofblue/color_extensions";
@import "kindofblue/formalize";

@mixin kindofblue-theme {
  @include jquery-ui-theme;
  @include kindofblue-dialog;
  @include kindofblue-accordion;
  @include kindofblue-autocomplete;
  @include kindofblue-datepicker;
  @include kindofblue-slider;
  @include kindofblue-tabs;
  @include kindofblue-color-extensions;
  @include kindofblue-formalize;
}

// Default Radius
$ui-border-radius: 5px;

// Default Fonts
$ui-font-family: "Helvetica Neue", Arial, "Liberation Sans", FreeSans, sans-serif;

$ui-fixed-font-family: "andale mono", "lucida console", monospace;

$ui-font-size: 1.0em;

$ui-widget-font-size: 1em;

$ui-form-font-size: 1em;

$ui-header-font-weight: bold;

// ------------------------------------------
// Icon Images 
// ------------------------------------------
$ui-images-url: "kindofblue/";
$ui-icons: "ui-icons_222222_256x240.png";
$ui-icons-content: $ui-icons;
$ui-icons-header: $ui-icons;
$ui-icons-default: $ui-icons;
$ui-icons-hover: "ui-icons_ffffff_256x240.png";
$ui-icons-focus: $ui-icons-hover;
$ui-icons-active: $ui-icons-hover;
$ui-icons-highlight: $ui-icons;
$ui-icons-error: $ui-icons-hover;

// ------------------------------------------
// Color Scheme
// ------------------------------------------

// $kob-blue-light: #5e9ae2;
// $kob-blue-medium: #3570b8;
// $kob-blue-dark: #2e63a5;
$kob-font-color: #333333; 
$kob-shadow-color: #282425;

$kob-blue-dark: #0064CD;
$kob-blue-medium: lighten($kob-blue-dark, 5%);
$kob-blue-light: lighten($kob-blue-medium, 20%);

$kob-highlight-light: #F9C42E;
$kob-highlight-light: lighten($kob-highlight-light, 10%);
$kob-highlight-dark: darken($kob-highlight-light, 10%);
$kob-highlight-color: $kob-font-color;

$kob-error-light: adjust-color($kob-highlight-light, $hue: -44);
$kob-error-dark: darken($kob-error-light, 30%);
$kob-error-color: $ui-white;

$kob-safe-light: adjust-color($kob-highlight-light, $hue: 45, $lightness: -22%);
$kob-safe-dark: darken($kob-safe-light, 10%);
$kob-safe-color: darken($kob-safe-dark, 5%);

$kob-buttonpane-background-color: #dedede;

// content
$ui-content-border-color: #a9a9a9; 
$ui-content-color: $kob-font-color;
$ui-content-link-color: $ui-content-color;
$ui-content-background-color: #fdfdfd;
$ui-content-background: linear-gradient($ui-content-background-color,#ececec);
$ui-content-background-type: image;

// header
$ui-header-border-color: $kob-blue-dark;
$ui-header-color: $ui-white;
$ui-header-link-color: $ui-header-color;
$ui-header-background-color: $kob-blue-light;
$ui-header-background: linear-gradient($kob-blue-light, $kob-blue-dark);
$ui-header-background-type: image;


// titlebar
$ui-titlebar-color: $kob-font-color;
$ui-titlebar-background-color: $ui-white;
$ui-titlebar-background: none;
$ui-titlebar-background-type: default;
$ui-titlebar-bottom-border-color: #c1c1c1;
$ui-titlebar-bottom-border-width: 1px;
// $ui-titlebar-bottom-border-color: $kob-blue-light;

// state-default
$ui-default-border-color: #a9a9a9;
$ui-default-color: $kob-font-color;
$ui-default-background-color: #fdfdfd;
$ui-default-background: linear-gradient($ui-default-background-color,#ececec);
$ui-default-link-color: $ui-default-color;

// state-hover
$ui-hover-border-color: $kob-blue-dark;
$ui-hover-color: #ffffff;
$ui-hover-background-color: $kob-blue-light;
$ui-hover-background: linear-gradient($ui-hover-background-color,$kob-blue-medium);
$ui-hover-link-color: $ui-hover-color;

// state-active
$ui-active-border-color: $kob-blue-dark;
$ui-active-color: #ffffff; 
$ui-active-background-color: $kob-blue-medium;
$ui-active-background: linear-gradient($ui-active-background-color,$kob-blue-light);
$ui-active-link-color: $ui-active-color;

// state-highlight
$ui-highlight-border-color: $kob-highlight-dark;
$ui-highlight-color: $kob-highlight-color;
$ui-highlight-background-color: $kob-highlight-light; 
$ui-highlight-background: $ui-highlight-background-color;
$ui-highlight-background-type: default;
$ui-highlight-link-color: $ui-highlight-color;

// state-error
$ui-error-border-color: $kob-error-dark;
$ui-error-color: $kob-error-color;
$ui-error-background-color: $kob-error-light; 
$ui-error-background: $ui-error-background-color; 
$ui-error-background-type: default;
$ui-error-link-color: $ui-error-color;

// state-danger
$ui-danger-border-width: 1px;
$ui-danger-border-style: solid;
$ui-danger-border-color: $kob-error-dark;
$ui-danger-color: $kob-error-dark;
$ui-danger-font-weight: bold;
$ui-danger-hover-color: $ui-white;
$ui-danger-background-color: $kob-error-light; 
$ui-danger-background: linear-gradient($kob-error-light, $kob-error-dark);
$ui-danger-background-type: image;

// state-safe
$ui-safe-border-width: 1px;
$ui-safe-border-style: solid;
$ui-safe-border-color: $kob-safe-dark;
$ui-safe-color: $kob-safe-color;
$ui-safe-font-weight: bold;
$ui-safe-hover-color: $ui-white;
$ui-safe-background-color: $kob-safe-light; 
$ui-safe-background: linear-gradient($kob-safe-light, $kob-safe-dark);
$ui-safe-background-type: image;

// state-primary

// priority-secondary
$ui-priority-secondary-opacity: .7;

// state-disabled
$ui-disabled-opacity: .35;

// overlay
$ui-overlay-opacity: .3;
$ui-overlay-background-color: $kob-shadow-color;
$ui-overlay-background: linear-gradient($ui-overlay-background-color,adjust-lightness($ui-overlay-background-color, -5));
$ui-overlay-background-type: image;

// shadow
$ui-shadow-opacity: .3;
$ui-shadow-background-color: $kob-shadow-color;
$ui-shadow-background: linear-gradient($ui-shadow-background-color,adjust-lightness($ui-shadow-background-color, -5));
$ui-shadow-background-type: image;