// Custom component variables (non-bootstrap components)

//Arrow component variables
$arrow-color:                               $theme-primary-color;
$arrow-bar-bg:                              scale-color($arrow-color, $lightness: 5%);
$arrow-text-color:                          $white;
$arrow-link-color:                          $white;
$arrow-link-hover-color:                    $black;
$arrow-link-active-color:                   $gray-700;
$arrow-link-background-color:               $white;

$arrow-alt-color:                           $theme-secondary-color; //to theme the Résumé nav and Groups nav green

// color for the secondary title in sections (cf. groups)
$section-heading-color:                     #999;

$admin-title-color:                         $white;
$admin-title-bg:                            transparent;

$dashboard-widget-bg:                       $white;
$dashboard-widget-hover-bg:                 $theme-primary-color;

$help-icon-color:                           #047DB1;
$rss-icon-color:                            #FE6500;

// Header navbar
$navbar-default-bg:                         $theme-primary-color;
$navbar-default-border:                     transparent;

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

// Navbar menu
$navbar-default-link-border:                transparent;
$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-link-bg, $lightness: -10%);
$navbar-default-active-color:               $white;
$navbar-default-active-bg:                  scale-color($navbar-default-link-bg, $lightness: -20%);

// Navbar menus children
$navbar-inverse-bg:                         scale-color($navbar-default-link-bg, $lightness: -10%);
$navbar-inverse-link-color:                 $white;
$navbar-inverse-link-hover-color:           $white;
$navbar-inverse-link-hover-bg:              scale-color($navbar-inverse-bg, $lightness: -15%);
$navbar-inverse-link-active-color:          $theme-text-color;
$navbar-inverse-link-active-bg:             $white;

// Navbar menu children toggles
$navbar-inverse-toggle-color:               $white;
$navbar-inverse-toggle-bg:                  transparent;
$navbar-inverse-toggle-hover-color:         $white;
$navbar-inverse-toggle-hover-bg:            transparent;
$navbar-inverse-toggle-active-color:        $white;
$navbar-inverse-toggle-active-bg:           transparent;

//== Tabs
$nav-tabs-border-color:                     $gray-100;

$nav-tabs-link-hover-border-color:          $theme-primary-color;

$nav-tabs-active-link-hover-bg:             $body-bg;
$nav-tabs-active-link-hover-color:          $theme-primary-color;
$nav-tabs-active-link-hover-border-color:   $theme-primary-color;

$nav-tabs-justified-link-border-color:            #f7f7f7;
$nav-tabs-justified-active-link-border-color:     $body-bg;

//== Buttons
$btn-secondary-color:            $gray-700;
$btn-secondary-bg:               #F9F9F9;
$btn-secondary-border:           $gray-200;

$btn-primary-color:              $white;
$btn-primary-bg:                 $theme-primary-color;
$btn-primary-border:             scale-color($btn-primary-bg, $lightness: -5%);

$btn-success-color:              $white;
$btn-success-bg:                 $theme-primary-color;
$btn-success-border:             scale-color($theme-primary-color, $lightness: -5%);

// Cards
$card-secondary-header-color:    $white;
$card-secondary-border-width:    0;

// Collapse/expand indicator
$collapse-indicator-color:                  scale-color($theme-primary-color, $lightness: 10%);
$collapse-indicator-hover-color:            $theme-primary-color;

// User icon border radius
$user-icon-border-radius:                   50%;
