/* 弹框尺寸 - CSS 变量由 config/dialog.ts 在启动时注入 */
:root {
    --cn-dialog-width-small: 26vw;
    --cn-dialog-max-width-small: 500px;
    --cn-dialog-min-width-small: 300px;

    --cn-dialog-width-middle: 42vw;
    --cn-dialog-max-width-middle: 800px;
    --cn-dialog-min-width-middle: 600px;

    --cn-dialog-width-big: 62vw;
    --cn-dialog-max-width-big: 1200px;
    --cn-dialog-min-width-big: 800px;
}

.cn-dialog.el-dialog {
    max-width: calc(100vw - 32px);
}

.cn-dialog--small.el-dialog,
.dialog-small.el-dialog {
    width: var(--cn-dialog-width-small) !important;
    max-width: var(--cn-dialog-max-width-small) !important;
    min-width: var(--cn-dialog-min-width-small) !important;
}

.cn-dialog--middle.el-dialog,
.dialog-middle.el-dialog {
    width: var(--cn-dialog-width-middle) !important;
    max-width: var(--cn-dialog-max-width-middle) !important;
    min-width: var(--cn-dialog-min-width-middle) !important;
}

.cn-dialog--big.el-dialog,
.dialog-big.el-dialog {
    width: var(--cn-dialog-width-big) !important;
    max-width: var(--cn-dialog-max-width-big) !important;
    min-width: var(--cn-dialog-min-width-big) !important;
}

@media screen and (max-width: 1024px) {
    .cn-dialog--small.el-dialog,
    .cn-dialog--middle.el-dialog,
    .cn-dialog--big.el-dialog,
    .dialog-small.el-dialog,
    .dialog-middle.el-dialog,
    .dialog-big.el-dialog,
    .cn-operate-dialog.el-dialog {
        width: 96% !important;
        min-width: unset !important;
        max-width: calc(100vw - 32px) !important;
    }
}
