/*
   imported from flash-alert.scss 
*/

/*
  When adding a color, please add it to the :export section at the end of this file.
  If you need to add a new section/type of color, you can add the section title to the :export by pre-prending it with an underscore.
*/
/**
 * Computes a CSS calc function that betweens a value from
 * A to B over viewport-width A to viewport-width B.
 * Requires a media query to cap the value at B.
 */
/**
 * Lightens or darkens a color based on its brightness
 */
/**
* This takes the current $color of the parent and sets the icon color
* to be the currentColor
*/
/**
* Determines the icon size for various different sizes of buttons
*/
/* Primary Colors */
/* Secondary Colors */
/* Gradients */
/* Transparencies */
/* stylelint-disable */

/* stylelint-enable */
/**
  If making changes to this file, please make sure the changes are reflected on the :export section at the end of the file.
 */
/**
 * Computes a CSS calc function that betweens a value from
 * A to B over viewport-width A to viewport-width B.
 * Requires a media query to cap the value at B.
 */
/**
 * Lightens or darkens a color based on its brightness
 */
/**
* This takes the current $color of the parent and sets the icon color
* to be the currentColor
*/
/**
* Determines the icon size for various different sizes of buttons
*/
/* IMPORT_PT: update these as the project sees fit */
/* stylelint-disable */

/* stylelint-enable */
/**
 * Computes a CSS calc function that betweens a value from
 * A to B over viewport-width A to viewport-width B.
 * Requires a media query to cap the value at B.
 */
/**
 * Lightens or darkens a color based on its brightness
 */
/**
* This takes the current $color of the parent and sets the icon color
* to be the currentColor
*/
/**
* Determines the icon size for various different sizes of buttons
*/
/* IMPORT_PT: update these as the project sees fit */
/* Line Heights */
/* stylelint-disable */

/* stylelint-enable */
.flash-alert__alert____kls2 {
  align-items: center;
  bottom: 0;
  color: #FFFFFF;
  display: flex;
  font-size: calc(16px + 2 * (100vw - 320px) / 1120);
  justify-content: space-between;
  left: 0;
  overflow: hidden;
  padding: calc(12.26277px + 1.16788vw);
  position: absolute;
  right: 0;
  white-space: nowrap;
  width: 100%;
  z-index: 3; }

.flash-alert__message___1CHjh {
  margin-right: calc(12.26277px + 1.16788vw);
  overflow: hidden;
  text-overflow: ellipsis; }

.flash-alert__success___3cJ9Z {
  background: linear-gradient(45deg, #B4EC51 0%, #429321 100%); }

.flash-alert__fail___1tslo {
  background: linear-gradient(90deg, #E5378F 0%, #F76B1C 100%); }

.flash-alert__enter___3FfVe {
  transform: translateY(100%);
  visibility: hidden; }

.flash-alert__enter-active___2TNnN {
  opacity: 1;
  transform: translateY(0);
  transition: transform 400ms;
  visibility: visible; }

.flash-alert__exit___2KkQ- {
  opacity: 1; }

.flash-alert__exit-active___NsbHQ {
  transform: translateY(100%);
  transition: transform 300ms; }
