// =============================================================================
// ACCORDION (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--accordion:                          true; // 1

$accordion-borderColor:                         container("borderColor", "base");
$accordion-borderStyle:                         container("borderStyle");
$accordion-borderWidth:                         1px;
$accordion-border:                              $accordion-borderColor $accordion-borderStyle;
$accordion-margin:                              0 0 spacing("single");

$accordion-navigation-borderColor:              $accordion-borderColor;
$accordion-navigation-borderStyle:              $accordion-borderStyle;
$accordion-navigation-borderWidth:              1px 0;
$accordion-navigation-border:                   $accordion-border;
$accordion-navigation-paddingHorizontal:        (container("padding") + spacing("quarter"));
$accordion-navigation-paddingVertical:          container("padding");

$accordion-title-fontWeight:                    $font-weight-bold;
$accordion-title-lineHeight:                    lineHeight("small");
$accordion-title-padding:                       $accordion-navigation-paddingVertical $accordion-navigation-paddingHorizontal;

$accordion-content-borderColor:                 $accordion-borderColor;
$accordion-content-borderStyle:                 $accordion-borderStyle;
$accordion-content-borderWidth:                 0 0 1px;
$accordion-content-border:                      $accordion-border;

// Foundation Variables
// -----------------------------------------------------------------------------
//
// These variables come directly from:
// /vendor/foundation/foundation/components/*
// Declaring the variables here, you can adjust them all to your design,
// leaving the vendor framework untouched.
//
// -----------------------------------------------------------------------------

// $include-html-accordion-classes:                $include-html-classes;

$accordion-navigation-padding:                  $accordion-navigation-paddingHorizontal;
$accordion-navigation-bg-color:                 container("fill");
$accordion-navigation-hover-bg-color:           container("fill", "dark");
$accordion-navigation-active-bg-color:          container("fill");
$accordion-navigation-font-color:               stencilColor("color-textBase");
$accordion-navigation-font-size:                fontSize("base");
$accordion-navigation-font-family:              fontFamily("sans");

$accordion-content-padding:                     container("padding", "large");
$accordion-content-active-bg-color:             null;


// Stencil Variables
// -----------------------------------------------------------------------------

$accordion-borderRadius:                        $global-radius;

$accordion-navList-border:                      $accordion-border;
$accordion-navList-borderRadius:                $accordion-borderRadius;
$accordion-navList-borderWidth:                 1px;
$accordion-navList-spacing:                     spacing("single") + spacing("third");
$accordion-navList-padding:                     spacing("base");
