:import {
  -st-from: '../../../Foundation/stylable/colors.st.css';
  -st-named: G10, R10, D80, Y05, D10;
}

:import {
  -st-from: '../../../Foundation/stylable/shadows.st.css';
  -st-named: shadow30;
}

.toast {
  -st-states: showDismiss, success, warning, error;
  position: relative;
  box-sizing: border-box;
  margin-top: 6px;
  border-radius: 8px;
  padding: 9px 18px 9px 12px;
  box-shadow: value(shadow30);
  display: flex;
  cursor: pointer;
  background: value(D10);
  max-width: 780px;
}

.toast:showDismiss .secondAction {
  padding-right: 18px;
}

.toastText {
  width: 100%;
  padding-right: 24px;
}

.iconContainer {
  display: flex;
  padding-right: 7px;
  width: 24px;
  color: value(D80)
}

.toast:success .iconContainer {
  color: value(G10)
}

.toast:warning .iconContainer {
  color: value(Y05)
}

.toast:error .iconContainer {
  color: value(R10)
}

/* st-namespace-reference="../../../../../src/Toast/components/ToastItem/ToastItem.st.css" */