// Material Design Default Theme
// ----------------------------------

// Material Design General Colors
// --------------------------------------------------
$backdrop-md-color:                         $backdrop-color !default;
$border-md-color:                           var(--ion-border-color, #c1c4cd) !default;
$overlay-md-background-color:               var(--ion-overlay-background-color, #fafafa) !default;

// Material Design Tabs & Tab bar
// --------------------------------------------------
$tabbar-md-background-color:                $tabbar-background-color !default;
$tabbar-md-background-color-focused:        $tabbar-background-color-focused !default;
$tabbar-md-border-color:                    rgba(var(--ion-tabbar-border-color-rgb, 0, 0, 0), .07) !default; // TODO: @color-mod($border-md-color, a($alpha-lowest))
$tabbar-md-text-color:                      var(--ion-tabbar-text-color, $text-color-step-400) !default;
$tabbar-md-text-color-active:               $tabbar-text-color-active !default;

// Material Design Toolbar
// --------------------------------------------------
$toolbar-md-height:                         56px !default;
$toolbar-md-padding:                        4px !default;
$toolbar-md-background-color:               $toolbar-background-color !default;
$toolbar-md-border-color:                   var(--ion-toolbar-border-color, $border-md-color) !default;
$toolbar-md-color-active:                   var(--ion-toolbar-color-active, #4a4a4a) !default;
$toolbar-md-color-inactive:                 $toolbar-color-inactive !default;
$toolbar-md-text-color:                     var(--ion-toolbar-text-color, #424242) !default;

// Material Design List & List Items
// --------------------------------------------------
$item-md-background-color-active:           var(--ion-item-background-color-active, #f1f1f1) !default;
$item-md-border-color:                      rgba(var(--ion-item-border-color-rgb, 0, 0, 0), .13) !default;
$item-md-text-color:                        $item-text-color !default;