// Custom component variables (non-bootstrap components)

//Arrow compoanent variables
$arrow-color:                               $theme-primary-color;
$arrow-bar-bg:                              scale-color($theme-primary-color, $lightness: -25%);
$arrow-text-color:                          $white;
$arrow-link-color:                          $white;
$arrow-link-hover-color:                    $theme-primary-color;
$arrow-link-active-color:                   $theme-text-color;
$arrow-link-background-color:               $white;

$dashboard-widget-border-radius:            50%;
$dashboard-widget-bg:                       scale-color($theme-secondary-color, $lightness: 90%);
$dashboard-widget-hover-bg:                 scale-color($theme-primary-color, $lightness: 80%);
$dashboard-widget-title-color:              $theme-text-color;
$dashboard-widget-circle-bg:                transparent;
$dashboard-widget-cirlce-icon-color:        $theme-secondary-color;

// Portfolios page header
$pageheader-bg:                             scale-color($theme-primary-color, $lightness: 95%);

// Header navbar
$navbar-default-bg:                         $theme-primary-color;
$navbar-default-border:                     scale-color($navbar-default-bg, $lightness: 5%);

// Navbar toggle
$navbar-toggle-color:                       $white;
$navbar-toggle-bg:                          transparent;
$navbar-toggle-hover-color:                 $white;
$navbar-toggle-hover-bg:                    scale-color($navbar-default-bg, $lightness: -10%);
$navbar-toggle-active-color:                $white;
$navbar-toggle-active-bg:                   scale-color($navbar-default-bg, $lightness: -10%);

// Navbar menu
$navbar-default-link-border:                scale-color($navbar-default-bg, $lightness: 5%);
$navbar-default-link-color:                 $white;
$navbar-default-link-hover-color:           $white;
$navbar-default-link-bg:                    $theme-primary-color;
$navbar-default-link-hover-bg:              scale-color($navbar-default-bg, $lightness: -10%);
$navbar-default-active-color:               $white;
$navbar-default-active-bg:                  scale-color($navbar-default-bg, $lightness: -15%);

// Navbar menus children
$navbar-inverse-bg:                         scale-color($theme-primary-color, $lightness: 90%);
$navbar-inverse-link-color:                 $gray-700;
$navbar-inverse-link-hover-color:           $gray-700;
$navbar-inverse-link-hover-bg:              scale-color($navbar-inverse-bg, $lightness: -10%);
$navbar-inverse-link-active-color:          $black;
$navbar-inverse-link-active-bg:             scale-color($navbar-inverse-bg, $lightness: -10%);

// Navbar menu children toggles
$navbar-inverse-toggle-color:               $white;
$navbar-inverse-toggle-bg:                  transparent;
$navbar-inverse-toggle-hover-color:         $gray-700;
$navbar-inverse-toggle-hover-bg:            scale-color($theme-primary-color, $lightness: 90%);
$navbar-inverse-toggle-active-color:        $black;
$navbar-inverse-toggle-active-bg:           scale-color($theme-primary-color, $lightness: 90%);
