// =============================================================================
// DROPDOWN BUTTONS (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--dropdown-buttons:           $exportCSS !default; // 1


// 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-dropdown-buttons-classes: $include-html-classes !default;

// We use these to set the color of the pip in dropdown buttons
$dropdown-button-pip-color:             color("greys") !default;
$dropdown-button-pip-color-alt:         color("whites", "bright") !default;

$button-pip-tny:                        spacing("sixth") !default;
$button-pip-sml:                        spacing("fifth") !default;
$button-pip-med:                        spacing("quarter") !default;
$button-pip-lrg:                        spacing("quarter") !default;

// We use these to style tiny dropdown buttons
$dropdown-button-padding-tny:           $button-pip-tny * 4 !default;
$dropdown-button-pip-size-tny:          $button-pip-tny !default;
$dropdown-button-pip-opposite-tny:      $button-pip-tny !default;
$dropdown-button-pip-top-tny:           -$button-pip-tny / 2 !default;

// We use these to style small dropdown buttons
$dropdown-button-padding-sml:           $button-pip-sml * 6 !default;
$dropdown-button-pip-size-sml:          $button-pip-sml !default;
$dropdown-button-pip-opposite-sml:      $button-pip-sml * 2 !default;
$dropdown-button-pip-top-sml:           -$button-pip-sml / 2.5 !default;

// We use these to style medium dropdown buttons
$dropdown-button-padding-med:           $button-pip-med * 6.5 !default;
$dropdown-button-pip-size-med:          $button-pip-med !default;
$dropdown-button-pip-opposite-med:      $button-pip-med * 2.5 !default;
$dropdown-button-pip-top-med:           -$button-pip-med / 3 !default;

// We use these to style large dropdown buttons
$dropdown-button-padding-lrg:           $button-pip-lrg * 7 !default;
$dropdown-button-pip-size-lrg:          $button-pip-lrg !default;
$dropdown-button-pip-opposite-lrg:      $button-pip-lrg * 3 !default;
$dropdown-button-pip-top-lrg:           -$button-pip-lrg / 3 !default;