@import "./toast";
@import "./toast.md.vars";

// Material Design Toast
// --------------------------------------------------

.toast-md {
  --background: #{$toast-md-background};
  --color: #{$toast-md-title-color};

  font-family: $toast-md-font-family;
  font-size: $toast-md-title-font-size;
}

.toast-md .toast-wrapper {
  @include position-horizontal(0, 0);
  @include margin(auto);

  display: block;
  position: absolute;

  width: $toast-width;
  max-width: $toast-max-width;

  z-index: $z-index-overlay-wrapper;
}

.toast-md .toast-wrapper.toast-top {
  padding-top: var(--ion-safe-area-top);
}

.toast-md .toast-wrapper.toast-bottom {
  padding-bottom: var(--ion-safe-area-bottom);
}

.toast-md .toast-wrapper.toast-middle {
  opacity: .01;
}

.toast-md .toast-message {
  @include padding($toast-md-title-padding-top, $toast-md-title-padding-end, $toast-md-title-padding-bottom, $toast-md-title-padding-start);
}