/* =========================================================
   强化弹窗样式：开通套餐 / 支付 / 提示 / 后台弹窗
   ========================================================= */

/* 弹窗遮罩更明显 */
.layui-layer-shade,
.modal-backdrop,
.el-overlay,
.v-modal,
.mask,
.popup-mask,
.dialog-mask {
    background: rgba(15, 23, 42, 0.58) !important;
    opacity: 1 !important;
    z-index: 9998 !important;
}

/* 所有弹窗主体更突出 */
.layui-layer,
.layui-layer-page,
.layui-layer-dialog,
.modal,
.dialog,
.popup,
.el-dialog,
.package-popup,
.vip-popup,
.pay-popup,
.recharge-popup {
    background: #ffffff !important;
    color: #0f172a !important;
    border: 3px solid #7c3aed !important;
    border-radius: 22px !important;
    box-shadow:
        0 0 0 6px rgba(124, 58, 237, 0.16),
        0 28px 80px rgba(15, 23, 42, 0.42) !important;
    overflow: hidden !important;
    z-index: 9999 !important;
}

/* 弹窗标题栏 */
.layui-layer-title,
.modal-title,
.dialog-title,
.popup-title,
.el-dialog__title,
.el-dialog__header {
    background: linear-gradient(135deg, #6d28d9, #2563eb) !important;
    color: #ffffff !important;
    font-size: 20px !important;
    font-weight: 900 !important;
    letter-spacing: 1px !important;
    border-bottom: none !important;
    min-height: 50px !important;
    line-height: 50px !important;
    padding-left: 22px !important;
}

/* 弹窗内容 */
.layui-layer-content,
.modal-content,
.dialog-content,
.popup-content,
.el-dialog__body {
    background: #ffffff !important;
    color: #0f172a !important;
    font-size: 16px !important;
    font-weight: 600 !important;
    line-height: 1.8 !important;
    padding: 24px !important;
}

/* 弹窗里面所有文字强制醒目 */
.layui-layer *,
.modal *,
.dialog *,
.popup *,
.el-dialog * {
    color: #0f172a !important;
    opacity: 1 !important;
    text-shadow: none !important;
}

/* 弹窗标题里的文字保持白色 */
.layui-layer-title *,
.modal-title *,
.dialog-title *,
.popup-title *,
.el-dialog__title *,
.el-dialog__header * {
    color: #ffffff !important;
}

/* 关闭按钮更明显 */
.layui-layer-setwin a,
.layui-layer-close,
.el-dialog__close,
.close,
.close-btn {
    background: #ef4444 !important;
    color: #ffffff !important;
    border-radius: 50% !important;
    width: 28px !important;
    height: 28px !important;
    line-height: 28px !important;
    text-align: center !important;
    opacity: 1 !important;
    font-weight: 900 !important;
}

/* 弹窗里的按钮：紫色填充，更醒目 */
.layui-layer .layui-btn,
.layui-layer button,
.layui-layer [type="button"],
.layui-layer [type="submit"],
.modal .btn,
.dialog .btn,
.popup .btn,
.el-dialog button,
.package-popup button,
.vip-popup button,
.pay-popup button,
.recharge-popup button {
    background: linear-gradient(135deg, #7c3aed, #2563eb) !important;
    color: #ffffff !important;
    border: none !important;
    border-radius: 14px !important;
    box-shadow: 0 10px 24px rgba(37, 99, 235, 0.28) !important;
    font-size: 16px !important;
    font-weight: 900 !important;
    min-height: 42px !important;
    padding: 0 22px !important;
}

/* 按钮里的文字保持白色 */
.layui-layer .layui-btn *,
.layui-layer button *,
.modal .btn *,
.dialog .btn *,
.popup .btn *,
.el-dialog button * {
    color: #ffffff !important;
}

/* 取消按钮也清晰 */
.layui-layer .layui-layer-btn .layui-layer-btn1,
.layui-layer .cancel,
.modal .cancel,
.dialog .cancel,
.popup .cancel {
    background: #ffffff !important;
    color: #6d28d9 !important;
    border: 2px solid #7c3aed !important;
}

/* 套餐卡片/选项强制突出 */
.layui-layer .card,
.layui-layer .box,
.layui-layer .item,
.layui-layer .package,
.layui-layer .plan,
.layui-layer .vip,
.modal .card,
.dialog .card,
.popup .card,
.package-item,
.plan-item,
.vip-item,
.price-item,
.pay-item {
    background: #ffffff !important;
    border: 2px solid #a78bfa !important;
    border-radius: 18px !important;
    box-shadow: 0 8px 22px rgba(124, 58, 237, 0.14) !important;
    color: #0f172a !important;
    margin: 10px 0 !important;
}

/* 套餐价格/金额 */
.layui-layer .price,
.layui-layer .money,
.layui-layer .amount,
.layui-layer .num,
.modal .price,
.dialog .price,
.popup .price,
.price,
.money,
.amount {
    color: #e11d48 !important;
    font-size: 22px !important;
    font-weight: 900 !important;
}

/* 重要提示 */
.layui-layer .tips,
.layui-layer .notice,
.layui-layer .warning,
.modal .tips,
.dialog .tips,
.popup .tips {
    background: #fff7ed !important;
    color: #ea580c !important;
    border: 2px solid #fdba74 !important;
    border-radius: 14px !important;
    padding: 12px 14px !important;
    font-weight: 800 !important;
}

/* 输入框在弹窗内更清晰 */
.layui-layer input,
.layui-layer textarea,
.layui-layer select,
.modal input,
.dialog input,
.popup input,
.el-dialog input {
    background: #ffffff !important;
    color: #0f172a !important;
    border: 2px solid #93c5fd !important;
    border-radius: 12px !important;
    font-weight: 700 !important;
}

/* 弹窗底部按钮区 */
.layui-layer-btn,
.modal-footer,
.dialog-footer,
.popup-footer,
.el-dialog__footer {
    background: #f8fafc !important;
    border-top: 1px solid #dbeafe !important;
    padding: 16px 20px !important;
}

/* 防止之前的全白主题把弹窗按钮弄白 */
.layui-layer [style*="background"],
.modal [style*="background"],
.dialog [style*="background"],
.popup [style*="background"],
.el-dialog [style*="background"] {
    background-image: none;
}

/* 移动端弹窗也突出 */
@media (max-width: 768px) {
    .layui-layer,
    .modal,
    .dialog,
    .popup,
    .el-dialog {
        width: calc(100vw - 28px) !important;
        max-width: calc(100vw - 28px) !important;
        border-radius: 18px !important;
    }

    .layui-layer-content,
    .modal-content,
    .dialog-content,
    .popup-content,
    .el-dialog__body {
        padding: 18px !important;
        font-size: 15px !important;
    }
}