/* 让列表变成可换行的 flex 容器 */
/* 外层：为 margin 腾空间 */
/*.filepond--list-scroller {
!*    display: flex !important;
    flex-wrap: wrap !important;*!
    margin: -10px;
}*/

/*!* ===== PC：4 列 ===== *!
.filepond--item {
    flex: 0 0 calc(25% - 20px) !important;
    width: calc(25% - 20px) !important;
    margin: 10px !important;
    box-sizing: border-box;
}

!* ===== 平板：3 列 ===== *!
@media (max-width: 992px) {
    .filepond--item {
        flex: 0 0 calc(33.333% - 20px) !important;
        width: calc(33.333% - 20px) !important;
    }
}

!* ===== 手机：2 列 ===== *!
@media (max-width: 576px) {
    .filepond--item {
        flex: 0 0 calc(50% - 20px) !important;
        width: calc(50% - 20px) !important;
    }
}*/
.filepond--item {
    width: calc(20% - 20px) !important;
}

@media (max-width: 992px) {
    .filepond--item {
        width: calc(33.333% - 20px) !important;
    }
}
@media (max-width: 576px) {
    .filepond--item {
        width: calc(100% - 20px) !important;
    }
}
.filepond--image-preview-wrapper {
    display: flex;
    align-items: center;
    justify-content: center;
}

.filepond--image-preview {
    width: 100%;
    height: 100%;
    object-fit: cover !important;
}

/* 统一预览高度 */
/*.filepond--image-preview-wrapper {
    height: 120px;
}*/

/* 去掉 list 模式的拉伸背景感 */
.filepond--item-panel {
    background-color: #111;
}