/*
 * 旺旺商聊 · Terra unified overlays
 * Global visual-only layer for Uni modal, action sheet, picker, toast and loading.
 * It intentionally does not alter business handlers, payloads or routes.
 */

uni-modal .uni-mask,
uni-actionsheet .uni-mask,
.uni-picker-container .uni-mask {
  z-index: 1200 !important;
  background: rgba(16, 24, 40, .48) !important;
}

@supports ((-webkit-backdrop-filter: blur(2px)) or (backdrop-filter: blur(2px))) {
  uni-modal .uni-mask,
  uni-actionsheet .uni-mask,
  .uni-picker-container .uni-mask {
    -webkit-backdrop-filter: blur(2px);
    backdrop-filter: blur(2px);
  }
}

uni-modal .uni-modal {
  width: min(calc(100vw - 40px), 360px) !important;
  max-width: 360px !important;
  overflow: hidden !important;
  border: 1px solid rgba(31, 55, 92, .07) !important;
  border-radius: 20px !important;
  background: #fff !important;
  color: var(--ww-text, #171a20) !important;
  font-size: 14px !important;
  box-shadow: 0 20px 58px rgba(22, 35, 56, .24) !important;
  animation: ww-modal-in .2s ease-out !important;
}

uni-modal .uni-modal__hd {
  padding: 24px 20px 8px !important;
  line-height: normal !important;
}

uni-modal .uni-modal__title {
  color: var(--ww-text, #171a20) !important;
  font-size: 18px !important;
  font-weight: 700 !important;
  line-height: 26px !important;
}

uni-modal .uni-modal__bd {
  max-height: 45vh !important;
  max-height: 45dvh !important;
  min-height: 24px !important;
  padding: 12px 22px 20px !important;
  overflow-x: hidden !important;
  overflow-y: auto !important;
  color: var(--ww-text-2, #626a78) !important;
  font-size: 14px !important;
  line-height: 21px !important;
  white-space: pre-line !important;
}

uni-modal .uni-modal__ft {
  min-height: 64px !important;
  padding: 0 16px 16px !important;
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
  border-top: 0 !important;
  line-height: normal !important;
}

uni-modal .uni-modal__ft::after,
uni-modal .uni-modal__btn::after {
  display: none !important;
}

uni-modal .uni-modal__btn {
  height: 48px !important;
  margin: 0 !important;
  padding: 0 14px !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  box-sizing: border-box !important;
  border: 0 !important;
  border-radius: 12px !important;
  font-size: 15px !important;
  font-weight: 650 !important;
  line-height: 1 !important;
}

uni-modal .uni-modal__btn_default {
  background: #f3f5f8 !important;
  color: #4f5968 !important;
}

uni-modal .uni-modal__btn_primary {
  background: var(--ww-brand, #2f7df6) !important;
  color: #fff !important;
  box-shadow: 0 7px 16px rgba(47, 125, 246, .22) !important;
}

/* Keep explicit destructive confirms destructive; current chat delete uses #ef4444. */
uni-modal .uni-modal__btn_primary[style*="#ef4444"],
uni-modal .uni-modal__btn_primary[style*="239, 68, 68"] {
  background: var(--ww-danger, #f04452) !important;
  color: #fff !important;
  box-shadow: 0 7px 16px rgba(240, 68, 82, .2) !important;
}

uni-actionsheet .uni-actionsheet {
  left: 50% !important;
  bottom: 0 !important;
  width: 100% !important;
  max-width: var(--ww-shell-max, 640px) !important;
  padding: 8px var(--ww-gutter, 16px) max(12px, env(safe-area-inset-bottom, 0px)) !important;
  box-sizing: border-box !important;
  border-radius: 24px 24px 0 0 !important;
  background: var(--ww-bg, #f5f6f8) !important;
  transform: translate(-50%, 100%) !important;
  box-shadow: 0 -16px 42px rgba(22, 35, 56, .18) !important;
}

uni-actionsheet .uni-actionsheet_toggle {
  transform: translate(-50%, 0) !important;
}

uni-actionsheet .uni-actionsheet__menu,
uni-actionsheet .uni-actionsheet__action {
  overflow: hidden !important;
  border-radius: 16px !important;
  background: #fff !important;
}

uni-actionsheet .uni-actionsheet__title {
  min-height: 48px !important;
  padding: 12px 18px !important;
  box-sizing: border-box !important;
  color: var(--ww-text-2, #626a78) !important;
  font-size: 13px !important;
  line-height: 20px !important;
}

uni-actionsheet .uni-actionsheet__cell {
  min-height: 56px !important;
  padding: 0 18px !important;
  box-sizing: border-box !important;
  border-bottom: 1px solid var(--ww-line, #e9ecf1) !important;
  color: var(--ww-text, #171a20) !important;
  font-size: 16px !important;
  font-weight: 520 !important;
  line-height: 56px !important;
}

uni-actionsheet .uni-actionsheet__action {
  margin-top: 8px !important;
  color: var(--ww-brand, #2f7df6) !important;
  font-weight: 650 !important;
}

.uni-picker-container .uni-picker {
  left: 50% !important;
  width: 100% !important;
  max-width: var(--ww-shell-max, 640px) !important;
  overflow: hidden !important;
  border-radius: 24px 24px 0 0 !important;
  background: #fff !important;
  transform: translateX(-50%) !important;
  box-shadow: 0 -16px 42px rgba(22, 35, 56, .18) !important;
}

.uni-picker-container .uni-picker-header {
  min-height: 56px !important;
  padding: 0 16px !important;
  box-sizing: border-box !important;
  border-bottom: 1px solid var(--ww-line, #e9ecf1) !important;
}

.uni-picker-container .uni-picker-action {
  min-width: 52px !important;
  min-height: 44px !important;
  color: var(--ww-brand, #2f7df6) !important;
  font-size: 15px !important;
  font-weight: 650 !important;
}

/* Toast/loading masks remain transparent and must never inherit the dialog mask. */
uni-toast .uni-mask {
  background: transparent !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

uni-toast .uni-toast {
  width: auto !important;
  min-width: 112px !important;
  max-width: min(calc(100vw - 48px), 360px) !important;
  min-height: 44px !important;
  padding: 12px 16px !important;
  box-sizing: border-box !important;
  border-radius: 12px !important;
  background: rgba(22, 27, 35, .92) !important;
  box-shadow: 0 12px 32px rgba(16, 24, 40, .22) !important;
}

uni-toast .uni-toast__content {
  margin: 0 !important;
  color: #fff !important;
  font-size: 14px !important;
  font-weight: 500 !important;
  line-height: 20px !important;
  white-space: normal !important;
}

uni-toast .uni-toast__icon {
  width: 22px !important;
  height: 22px !important;
  margin: 0 auto 7px !important;
}

@supports selector(.uni-toast:not(:has(.uni-toast__icon))) {
  body.ww-main-tab uni-toast .uni-toast:not(:has(.uni-toast__icon)) {
    top: auto !important;
    bottom: calc(var(--ww-tab-h, 68px) + env(safe-area-inset-bottom, 0px) + 16px) !important;
    transform: translateX(-50%) !important;
  }
}

@keyframes ww-modal-in {
  from {
    opacity: 0;
    transform: scale(.96) translateY(6px);
  }
  to {
    opacity: 1;
    transform: scale(1) translateY(0);
  }
}

@media (prefers-reduced-motion: reduce) {
  uni-modal .uni-modal {
    animation: none !important;
  }
}
