/* 公共弹窗样式：统一两个后台与客服工作台的弹窗、按钮和操作反馈。 */
:root {
    --xy-modal-close-size: 32px;
    --xy-modal-footer-bg: var(--surface);
}

/* Bootstrap Modal 统一采用固定头尾、中间滚动的布局。 */
.modal .modal-dialog {
    max-height: calc(100vh - 1rem);
    max-height: calc(100dvh - 1rem);
}
.modal .modal-content {
    display: flex;
    flex-direction: column;
    max-height: min(88vh, 900px);
    max-height: min(88dvh, 900px);
    overflow: hidden;
    border: 1px solid var(--line);
    border-radius: 14px;
    box-shadow: 0 18px 55px rgba(15, 23, 42, .14);
    color: var(--text);
    background: var(--surface);
    border-color: var(--line);
}
.modal .modal-content > form:not(.modal-body) {
    display: flex;
    flex: 1 1 auto;
    flex-direction: column;
    min-height: 0;
    overflow: hidden;
}
.modal .modal-header {
    flex: 0 0 auto;
    align-items: flex-start;
    border-color: var(--line);
}
.modal .modal-body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    scrollbar-width: thin;
    scrollbar-color: var(--line) transparent;
}
.modal .modal-body::-webkit-scrollbar { width: 6px; }
.modal .modal-body::-webkit-scrollbar-thumb { background: var(--line); border-radius: 8px; }
.modal .modal-footer {
    flex: 0 0 auto;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    border-color: var(--line);
    background: var(--xy-modal-footer-bg);
}
/* 有些表单本身承担 modal-body，底部按钮固定在滚动视口底边。 */
.modal .modal-body > .modal-footer {
    position: sticky;
    bottom: -1rem;
    z-index: 3;
    margin: 1rem -1rem -1rem;
    padding: 12px 1rem;
    background: var(--xy-modal-footer-bg);
    box-shadow: 0 -8px 18px rgba(15, 23, 42, .045);
}
.modal .modal-footer > .btn {
    min-height: 36px;
    padding: .42rem .95rem;
    font-size: 13px;
    line-height: 1.35;
    font-weight: 600;
}
.modal .modal-footer > .btn-outline-secondary {
    --bs-btn-color: var(--text);
    --bs-btn-border-color: var(--line);
    --bs-btn-hover-color: var(--text);
    --bs-btn-hover-bg: var(--surface-soft);
    --bs-btn-hover-border-color: var(--muted);
    --bs-btn-active-color: var(--text);
    --bs-btn-active-bg: var(--surface-soft);
    --bs-btn-active-border-color: var(--line);
}

/* 所有 Bootstrap 弹窗和工作台自定义对话框使用同一套关闭按钮。 */
.modal .modal-header .xy-modal-close,
.modal .modal-header .btn-close,
.modal .modal-header .modal-close-btn,
.modal .modal-header .xy-dialog-close,
.transfer-modal-head .xy-modal-close,
.transfer-modal-head .xy-dialog-close,
.transfer-modal-head #transferAgentClose {
    display: inline-grid !important;
    place-items: center !important;
    width: var(--xy-modal-close-size) !important;
    min-width: var(--xy-modal-close-size) !important;
    height: var(--xy-modal-close-size) !important;
    min-height: var(--xy-modal-close-size) !important;
    flex: 0 0 var(--xy-modal-close-size) !important;
    margin: 0 0 0 auto !important;
    padding: 0 !important;
    border: 1px solid var(--line) !important;
    border-radius: 8px !important;
    background: var(--surface) !important;
    background-image: none !important;
    color: var(--muted) !important;
    opacity: 1 !important;
    box-shadow: none !important;
    transition: color .16s ease, background-color .16s ease, border-color .16s ease, transform .16s ease !important;
}
.modal .modal-header .xy-modal-close:hover,
.modal .modal-header .btn-close:hover,
.modal .modal-header .modal-close-btn:hover,
.modal .modal-header .xy-dialog-close:hover,
.transfer-modal-head .xy-modal-close:hover,
.transfer-modal-head .xy-dialog-close:hover,
.transfer-modal-head #transferAgentClose:hover {
    border-color: var(--primary) !important;
    background: var(--surface-soft) !important;
    color: var(--text) !important;
}
.modal .modal-header .xy-modal-close:focus-visible,
.modal .modal-header .btn-close:focus-visible,
.modal .modal-header .modal-close-btn:focus-visible,
.modal .modal-header .xy-dialog-close:focus-visible,
.transfer-modal-head .xy-modal-close:focus-visible,
.transfer-modal-head .xy-dialog-close:focus-visible,
.transfer-modal-head #transferAgentClose:focus-visible {
    outline: 2px solid var(--primary);
    outline-offset: 2px;
}
.modal .modal-header .xy-modal-close .bi,
.modal .modal-header .btn-close .bi,
.modal .modal-header .modal-close-btn .bi,
.modal .modal-header .xy-dialog-close .bi,
.transfer-modal-head .xy-modal-close .bi,
.transfer-modal-head .xy-dialog-close .bi,
.transfer-modal-head #transferAgentClose .bi {
    display: block;
    margin: 0 !important;
    font-size: 13px;
    line-height: 1;
}

/* 轻量操作反馈：固定居中、自动消失，不需要“确认/知道了”按钮。 */
.xy-global-notice {
    position: fixed;
    z-index: 2000;
    top: 50%;
    left: 50%;
    display: flex;
    align-items: center;
    gap: 13px;
    width: max-content;
    max-width: min(440px, calc(100vw - 32px));
    min-width: min(260px, calc(100vw - 32px));
    padding: 17px 20px;
    border: 1px solid var(--line);
    border-radius: 13px;
    background: var(--surface);
    color: var(--text);
    box-shadow: 0 18px 55px rgba(15, 23, 42, .18);
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate(-50%, -46%) scale(.97);
    transition: opacity .2s ease, transform .2s ease, visibility 0s linear .2s;
}
.xy-global-notice.is-visible {
    opacity: 1;
    visibility: visible;
    transform: translate(-50%, -50%) scale(1);
    transition: opacity .2s ease, transform .2s ease, visibility 0s;
}
.xy-global-notice[hidden] { display: none !important; }
.xy-global-notice-icon {
    display: grid;
    place-items: center;
    width: 39px;
    height: 39px;
    flex: 0 0 39px;
    border-radius: 50%;
    background: #e8f8f1;
    color: #159768;
    font-size: 20px;
}
.xy-global-notice[data-kind="error"] .xy-global-notice-icon { background: #fff0f0; color: #d04444; }
.xy-global-notice[data-kind="warning"] .xy-global-notice-icon { background: #fff6e7; color: #b7791f; }
.xy-global-notice[data-kind="info"] .xy-global-notice-icon { background: var(--primary-soft); color: var(--primary); }
.xy-global-notice-copy { display: flex; flex: 1 1 auto; flex-direction: column; gap: 3px; min-width: 0; }
.xy-global-notice-title { color: var(--text); font-size: 14px; font-weight: 700; line-height: 1.35; }
.xy-global-notice-message { color: var(--muted); font-size: 12px; line-height: 1.6; overflow-wrap: anywhere; }
:root[data-theme="dark"] .xy-global-notice-icon { background: #193b32; color: #82ddba; }
:root[data-theme="dark"] .xy-global-notice[data-kind="error"] .xy-global-notice-icon { background: #472629; color: #ffb5b5; }
:root[data-theme="dark"] .xy-global-notice[data-kind="warning"] .xy-global-notice-icon { background: #46391f; color: #f4c778; }

@media (max-width: 575.98px) {
    .modal .modal-dialog { margin: .5rem; }
    .modal .modal-content { max-height: calc(100vh - 1rem); max-height: calc(100dvh - 1rem); }
    .modal .modal-header { padding: 14px 15px; }
    .modal .modal-body { padding: 14px 15px; }
    .modal .modal-footer { padding: 12px 15px; }
    .modal .modal-body > .modal-footer { margin: 1rem -15px -14px; padding: 11px 15px; }
    .modal .modal-footer > .btn { min-height: 35px; padding: .4rem .85rem; }
    .xy-global-notice { max-width: calc(100vw - 28px); padding: 15px 16px; }
}
@media (prefers-reduced-motion: reduce) {
    .modal.fade .modal-dialog,
    .xy-global-notice,
    .modal .modal-header .xy-modal-close { transition-duration: .01ms !important; }
}


/* 工作台快捷回复使用 Bootstrap Modal；宽度与普通内容弹窗保持一致。 */
.quick-reply-dialog { max-width: 440px; }

/* 黑名单确认和客服转接仍为轻量自定义对话框，操作区沿用公共按钮规范。 */
.blacklist-confirm-actions {
    display: flex;
    align-items: center;
    justify-content: flex-end;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 22px;
}
.blacklist-confirm-actions > .btn {
    min-height: 35px;
    padding: .4rem .85rem;
    font-size: 13px;
    font-weight: 600;
}
@media (max-width: 575.98px) {
    .blacklist-confirm-backdrop,
    .transfer-modal-backdrop { padding: 12px; }
}
@media (prefers-reduced-motion: reduce) {
    .blacklist-confirm-backdrop,
    .blacklist-confirm-dialog,
    .transfer-modal-backdrop,
    .transfer-modal { transition-duration: .01ms !important; }
}


/* V163：需要商户确认的实时公告不显示右上角关闭按钮；覆盖通用关闭按钮的 display 规则。 */
#merchantAnnouncementModal.is-announcement-ack-required .modal-header .xy-modal-close,
#merchantAnnouncementModal.is-announcement-ack-required .modal-header .modal-close-btn,
#merchantAnnouncementModal .modal-header .xy-modal-close[hidden],
#merchantAnnouncementModal .modal-header .modal-close-btn[hidden]{display:none!important}
