/* 应用内弹窗 / 轻提示（替换系统原生 alert / confirm） */
:root {
    --mr-dlg-mask: rgba(15, 23, 42, .42);
    --mr-dlg-ink: #16202C;
    --mr-dlg-text: #4A5666;
    --mr-dlg-line: #E3E8EF;
}

/* ---------- 遮罩 + 对话框 ---------- */
.mr-dlg-mask {
    position: fixed;
    inset: 0;
    z-index: 2000;
    background: var(--mr-dlg-mask);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 20px;
    animation: mrDlgFade .16s ease-out both;
}
.mr-dlg-mask.hide { animation: mrDlgFadeOut .14s ease-in forwards; }

.mr-dlg {
    width: min(420px, 100%);
    background: #fff;
    border-radius: 14px;
    box-shadow: 0 28px 64px -16px rgba(15, 23, 42, .34), 0 0 0 1px rgba(15, 23, 42, .05);
    padding: 24px 24px 18px;
    animation: mrDlgPop .24s cubic-bezier(.2, .9, .3, 1.25) both;
    max-height: calc(100vh - 40px);
    display: flex;
    flex-direction: column;
}
.mr-dlg-mask.hide .mr-dlg { animation: mrDlgPopOut .14s ease-in forwards; }

.mr-dlg-ico {
    width: 46px; height: 46px;
    border-radius: 50%;
    display: flex; align-items: center; justify-content: center;
    font-size: 20px;
    margin-bottom: 14px;
    flex: 0 0 auto;
}
.mr-dlg-ico.info { background: #E9F3F0; color: #0E7263; }
.mr-dlg-ico.success { background: #E6F6EC; color: #1B9E58; }
.mr-dlg-ico.warn { background: #FDF2DF; color: #C07C10; }
.mr-dlg-ico.error { background: #FDECEC; color: #D63B3B; }
.mr-dlg-ico.question { background: #EDF2FB; color: #3B6FD9; }

.mr-dlg-title {
    font-size: 16px; font-weight: 600; color: var(--mr-dlg-ink);
    margin-bottom: 8px; letter-spacing: .01em;
}
.mr-dlg-body {
    font-size: 14px; line-height: 1.72; color: var(--mr-dlg-text);
    white-space: pre-wrap; word-break: break-word;
    overflow: auto; max-height: 46vh;
}
.mr-dlg-actions {
    display: flex; justify-content: flex-end; gap: 10px;
    margin-top: 22px; flex: 0 0 auto;
}
.mr-dlg-btn {
    height: 36px; min-width: 88px; padding: 0 18px;
    border-radius: 9px; border: 1px solid transparent;
    font-size: 14px; font-weight: 500; cursor: pointer;
    transition: background .15s, color .15s, transform .1s, box-shadow .15s;
    outline: none;
}
.mr-dlg-btn:active { transform: translateY(1px); }
.mr-dlg-btn.primary { background: var(--mr-brand, #0E7263); color: #fff; box-shadow: 0 6px 14px -8px rgba(14, 114, 99, .8); }
.mr-dlg-btn.primary:hover { background: var(--mr-brand-dark, #0A5B4F); }
.mr-dlg-btn.primary:focus-visible { box-shadow: 0 0 0 3px rgba(14, 114, 99, .25); }
.mr-dlg-btn.danger { background: #D63B3B; color: #fff; box-shadow: 0 6px 14px -8px rgba(214, 59, 59, .8); }
.mr-dlg-btn.danger:hover { background: #B93131; }
.mr-dlg-btn.ghost { background: #fff; border-color: var(--mr-dlg-line); color: #5A6778; }
.mr-dlg-btn.ghost:hover { background: #F4F6F9; color: var(--mr-dlg-ink); }

/* ---------- 轻提示 ---------- */
.mr-toasts {
    position: fixed;
    top: 20px; left: 50%;
    transform: translateX(-50%);
    z-index: 2100;
    display: flex; flex-direction: column; align-items: center;
    gap: 10px;
    pointer-events: none;
    width: max-content; max-width: 94vw;
}
.mr-toast {
    pointer-events: auto;
    display: flex; align-items: flex-start; gap: 10px;
    min-width: 220px; max-width: min(560px, 92vw);
    background: #fff;
    border-radius: 11px;
    box-shadow: 0 14px 34px -12px rgba(15, 23, 42, .36), 0 0 0 1px rgba(15, 23, 42, .05);
    padding: 12px 16px 12px 13px;
    font-size: 13.5px; line-height: 1.62; color: #3C4A5A;
    border-left: 3px solid var(--mr-brand, #0E7263);
    animation: mrToastIn .22s ease-out both;
}
.mr-toast.hide { animation: mrToastOut .18s ease-in forwards; }
.mr-toast i { font-size: 15px; line-height: 1.5; flex: 0 0 auto; margin-top: 1px; }
.mr-toast .mr-toast-txt { white-space: pre-wrap; word-break: break-word; max-height: 5.2em; overflow: auto; }
.mr-toast .mr-toast-x {
    margin-left: 6px; border: 0; background: transparent; color: #A3AEBD;
    font-size: 13px; cursor: pointer; padding: 0 0 0 4px; line-height: 1.5;
}
.mr-toast .mr-toast-x:hover { color: #5A6778; }
.mr-toast.info { border-left-color: #0E7263; } .mr-toast.info i { color: #0E7263; }
.mr-toast.success { border-left-color: #1B9E58; } .mr-toast.success i { color: #1B9E58; }
.mr-toast.warn { border-left-color: #C07C10; } .mr-toast.warn i { color: #C07C10; }
.mr-toast.error { border-left-color: #D63B3B; } .mr-toast.error i { color: #D63B3B; }

@keyframes mrDlgFade { from { opacity: 0 } to { opacity: 1 } }
@keyframes mrDlgFadeOut { from { opacity: 1 } to { opacity: 0 } }
@keyframes mrDlgPop {
    from { opacity: 0; transform: translateY(10px) scale(.96); }
    to { opacity: 1; transform: none; }
}
@keyframes mrDlgPopOut {
    from { opacity: 1; transform: none; }
    to { opacity: 0; transform: translateY(6px) scale(.97); }
}
@keyframes mrToastIn {
    from { opacity: 0; transform: translateY(-10px); }
    to { opacity: 1; transform: none; }
}
@keyframes mrToastOut {
    from { opacity: 1; transform: none; }
    to { opacity: 0; transform: translateY(-8px); }
}

@media (max-width: 575.98px) {
    .mr-dlg { border-radius: 14px; padding: 20px 18px 14px; }
    .mr-dlg-actions { margin-top: 18px; }
    .mr-dlg-btn { flex: 1 1 0; min-width: 0; }
}
