/* ============================================================
   OA Flow CSS — 动态表单 + 流程审批面板样式
   从 HaHa/wwwroot/css/usage.css 和 HaHa.Server/wwwroot/css/app.css 迁移
   ============================================================ */

/* 表单滚动框 - 动态表单页面 */
.oa-form .kui-form-body {max-height:calc(100vh - 220px);overflow-y:auto;}
.oa-form .kui-form-page .kui-form-body {max-height:calc(100vh - 260px);overflow-y:auto;}

/* 动态表单页面宽度 */
.oa-form .kui-form-page {max-width:1400px;}

/* 动态表单顶部信息栏对齐 */
.oa-form-info {padding-left:8px;}

/* 表单滚动框 - 字段过多时滚动 */
.kui-form-body-scroll {max-height:calc(100vh - 500px);overflow-y:auto;}

/* Right-side scrollable form layout */
.kui-form-page > .kui-form-right-scroll {
    display: flex;
    gap: 16px;
    height: 100%;
    min-height: 0;
}
.kui-form-right-scroll > .left {
    width: 300px;
    min-width: 300px;
    display: flex;
    flex-direction: column;
    gap: 12px;
    overflow-y: auto;
    padding-right: 8px;
}
.kui-form-right-scroll > .right {
    flex: 1;
    min-width: 0;
    min-height: 0;
    display: flex;
    flex-direction: column;
    padding-left: 16px;
    border-left: 1px solid var(--kui-color-border, #e8e8e8);
    overflow: hidden;
}
.kui-form-right-scroll > .right .form-scroll {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
}
.kui-form-right-scroll > .right .form-scroll .kui-form-body-scroll {max-height:calc(100vh - 300px);overflow-y:auto;}
.kui-form-right-scroll > .right .form-scroll .kui-form {
    padding-top: 0;
}
.kui-form-right-scroll > .right .flow-scroll {
    max-height: 300px;
    min-height: 0;
    overflow-y: auto;
    border-top: 1px solid var(--kui-color-border, #e8e8e8);
    margin-top: 8px;
    padding-top: 8px;
}
.kui-form-right-scroll > .left .kui-form-action {
    padding: 0;
    border: none;
    position: static;
}

/* Flow Form Tab Layout */
.kui-flow-form {min-height:400px;}
.kui-flow-panel-empty {display:flex;align-items:center;justify-content:center;height:200px;color:#999;font-size:14px;}
.kui-flow-status {display:flex;align-items:center;gap:12px;padding:8px 0;}
.kui-flow-step {font-size:14px;color:#666;}

:root[data-theme=dark] .kui-flow-panel-empty {color:#666;}
:root[data-theme=dark] .kui-flow-step {color:#999;}

/* Flow Process Visualization */
.kui-flow-process {display:flex;align-items:flex-start;padding:16px 0;overflow-x:auto;gap:0;}
.kui-flow-step-item {display:flex;flex-direction:column;align-items:center;flex-shrink:0;position:relative;padding:0 12px;max-width:140px;}
.kui-flow-step-item .anticon {font-size:24px;margin-bottom:4px;}
.kui-flow-step-item .kui-flow-step-body {display:flex;flex-direction:column;align-items:center;text-align:center;gap:2px;}
.kui-flow-step-name {font-size:13px;font-weight:600;color:#333;white-space:nowrap;}
.kui-flow-step-user {font-size:12px;color:#666;}
.kui-flow-step-time {font-size:11px;color:#999;}
.kui-flow-step-result {margin-top:2px;}
.kui-flow-step-item::after {content:'';position:absolute;top:12px;left:100%;width:24px;height:2px;background:#d9d9d9;}
.kui-flow-step-item:last-child::after {display:none;}
.kui-flow-step-completed .anticon {color:#52c41a;}
.kui-flow-step-completed .kui-flow-step-name {color:#52c41a;}
.kui-flow-step-current .anticon {color:#1677ff;}
.kui-flow-step-current .kui-flow-step-name {color:#1677ff;}
.kui-flow-step-pending .anticon {color:#d9d9d9;}
.kui-flow-step-pending .kui-flow-step-name {color:#999;}
.kui-flow-step-failed .anticon {color:#ff4d4f;}
.kui-flow-step-failed .kui-flow-step-name {color:#ff4d4f;}
.kui-flow-step-completed::after {background:#52c41a;}
.kui-flow-step-current::after {background:#1677ff;}

:root[data-theme=dark] .kui-flow-step-name {color:#e0e0e0;}
:root[data-theme=dark] .kui-flow-step-user {color:#999;}
:root[data-theme=dark] .kui-flow-step-time {color:#666;}
:root[data-theme=dark] .kui-flow-step-pending .anticon {color:#434343;}
:root[data-theme=dark] .kui-flow-step-pending .kui-flow-step-name {color:#666;}
:root[data-theme=dark] .kui-flow-step-item::after {background:#434343;}
:root[data-theme=dark] .kui-flow-step-completed::after {background:#52c41a;}
:root[data-theme=dark] .kui-flow-step-current::after {background:#1677ff;}