/*
  MFP Design System — Snackbar
  Production CSS for snackbar component.
  Import tokens.css before this file.
*/

/* ======================================================================
   SNACKBAR
   ====================================================================== */
.snackbar {
  display: flex;
  align-items: center;
  gap: var(--space-12);
  padding: var(--space-12) var(--space-16);
  border-radius: var(--radius-lg);
  box-shadow: var(--shadow-2);
  font: var(--type-body-base);
  width: 100%;
}

.snackbar__text { flex: 1; }

.snackbar__icon {
  font-size: 20px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  color: inherit;
  font-variation-settings: 'FILL' 0;
}

.snackbar__close {
  font-size: 20px;
  width: 20px;
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-shrink: 0;
  cursor: pointer;
  color: inherit;
}

.snackbar--success  { background: var(--color-success); color: var(--color-darkest-grey); }
.snackbar--critical { background: var(--color-danger);  color: var(--color-white); }
.snackbar--warning  { background: var(--color-warning); color: var(--color-darkest-grey); }