/* ============================================================
   007卡券 · 全站弹窗统一层
   1) 所有自定义弹窗：电脑 / 手机 均水平 + 垂直居中
   2) 统一确认框 / 输入框 / 提示条样式（配合 js/ui-dialog.js）
   ============================================================ */

/* ---------- 通用弹窗遮罩：强制居中 ---------- */
.modal-mask,
.sheet-mask,
.share-mask,
.hot-modal-mask,
.ib-mask,
.cat-modal-mask,
[data-ui-modal] {
    align-items: center !important;
    justify-content: center !important;
    padding: 24px !important;
    overflow-y: auto !important;
}

/* 弹窗本体：限高 + 内部滚动，避免超出屏幕 */
.modal,
.sheet,
.share-modal,
.hot-modal,
.ib-modal,
.cat-modal,
.rebill-modal {
    margin: auto !important;
    max-height: calc(100vh - 48px) !important;
    max-height: calc(100dvh - 48px) !important;
    overflow-y: auto !important;
}

/* 原本是底部抽屉的，电脑端改为居中卡片 */
.sheet {
    border-radius: 18px !important;
    width: min(560px, 100%) !important;
    max-width: 560px !important;
    animation: uiPopIn .2s ease !important;
    padding-bottom: 18px !important;
}

/* 手机端尺寸优化 */
@media (max-width: 640px) {
    .modal-mask,
    .sheet-mask,
    .share-mask,
    .hot-modal-mask,
    .ib-mask,
    .cat-modal-mask,
    [data-ui-modal] {
        padding: 14px !important;
    }
    .modal,
    .sheet,
    .share-modal,
    .hot-modal,
    .ib-modal,
    .cat-modal {
        width: 100% !important;
        max-height: calc(100vh - 28px) !important;
        max-height: calc(100dvh - 28px) !important;
    }
    .modal { padding: 18px !important; border-radius: 16px !important; }
    .hot-modal { padding: 20px 16px !important; }
    .hot-modal-title { margin-bottom: 12px !important; }
    .sheet { max-width: 100% !important; }
}

@keyframes uiPopIn {
    from { opacity: 0; transform: translateY(10px) scale(.98); }
    to   { opacity: 1; transform: none; }
}

/* ---------- 统一对话框 ---------- */
.ui-dlg-mask {
    position: fixed; inset: 0; z-index: 99999;
    display: none; align-items: center; justify-content: center;
    padding: 20px;
    background: rgba(15, 23, 42, .55);
    -webkit-backdrop-filter: blur(3px);
    backdrop-filter: blur(3px);
}
.ui-dlg-mask.show { display: flex; }

.ui-dlg {
    width: min(422px, 100%);
    max-height: calc(100vh - 40px);
    max-height: calc(100dvh - 40px);
    background: #fff;
    border-radius: 20px;
    box-shadow: 0 26px 70px rgba(15, 23, 42, .32);
    display: flex; flex-direction: column;
    overflow: hidden;
    animation: uiDlgIn .2s cubic-bezier(.22, 1, .36, 1);
}
@keyframes uiDlgIn {
    from { opacity: 0; transform: translateY(14px) scale(.96); }
    to   { opacity: 1; transform: none; }
}

.ui-dlg-hd { padding: 26px 24px 0; text-align: center; flex: none; }
.ui-dlg-ico {
    width: 54px; height: 54px; border-radius: 50%;
    margin: 0 auto 14px;
    display: flex; align-items: center; justify-content: center;
    font-size: 24px; line-height: 1;
}
.ui-dlg-ico.info    { background: #eaf2ff; color: #2f7cf6; }
.ui-dlg-ico.success { background: #e6f9f0; color: #12b76a; }
.ui-dlg-ico.warn    { background: #fff4e5; color: #f79009; }
.ui-dlg-ico.danger  { background: #feeceb; color: #f04438; }
.ui-dlg-ttl { font-size: 17px; font-weight: 700; color: #1f2430; letter-spacing: .2px; }

.ui-dlg-bd {
    padding: 10px 24px 2px;
    font-size: 14px; line-height: 1.75; color: #5b6474;
    text-align: center; white-space: pre-wrap; word-break: break-word;
    overflow-y: auto;
}
.ui-dlg-bd .ui-dlg-strong { color: #1f2430; font-weight: 700; }

.ui-dlg-input {
    width: 100%; margin-top: 14px;
    padding: 12px 14px;
    border: 1px solid #e3e8f0; border-radius: 11px;
    background: #f7f9fc; color: #1f2430;
    font-size: 14px; font-family: inherit;
    outline: none; transition: border-color .15s, background .15s;
}
.ui-dlg-input:focus { border-color: #7fb0ff; background: #fff; box-shadow: 0 0 0 3px rgba(47,124,246,.12); }
textarea.ui-dlg-input { resize: vertical; min-height: 84px; line-height: 1.6; }

.ui-dlg-ft { display: flex; gap: 10px; padding: 20px 24px 24px; flex: none; }
.ui-dlg-btn {
    flex: 1; padding: 12px 10px;
    border-radius: 12px; border: none;
    font-size: 14.5px; font-weight: 600; font-family: inherit;
    cursor: pointer; transition: transform .12s, box-shadow .15s, background .15s;
}
.ui-dlg-btn:active { transform: scale(.985); }
.ui-dlg-btn.ghost { background: #f2f5f9; color: #4b5568; }
.ui-dlg-btn.ghost:hover { background: #e9eef6; }
.ui-dlg-btn.primary { background: linear-gradient(135deg, #4f9bff, #2f7cf6); color: #fff; box-shadow: 0 6px 16px rgba(47,124,246,.28); }
.ui-dlg-btn.primary:hover { box-shadow: 0 8px 20px rgba(47,124,246,.34); }
.ui-dlg-btn.danger { background: linear-gradient(135deg, #ff7a6b, #f04438); color: #fff; box-shadow: 0 6px 16px rgba(240,68,56,.26); }
.ui-dlg-btn.warn { background: linear-gradient(135deg, #ffb556, #f79009); color: #fff; box-shadow: 0 6px 16px rgba(247,144,9,.26); }
.ui-dlg-btn[disabled] { opacity: .6; cursor: not-allowed; }

/* ---------- 统一轻提示 ---------- */
body.ui-locked { overflow: hidden; }
.ui-toast {
    position: fixed; left: 50%; top: 50%;
    transform: translate(-50%, -50%) scale(.96);
    background: rgba(24, 32, 46, .93);
    color: #fff; font-size: 13.5px; line-height: 1.6;
    padding: 12px 20px; border-radius: 12px;
    max-width: min(78vw, 420px);
    text-align: center; word-break: break-word;
    box-shadow: 0 14px 40px rgba(15, 23, 42, .35);
    opacity: 0; pointer-events: none;
    transition: opacity .2s ease, transform .2s ease;
    z-index: 100000;
}
.ui-toast.show { opacity: 1; transform: translate(-50%, -50%) scale(1); }

@media (max-width: 640px) {
    .ui-dlg-mask { padding: 14px; }
    .ui-dlg { width: 100%; border-radius: 18px; }
    .ui-dlg-hd { padding: 22px 20px 0; }
    .ui-dlg-bd { padding: 9px 20px 2px; }
    .ui-dlg-ft { padding: 18px 20px 20px; }
    .ui-dlg-btn { padding: 12px 8px; font-size: 14px; }
}