/* .notify {
  position: fixed;
  z-index: 1000;
  height: auto;
  max-width: 423px;
  padding: 15px 20px;
  width: 60vw;
  filter: drop-shadow(0px 12px 20px rgba(0, 0, 0, 0.12));
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.notify.right_bottom {
  right: 20px;
  bottom: 40px;
}

.notify.left_bottom {
  left: 20px;
  bottom: 40px;
}

.notify svg {
  margin-right: 10px;
}

.notify.error {
  background: #FFEDEC;
  border: 1px solid #FFB8B4;
}

.notify.success {
  background: #D5F9D7;
  border: 1px solid #AEE7BD;
}

.notify.error div {
  color:#212529;
}

.notify.success div {
  color:#212529;
} */

/* Общие стили контейнеров */
.notify-container,
.message-container {
    position: fixed;
    z-index: 10000;
    top: 35px;
}

/* Анимации */
.notify-enter-active,
.notify-leave-active,
.message-enter-active,
.message-leave-active {
    transition: all 0.3s ease;
}

.notify-enter-from,
.notify-leave-to {
    opacity: 0;
    transform: translateY(-20px);
}

.message-enter-from,
.message-leave-to {
    opacity: 0;
    transform: translateX(100%);
}

/* Стили для центральных уведомлений */
.notify-container {
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 10px;
    max-width: 32%;
}

/* Стили для боковых сообщений */
.message-container {
    right: 10px;
    top: 75px;
    max-width: 32%;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 10px;
}

/* Базовые стили уведомлений */
.notify {
    padding: 12px;
    border-radius: 4px;
    display: flex;
    align-items: center;
    gap: 8px;
    border-width: 1px;
    border-style: solid;
    color: #4E4E4E;
    background: #ffffff;
}

/* Модификаторы категорий */
.notify--success {
    background: #E5FEE6;
    border-color: rgba(0, 176, 80, 0.5);
}

.notify--error {
    background: #FEE7E5;
    border-color: rgba(255, 44, 30, 0.5);
}

.notify--warn {
    background: #FEF6E5;
    border-color: rgba(255, 188, 0, 0.5);
}

.notify--loading,
.notify--info {
    background: #E6F9FD;
    border-color: rgba(0, 176, 240, 0.5);
}

/* Внутренние элементы */
.notify__content {
    flex-grow: 1;
    padding-top: 0px;
}

.notify__close {
    background: none;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 5px;
}

.notification-icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.notification-icon.icon--success {
    color: rgba(0, 176, 80, 0.5);
}
.notification-icon.icon--error { 
    color: rgba(255, 0, 0, 0.5); 
}
.notification-icon.icon--warn { 
    color: rgba(255, 188, 0, 0.5); 
}
.notification-icon.icon--loading { 
    color: rgba(0, 176, 240, 0.5); 
}
.notification-icon.icon--info { 
    color: rgba(0, 176, 240, 0.5); 
}

.message .notification-icon {
    width: 20px;
    height: 20px;
}

.notify__close-icon {
    width: 12px;
    height: 12px;
    opacity: 0.5;
    transition: opacity 0.3s ease;
}

.notify__close:hover .notify__close-icon {
    opacity: 1;
}

.notify__icon {
    width: 16px;
    height: 16px;
    flex-shrink: 0;
}

.icon--success { color: rgba(0, 176, 80, 0.5); }
.icon--error { color: rgba(255, 44, 30, 0.5); }
.icon--warn { color: rgba(255, 188, 0, 0.5); }
.icon--loading,
.icon--info { color: rgba(0, 176, 240, 0.5); }

/* Текстовые элементы */
.notify__title {
    font-size: 15px;
    line-height: 100%;
    font-weight: 500;
    color: #4E4E4E;
    margin-bottom: 6px;
    font-family: 'Roboto', sans-serif;
}

.notify__subtitle {
    font-weight: 400;
    font-size: 14px;
    line-height: 15px;
    color: #ADADAD;
    margin-bottom: 6px;
    font-family: 'Roboto', sans-serif;
}

.notify__text {
    word-break: break-word;
    font-size: 14px;
    line-height: 100%;
    font-weight: 400;
    color: #4E4E4E;
    font-family: 'Roboto', sans-serif;
}

.notify__link {
    color: #00B0F0;
    opacity: 0.7;
    transition: opacity 0.3s ease;
    font-family: 'Roboto', sans-serif;
}

.notify__link:hover {
    opacity: 1;
}

/* Модификатор для сообщений */
.notify.message {
    box-shadow: 0 2px 6px 2px rgba(32, 32, 32, 0.14);
    border: none;
    align-items: flex-start;
    padding: 14px;
}

.notify.message .notify__content {
    padding-top: 3px;
}

@keyframes notify-appear {
    from {
      opacity: 0;
      transform: translateY(-20px);
    }
    to {
      opacity: 1;
      transform: translateY(0);
    }
  }
  
  @keyframes notify-disappear {
    to {
      opacity: 0;
      transform: translateY(-20px);
    }
  }
  
  @keyframes message-appear {
    from {
      opacity: 0;
      transform: translateX(100%);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }
  
  @keyframes message-disappear {
    to {
      opacity: 0;
      transform: translateX(100%);
    }
  }
  
  /* Общие стили для анимаций */
  .notify,
  .message {
    animation-duration: 0.3s;
    animation-timing-function: ease;
  }
  
  /* Классы для активации анимаций */
  .notify.appear {
    animation-name: notify-appear;
  }
  
  .notify.disappear {
    animation-name: notify-disappear;
  }
  
  .message.appear {
    animation-name: message-appear;
  }
  
  .message.disappear {
    animation-name: message-disappear;
  }