$asset_suffix: if($variant == 'dark', '-dark', '');
$con_asset_suffix: if($variant=='dark', '', '-dark');
$extra_background_clip: if($variant == 'light', padding-box, border-box);

$panel-corner-radius: 0;

// font families
$font-family: "M+ 1c", Roboto, Cantarell, Sans-Serif;
$large-font-family: Roboto, "M+ 1c", Cantarell, Sans-Serif;

// font sizes
$root-font-size: if($laptop == 'false', 14px, 13px);
$subheading-size: if($laptop == 'false', 16px, 15px);

// opacities
$higher_opacity: 0.9;
$middle_opacity: 0.6;
$lower_opacity: 0.3;

$secondary_opacity: 0.75;
$hint_opacity: 0.6;
$disabled_opacity: 0.45;

// sizes
$small_size: if($laptop == 'false', 24px, 20px);
$medium_size: if($laptop == 'false', 36px, 32px);
$large_size: if($laptop == 'false', 48px, 44px);
$menuitem_size: if($laptop == 'false', 32px, 28px);
$container_padding: 6px;

// radiuses
$circular_radius: 9999px;
$bt_radius: 6px;
$bd_radius: 8px;
$wm_radius: 14px;
$mn_radius: 10px;

// durations
$shorter_duration: 100ms;
$longer_duration: 150ms;
$ripple_duration: 250ms;

// timing functions
$standard_curve: cubic-bezier(0.4, 0.0, 0.2, 1);
$deceleration_curve: cubic-bezier(0.0, 0.0, 0.2, 1);
$acceleration_curve: cubic-bezier(0.4, 0.0, 1, 1);
$sharp_curve: cubic-bezier(0.4, 0.0, 0.6, 1);
$ease-out-quad: cubic-bezier(0.25, 0.46, 0.45, 0.94);

// transition shorthands
$shorter_transition: all $shorter_duration $deceleration_curve;
$longer_transition: all $longer_duration $deceleration_curve;
$shadow_transition: box-shadow $longer_duration $deceleration_curve;
$button_transition: all $shorter_duration $ease-out-quad;
$backdrop_transition: $longer_duration ease-out;

// Shadow
$shadow_0: 0 1px 2px 0 rgba(black, 0.1), 0 2px 2px 0 rgba(black, 0.05);     // Slider hover shadow
$shadow_1: 0 1px 1px 0 rgba(black, 0.12), 0 1px 2px 0 rgba(black, 0.06);    // Header-button shadow
$shadow_2: 0 1px 1px 0 rgba(black, 0.1), 0 1px 2px 0 rgba(black, 0.05);     // Slider normal shadow
$shadow_3: 0 1px 1px 0 rgba(black, 0.03), 0 1px 2px 0 rgba(black, 0.01);    // Normal button shadow
$shadow_4: 0 2px 3px 0 rgba(black, 0.2), 0 3px 5px 0 rgba(black, 0.15);     // Switch-slider hover shadow
$shadow_5: 0 1px 2px 0 rgba(black, 0.15), 0 2px 3px 0 rgba(black, 0.1);     // Switch-slider normal shadow
$shadow_6: 0 0 8px rgba(black, 0.2), 0 0 4px rgba(black, 0.3);              // Switch-slider normal shadow
$text_shadow: 0 -1px rgba(white, 0.04), -1px 0 rgba(black, 0.05),
              1px 0 rgba(black, 0.05), 0 1px rgba(black, 0.3),
              0 2px rgba(black, 0.05);                                      // text and icon shadow
