/********
 * Colors
 ********/
/************
 * Typography
 ************/
/*
 * We can use the font weight fot the bold styling example below
 * .test-font { font-family: $font-default; } regular
 * .test-font-bold { font-family: $font-default; font-weight: $font-weight-bold; }
 * @see: _typography.scss
*/
/*****************
 * Global elements
 *****************/
/****************
 * Sizing/Spacing
 ****************/
/*******
 * Forms
 ******/
/***********
 * Bootstrap
 ***********/
/**********
 * Mappings
 *********/
/*
 * IMPORTANT:
 *   - This file should *only contain* variables not considered UN style guide *
 */
/**
  Help theming for rtl languages.
*/
/* background opacity */
/*
 * This handles indentation for the depth of child levels for accordion
 * TODO: improve this implementation, overly complex due to previous design
 */
/*
 * Reset the button appearance to make it look like regular text.
 *
 * The padding can be optionally passed, as it is usually overriden.
 *
 * @param {Number} $padding - The padding to apply to the button.
 */
.pattern-snackbar {
  display: inline-flex;
  align-items: center;
  border: 1px solid transparent;
  border-radius: 0.3125rem;
  line-height: 1.5;
}

.pattern-snackbar:not(.pattern-snackbar--tag):not(.pattern-snackbar--chips) {
  border-width: 2px;
}

.pattern-snackbar[class*=pattern-snackbar--][class*=bs-border-color] {
  padding-inline: 1rem;
  padding-block: 0.3125rem;
}

.pattern-snackbar__icon {
  padding-inline-end: 0.5rem;
  padding-block: 0.25rem;
}

.pattern-snackbar__close {
  cursor: pointer;
  padding-inline-start: 1rem;
  padding-block: 0.25rem;
  padding-right: 0;
  border: none;
  background: none;
}

.pattern-snackbar__icon, .pattern-snackbar__title, .pattern-snackbar__close {
  display: flex;
  align-items: center;
}

.pattern-snackbar--tag, .pattern-snackbar--chips {
  align-items: first baseline;
  border-radius: 0.625rem;
}

.pattern-snackbar--tag[class*=pattern-snackbar--][class*=bs-border-color], .pattern-snackbar--chips[class*=pattern-snackbar--][class*=bs-border-color] {
  padding-inline: 0.75rem;
  padding-block: 0.3125rem;
}

.pattern-snackbar--tag__selected {
  cursor: pointer;
}

.pattern-snackbar--tag__selected__disabled {
  cursor: not-allowed;
}

.pattern-snackbar--tag, .pattern-snackbar--tag__selected, .pattern-snackbar--tag__disabled {
  max-width: 230px;
  font-size: 0.875rem;
  line-height: 1.25rem;
}

.pattern-snackbar--tag a,
.pattern-snackbar--tag a:hover, .pattern-snackbar--tag__selected a,
.pattern-snackbar--tag__selected a:hover, .pattern-snackbar--tag__disabled a,
.pattern-snackbar--tag__disabled a:hover {
  color: inherit;
  text-decoration: none;
}

.pattern-snackbar--chips, .pattern-snackbar--chips__selected, .pattern-snackbar--chips__disabled {
  max-width: 295px;
}

.pattern-snackbar--chips__disabled, .pattern-snackbar--chips__disabled .pattern-snackbar__close {
  cursor: not-allowed;
}
