/* =================================================================
   ReviewMoa Toast System - Glassy Design
   ================================================================= */

/* 기본 토스트 컨테이너 - 글래시 효과 */
.toastify.on {
  /* 글래시 효과 (유리 느낌) */
  backdrop-filter: blur(12px) saturate(180%);
  -webkit-backdrop-filter: blur(12px) saturate(180%);
}

.toastify {
  font-family: 'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, sans-serif !important;
  animation: slideInRight 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94) !important;
}

/* 우측에서 슬라이드 인 */
@keyframes slideInRight {
  from {
    opacity: 0;
    transform: translateX(100px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* 사라질 때 애니메이션 */
.toastify.toastify-close {
  animation: slideOutRight 0.25s ease-out !important;
}

@keyframes slideOutRight {
  from {
    opacity: 1;
    transform: translateX(0);
  }
  to {
    opacity: 0;
    transform: translateX(100px);
  }
}

/* ReviewMoa 커스텀 클래스 */
.reviewmoa-toast {
  /* 글래시 효과 강화 */
  backdrop-filter: blur(12px) saturate(180%) !important;
  -webkit-backdrop-filter: blur(12px) saturate(180%) !important;
}

/* 아이콘 스타일 */
.reviewmoa-toast .toast-icon,
.toastify .toast-icon {
  display: inline-block;
  font-size: 13px;
  margin-right: 8px;
  font-weight: bold;
  vertical-align: middle;
}

/* 닫기 버튼 스타일 (충돌 최소화) */
.toastify .toastify-close,
.toastify button[aria-label="Close"] {
  opacity: 0.6 !important;
  font-size: 12px !important;
  font-weight: bold !important;
  position: absolute !important;
  top: 50% !important;
  right: 12px !important;
  transform: translateY(-50%) !important;
  padding: 4px !important;
  cursor: pointer !important;
  transition: opacity 0.2s ease !important;
  color: #6b7280 !important;
  background: none !important;
  border: none !important;
  width: auto !important;
  height: auto !important;
  line-height: 1 !important;
}

.toastify .toastify-close:hover,
.toastify button[aria-label="Close"]:hover {
  opacity: 1 !important;
  color: #374151 !important;
}

/* 스택 간격 조정 */
.toastify.on.toastify-top {
  margin-bottom: 12px !important;
}

/* 위치 조정 (충돌 최소화) */
.toastify.on.toastify-right.toastify-top {
  right: 16px !important;
  top: 16px !important;
}

/* =================================================================
   반응형 디자인
   ================================================================= */

/* 모바일 (768px 이하) */
@media (max-width: 768px) {
  .toastify.on {
    margin: 0 8px 8px 8px !important;
    min-width: 260px !important;
    max-width: calc(100vw - 16px) !important;
    font-size: 13px !important;
  }

  .toastify .toast-icon {
    font-size: 15px !important;
  }

  .toastify.on.toastify-right.toastify-top {
    right: 8px !important;
    top: 8px !important;
  }
}

/* 작은 모바일 (480px 이하) */
@media (max-width: 480px) {
  .toastify.on {
    min-width: 240px !important;
    font-size: 12px !important;
  }

  .toastify .toast-icon {
    font-size: 14px !important;
    margin-right: 6px !important;
  }
}

/* =================================================================
   접근성 개선
   ================================================================= */

/* 포커스 스타일 */
.toastify:focus-visible {
  outline: 2px solid rgba(59, 130, 246, 0.5) !important;
  outline-offset: 2px !important;
}

/* 고대비 모드 지원 */
@media (prefers-contrast: high) {
  .toastify.on {
    border: 2px solid currentColor !important;
    background: rgba(255, 255, 255, 1) !important;
    backdrop-filter: none !important;
  }
}

/* 모션 줄이기 선호 사용자 */
@media (prefers-reduced-motion: reduce) {
  .toastify {
    animation: fadeIn 0.2s ease-in !important;
  }

  .toastify.toastify-close {
    animation: fadeOut 0.2s ease-out !important;
  }

  @keyframes fadeIn {
    from { opacity: 0; }
    to { opacity: 1; }
  }

  @keyframes fadeOut {
    from { opacity: 1; }
    to { opacity: 0; }
  }
}

/* =================================================================
   다크모드 지원
   ================================================================= */

@media (prefers-color-scheme: dark) {
  .toastify.on {
    background: rgba(31, 41, 55, 0.95) !important;
    color: #f9fafb !important;
    border-color: rgba(75, 85, 99, 0.8) !important;
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.3), 0 4px 10px rgba(0, 0, 0, 0.2) !important;
  }

  .toastify .toastify-close,
  .toastify button[aria-label="Close"] {
    color: #9ca3af !important;
  }

  .toastify .toastify-close:hover,
  .toastify button[aria-label="Close"]:hover {
    color: #d1d5db !important;
  }
}

/* =================================================================
   Print 스타일
   ================================================================= */

@media print {
  .toastify {
    display: none !important;
  }
}

/* =================================================================
   z-index 관리 (충돌 최소화)
   ================================================================= */

.toastify {
  z-index: 9999 !important;
}

/* 모달 위에 표시 */
.modal-open .toastify,
.modal.show ~ .toastify {
  z-index: 10500 !important;
}

/* Bootstrap 모달과 충돌 방지 */
.modal-backdrop ~ .toastify {
  z-index: 10500 !important;
}

/* =================================================================
   기본 라이브러리 오버라이드 최소화 전략
   ================================================================= */

/* Toastify 기본 avatar 이미지 숨김 */
.toastify .toastify-avatar {
  display: none !important;
}

/* Toastify 기본 텍스트 스타일 유지하되 미세 조정만 */
.toastify.on {
  display: flex !important;
  align-items: center !important;
}