﻿body {
    /* =====================================================================
   提交信息弹窗美化 v3 —— 零 Razor 改动
   ---------------------------------------------------------------------
   v3：整体做紧凑，消除弹窗内部垂直滚动条
     · MCol 垂直内边距 12px → 4px（主要空间来源，每行省 16px）
     · 输入框上下 margin 压缩
     · 标题栏 / 提示条 / 按钮区衬垫同步减小
   ===================================================================== */
    /* ---------- 1. 弹窗遮罩：深色 + 毛玻璃 ---------- */
    .m-overlay__scrim {
        background: rgba(15, 23, 42, 0.5) !important;
        backdrop-filter: blur(3px);
        -webkit-backdrop-filter: blur(3px);
    }
    /* ---------- 2. 弹窗卡片：大圆角 + 悬浮阴影 + 入场动画 ---------- */
    /* 注意：.m-dialog 不能加 overflow:hidden，会把内部滚动区裁掉、切掉底部按钮 */
    .m-dialog {
        border-radius: 20px;
        box-shadow: 0 24px 64px rgba(15, 23, 42, 0.30);
        animation: hpDialogIn 0.3s cubic-bezier(0.4, 0, 0.2, 1);
    }

        .m-dialog .m-card {
            border-radius: 20px !important;
            overflow: hidden; /* 圆角裁剪只作用于卡片自身 */
        }

    @keyframes hpDialogIn {
        from {
            opacity: 0;
            transform: translateY(20px) scale(0.97);
        }

        to {
            opacity: 1;
            transform: translateY(0) scale(1);
        }
    }
    /* ---------- 3. 栅格列垂直留白压缩（省高度的主力） ---------- */
    /* MASA 的 m-col 默认上下内边距各 12px，每行白白占 24px */
    .m-dialog .m-col {
        padding-top: 4px !important;
        padding-bottom: 4px !important;
    }
    /* ---------- 4. 标题栏：渐变蓝横幅（衬垫收紧） ---------- */
    .m-card__title.primary {
        background: linear-gradient(120deg, #2563eb 0%, #1e40af 60%, #1e3a8a 100%) !important;
        padding: 14px 24px !important;
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 1.5px;
        box-shadow: 0 2px 10px rgba(30, 64, 175, 0.30);
    }

        .m-card__title.primary .m-icon {
            opacity: 0.9;
            margin-right: 4px;
        }
    /* ---------- 5. 顶部提示条（Razor 里带 mb-4，这里压到 8px） ---------- */
    .m-alert--prominent {
        background: linear-gradient(135deg, #eff6ff 0%, #dbeafe 100%) !important;
        border: 1px solid #93c5fd !important;
        border-radius: 12px !important;
        margin-bottom: 8px !important; /* 覆盖 MAlert 的 mb-4 */
        font-size: 13px;
        line-height: 1.6;
        color: #1e40af;
    }

        .m-alert--prominent .m-icon {
            color: #2563eb;
        }
    /* ---------- 6. 表单输入框（v2 深色系 + v3 紧凑间距） ---------- */
    .m-text-field--outlined fieldset {
        border-color: #94a3b8;
        border-radius: 10px;
        transition: border-color 0.2s, box-shadow 0.2s;
    }

    .m-text-field--outlined:hover fieldset {
        border-color: #475569;
    }

    .m-text-field--outlined.m-input--is-focused fieldset {
        border-color: #2563eb !important;
        box-shadow: 0 0 0 3px rgba(37, 99, 235, 0.14);
    }

    .m-text-field label {
        font-size: 13px;
        color: #475569;
        font-weight: 500;
        letter-spacing: 0.3px;
    }

    .m-text-field.m-input--is-focused label,
    .m-text-field.m-input--is-label-active label {
        color: #1d4ed8 !important;
        font-weight: 600;
    }

    .m-text-field label .red--text {
        font-size: 14px;
    }
    /* v3：字段间距压缩（原 margin-top 6px / bottom 10px） */
    .m-dialog .m-input {
        margin-top: 0 !important;
        margin-bottom: 4px !important;
    }

    .m-dialog input,
    .m-dialog textarea {
        font-size: 14px;
        color: #0f172a;
        caret-color: #2563eb;
    }

    .m-dialog .m-textarea textarea {
        min-height: 72px; /* 原 88px */
        line-height: 1.6;
    }
    /* ---------- 7. 分隔线：弱化 ---------- */
    .m-dialog .m-divider {
        border-color: #e2e8f0 !important;
    }
    /* ---------- 8. 底部按钮区（衬垫收紧） ---------- */
    .m-card__actions {
        padding: 12px 24px !important;
        background: #f1f5f9;
        border-top: 1px solid #e2e8f0;
    }

        .m-card__actions .m-btn {
            border-radius: 10px;
            letter-spacing: 1px;
            font-weight: 600;
            padding: 0 18px;
        }

        .m-card__actions .m-btn--text {
            color: #475569;
        }

            .m-card__actions .m-btn--text:hover {
                background: #cbd5e1;
                color: #1e293b;
            }

        .m-card__actions .m-btn.primary {
            background: linear-gradient(135deg, #2563eb 0%, #1d4ed8 100%) !important;
            color: #fff !important;
            box-shadow: 0 4px 12px rgba(37, 99, 235, 0.32);
            padding: 0 26px;
        }

            .m-card__actions .m-btn.primary:hover {
                box-shadow: 0 6px 18px rgba(37, 99, 235, 0.42);
            }
}
