// =============================================================================
// TABS (Settings)
// =============================================================================


// BigCommerce Variables
// -----------------------------------------------------------------------------
//
// These scoped variables are created by BigCommerce.
// All variables that are not from Foundation should be placed here.
//
// 1. Choose whether to include the BigCommerce class names
//
// -----------------------------------------------------------------------------

$exportCSS--tabs:                                true; // 1

$tab-bg-color:                                   transparent;

$tabs-border-color:                              container("borderColor");
$tabs-bottom-border:                             1px solid $tabs-border-color;
$tabs-margin:                                    0;

$tab-display:                                    block;
$tab-margin:                                     0;

$tab-title-border-color:                         $body-bg;
$tab-title-border:                               1px solid $tab-title-border-color;
$tab-title-border-bottom-style:                  null;
$tab-title-border-bottom-height:                 null;
$tab-title-border-bottom-offset:                 -1px;

$tab-title-active-border-color:                  null;
$tab-title-active-font-weight:                   fontWeight("bold");

$tab-navigation-display:                         block;
$tab-navigation-container-padding:               0;


//
// Vertical tab settings
// -----------------------------------------------------------------------------

$tabs--vertical-borderBottom:                    0;
$tabs--vertical-float:                           $default-float;
$tabs--vertical-maxWidth:                        20%;
$tabs--vertical-width:                           20%;
$tabs--vertical-tab-float:                       none;

$tabs-contents--vertical-floatDirection:         $default-float;
$tabs-contents--vertical-maxWidth:               80%;
$tabs-contents--vertical-padding:                0 spacing("single");
$tabs-contents--vertical-floatDirection-padding: spacing("single");
$tabs-contents--vertical-width:                  80%;


// Foundation Variables
// -----------------------------------------------------------------------------

$include-html-tabs-classes:                      $include-html-classes;

$tabs-navigation-padding:                        spacing("half");
$tabs-navigation-bg-color:                       null;
$tabs-navigation-active-bg-color:                null;
$tabs-navigation-hover-bg-color:                 null;
$tabs-navigation-font-color:                     stencilColor("color-textSecondary");
$tabs-navigation-active-font-color:              $body-font-color;
$tabs-navigation-font-size:                      fontSize("smaller");
$tabs-navigation-font-family:                    null;

$tabs-content-margin-bottom:                     spacing("single");
$tabs-content-padding:                           spacing("single") 0;

$tabs-vertical-navigation-margin-bottom:         spacing("single");


// Foundation Variables
// -----------------------------------------------------------------------------

$tab-active-border-color:                        $tabs-border-color;
$tab-active-border:                              1px solid $tab-active-border-color;
$tab-title-text-decoration:                      none;
