/**
 * 强制显示预设区域
 * 优先级最高
 */

/* 重要：强制预设区域在左侧 70% */
.i2i-horizontal-layout .quick-select-container {
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
    flex: 0.7 !important;
    order: 1 !important;
    width: 70% !important;
}

/* 重要：强制上传区域在右侧 30% */
.i2i-horizontal-layout .image-upload-area {
    flex: 0.3 !important;
    order: 2 !important;
    width: 30% !important;
}

/* 强制显示预设网格区域（与文生图一致） */
.quick-presets-grid {
    display: grid !important;
    grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
    grid-template-rows: repeat(2, auto) !important;
    visibility: visible !important;
    opacity: 1 !important;
    width: 100% !important;
    min-height: 150px !important;
    min-width: 0 !important;
}

/* 移动端兼容：一行6个（5个选项+1个更多按钮） */
@media (max-width: 768px) {
    .quick-presets-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr)) !important;
        grid-template-rows: repeat(2, auto) !important;
    }
    /* 移动端堆叠：确保容器各占整行 */
    #img2img-panel .i2i-horizontal-layout {
        flex-direction: column !important;
    }
    #img2img-panel .i2i-horizontal-layout .quick-select-container,
    #img2img-panel .i2i-horizontal-layout .image-upload-area {
        flex: 1 1 100% !important;
        width: 100% !important;
        max-width: 100% !important;
        order: initial !important;
    }
}

/* 由grid控制宽度 */
.quick-preset-item {
    width: 100% !important;
    margin: 0 !important;
    aspect-ratio: 1 !important;
    display: flex !important;
    flex-direction: column !important;
    border: 1px solid #e2e8f0 !important;
    border-radius: 8px !important;
    overflow: hidden !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 清除旧布局冲突 */
.upload-preset-row {
    display: none !important;
}

/* 隐藏旧的更多按钮 */
.view-more-btn {
    display: none !important;
}

/* 强制更多按钮显示（由grid控制宽度） */
.more-presets-item {
    width: 100% !important;
    display: flex !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 强制显示预设元素 */
.quick-preset-image {
    height: 75% !important;
    display: block !important;
    visibility: visible !important;
    opacity: 1 !important;
}

/* 强制显示名称 */
.quick-preset-name {
    height: 25% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    visibility: visible !important;
    opacity: 1 !important;
    text-align: center !important;
    padding: 8px !important;
    font-size: 14px !important;
}

/* 确保图片区域正常显示 */
.image-upload-area input[type="file"] {
    display: none !important;
}

/* 确保上传区域正常显示 */
.image-upload-zone {
    display: flex !important;
    flex-direction: column !important;
    justify-content: center !important;
    align-items: center !important;
    height: 100% !important;
    border: 2px dashed #cbd5e1 !important;
    border-radius: 8px !important;
    background: #f8fafc !important;
}
