/*
 * This is a manifest file that'll be compiled into application.css, which will include all the files
 * listed below.
 *
 * Any CSS and SCSS file within this directory, lib/assets/stylesheets, or any plugin's
 * vendor/assets/stylesheets directory can be referenced here using a relative path.
 *
 * You're free to add application-wide styles to this file and they'll appear at the bottom of the
 * compiled file so the styles you add here take precedence over styles defined in any other CSS/SCSS
 * files in this directory. Styles in this file should be added after the last require_* statement.
 * It is generally better to create a new file per style scope.
 *
 *= require_self
 */
html, body {
  width: 100vw;
  height: 100vh;
}

@keyframes openFromSide {
  0% {
    transform: translateX(-30%);
  }
  100% {
    transform: translateX(0);
  }
}
@keyframes closeToSide {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
.open {
  animation: openFromSide 0.3s forwards;
}

.closed {
  animation: closeToSide 0.3s forwards !important;
}

/* Rails flash message boxes */
.snackbar {
  padding: 14px;
  font-size: 0.85rem;
  position: fixed;
  top: 8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 9999;
  border-radius: 14px;
}

.error {
  background-color: #FFDAD6; /* KyronPalette errorContainer.main */
  color: #410002; /* Kyron Palette errorContainer.contrastText */
  box-shadow: 4px 4px 24px rgba(236, 201, 197, 0.6666666667); /* Kyron Palette errorContainer.dark with 0.5 transparency */
}

.info {
  background-color: #CECAD1; /* KyronPalette infoContainer.main */
  color: #434145; /* Kyron Palette infoContainer.contrastText */
  box-shadow: 4px 4px 24px rgba(185, 182, 188, 0.6666666667); /* Kyron Palette infoContainer.dark with 0.5 transparency */
}

/* The close button */
.snackbar-close-button {
  height: 16px;
  width: 16px;
  display: grid;
  margin-left: 16px;
  padding: 12px;
  place-content: center;
  float: right;
  font-size: 24px;
  cursor: pointer;
  transition: 0.3s;
  border-radius: 50%;
}

/* When moving the mouse over the close button */
.snackbar-close-button:hover {
  background-color: rgba(0, 0, 0, 0.3333333333); /* just a little transparent black to indicate hover */
}

.debug {
  position: fixed;
  bottom: 4px;
  right: 4px;
  z-index: 100;
}

.debug a {
  color: red;
  font-size: 10px;
  text-decoration: none;
}

/*# sourceMappingURL=/assets/application-ef9629a1.css.map */
