/* REMINDME-CSS-0101 */
.rm-toast-host{
  position: fixed;
  top: 16px;
  right: 16px;
  width: min(420px, calc(100vw - 32px));
  z-index: 1080;
  pointer-events: none;
}

.rm-toast{
  pointer-events: auto;
  border: 0;
  border-radius: 12px;
  padding: 14px 16px;
  display: flex;
  gap: 12px;
  align-items: flex-start;
  box-shadow: 0 10px 28px rgba(0,0,0,0.18);
  background: #fff;
}

.rm-toast + .rm-toast{ margin-top: 10px; }

.rm-toast-icon{
  font-size: 1.25rem;
  line-height: 1;
  margin-top: 2px;
}

.rm-toast-title{
  font-weight: 700;
  margin: 0 0 2px 0;
}

.rm-toast-text{
  margin: 0;
  font-size: 0.92rem;
  opacity: 0.85;
}

.rm-toast-close{
  border: 0;
  background: transparent;
  line-height: 1;
  padding: 2px 4px;
  margin-left: 6px;
  opacity: 0.7;
}

.rm-toast-close:hover{ opacity: 1; }

.rm-toast-enter{ animation: rmToastIn 170ms ease-out; }
.rm-toast-exit{ animation: rmToastOut 170ms ease-in forwards; }

@keyframes rmToastIn{
  from{ opacity: 0; transform: translateY(-8px); }
  to{ opacity: 1; transform: translateY(0); }
}

@keyframes rmToastOut{
  from{ opacity: 1; transform: translateY(0); }
  to{ opacity: 0; transform: translateY(-8px); }
}