// Material Design Card
// --------------------------------------------------

$card-md-background-color:            $list-background-color !default;
$card-md-box-shadow:                  0 2px 2px 0 rgba(0,0,0,.14), 0 3px 1px -2px rgba(0,0,0,.2), 0 1px 5px 0 rgba(0,0,0,.12) !default;
$card-md-border-radius:               2px !default;
$card-md-font-size:                   1.4rem !default;

$card-md-header-font-size:            2.4rem !default;
$card-md-header-background-color:     $card-md-background-color !default;
$card-md-header-padding:              16px;

$card-md-footer-background-color:     $card-md-background-color !default;
$card-md-footer-padding:              16px;


.card.list[mode=md] {
  background: $card-md-background-color;
  box-shadow: $card-md-box-shadow;
  border-radius: $card-md-border-radius;
  font-size: $card-md-font-size;
  overflow: hidden;

  .item:first-child {
    margin-top: 0;
  }

  .item:last-child {
    margin-bottom: 0;
    padding-bottom: 8px;
  }

  .item::before,
  .item::after {
    border: none;
  }

  .item-content button:first-child,
  .item-content [button]:first-child {
    margin-left: 0;
  }

  .item-content {
    margin-top: 8px;
    margin-bottom: 8px;
  }

  ion-header {
    padding: $card-md-header-padding;
    font-size: $card-md-header-font-size;
    background-color: $card-md-footer-background-color;
  }

  ion-footer {
    padding: $card-md-footer-padding;
    background-color: $card-md-footer-background-color;
  }

  .item > img {
    padding-bottom: 8px;
  }

  h1 {
    margin: 0 0 2px;
    font-size: 2.4rem;
  }

  h2 {
    margin: 2px 0 2px;
    font-size: 1.6rem;
  }

  h3,
  h4,
  h5,
  h6 {
    margin: 2px 0 2px;
    font-size: 1.4rem;
  }

  p {
    font-size: 1.4rem;
    margin: 0 0 2px;
  }

}