/* 全局样式定义 */
/* 请注意，直接覆盖第三方组件（如Element UI组件）的样式可能会导致在未来更新组件库时出现样式冲突或不一致的问题。 */
/* 更好的做法是使用组件库提供的自定义主题或样式修改接口（如果可用），这样可以确保样式的兼容性和可维护性。 */
/* 如果必须直接覆盖样式，请确保了解选择器特异性，并尽量使用更具体的选择器来避免不必要的全局影响，减少潜在的样式冲突。 */

/* 设置html, body, 和#app元素的高度为100%，且没有边距和填充，最小宽度为1366px */
html, /* 根元素html，设置全局的基础样式 */
body, /* body元素，页面的主体部分 */
#app { /* #app元素，Vue应用的挂载点 */
    height: 100%; /* 设置高度为100%，确保页面内容填满整个视口 */
    margin: 0; /* 移除默认的外边距 */
    padding: 0; /* 移除默认的内边距 */
    min-width: 1366px; /* 设置最小宽度，确保页面在较小的屏幕上也能保持一定的布局 */
}

/* 设置面包屑导航的底部外边距为15px，字体大小为12px */
.el-breadcrumb { /* Element UI的面包屑导航组件 */
    margin-bottom: 15px; /* 设置底部外边距，为下方的元素留出空间 */
    font-size: 12px; /* 设置字体大小，使导航文字更加紧凑 */
}

/* 为el-card组件添加盒子阴影效果，增加视觉层次感 */
.el-card { /* Element UI的卡片组件 */
    box-shadow: 0 1px 1px rgba(0, 0, 0, 0.15) !important; /* 添加盒子阴影，提升视觉效果 */
    /* !important用于确保该规则优先级最高，避免被其他样式覆盖 */
}

/* 设置el-table表格的顶部外边距为15px，字体大小为12px */
.el-table { /* Element UI的表格组件 */
    margin-top: 15px; /* 设置顶部外边距，为上方的元素留出空间 */
    font-size: 12px; /* 设置字体大小，使表格内容更加紧凑 */
}

/* 设置el-pagination分页组件的顶部外边距为15px */
.el-pagination { /* Element UI的分页组件 */
    margin-top: 15px; /* 设置顶部外边距，为上方的元素留出空间 */
}

/* 解决级联选择框内部滚动条包裹元素的高度问题 */
/* 注意：这里的选择器可能存在特异性问题，通常不建议这样直接覆盖第三方组件的样式，除非有特别的需求 */
div .el-scrollbar__wrap { /* Element UI级联选择框内部滚动条包裹元素 */
    height: 300px !important; /* 强制设置高度为300px，确保滚动条能够正常工作 */
    /* !important用于确保该规则优先级最高，避免被其他样式覆盖 */
}

/* 步骤条样式 */
/* 设置el-steps步骤条组件的外边距，上下各15px */
.el-steps { /* Element UI的步骤条组件 */
    margin: 15px 0; /* 设置上下外边距，为步骤条上方和下方的元素留出空间 */
}

/* 设置el-step步骤项标题的字体大小为13px */
.el-step__title { /* Element UI步骤条中步骤项的标题 */
    font-size: 13px; /* 设置字体大小，使步骤标题更加清晰易读 */
}

/* 富文本编辑器ql-editor的最小高度设置 */
/* 这通常用于Quill富文本编辑器，确保编辑器区域有足够的高度进行内容编辑 */
.ql-editor { /* Quill富文本编辑器的编辑区域 */
    min-height: 300px; /* 设置最小高度，确保用户有足够的空间进行内容编辑 */
}