/**
 * Two Column Block - 左栏图片高度修复
 * 
 * 问题：左栏图片高度被压缩
 * 原因：homepage-mimic.css 中的样式导致图片高度计算错误
 * 
 * 重要：只修复左栏，不影响右栏！
 * 
 * @package ToyParadis
 * @since 1.4.3
 */

/* ========================================
   左栏容器
   ======================================== */
.two-column-block .left-column {
    display: flex;
    min-height: 500px; /* 确保最小高度 */
}

/* ========================================
   背景图模式 - 只针对左栏
   ======================================== */
.two-column-block .left-column .full-height-banner {
    display: flex;
    width: 100%;
    position: relative;
    overflow: hidden;
    border-radius: 8px;
}

.two-column-block .left-column .full-height-banner .background-image {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

.two-column-block .left-column .full-height-banner .background-image .image {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 覆盖整个容器，保持比例 */
    object-position: center;
}

/* ========================================
   内容图模式 - 只针对左栏
   ======================================== */
.two-column-block .left-column .simple-banner {
    display: block;
    width: 100%;
    height: 100%; /* 填充整个左栏 */
    margin: 0 !important; /* 移除margin */
}

.two-column-block .left-column .simple-banner .image {
    width: 100%;
    height: 100%; /* 填充容器 */
    display: block;
    object-fit: cover; /* 保持比例并填充 */
    object-position: center;
}

/* ========================================
   右栏保持原样 - 明确不修改
   ======================================== */
.two-column-block .right-column .simple-banner {
    /* 保持原有样式 */
}

.two-column-block .right-column .simple-banner .image {
    width: 100%;
    height: auto !important; /* 右栏图片保持自动高度 */
    display: block;
    object-fit: initial !important; /* 不使用 cover */
}

/* ========================================
   响应式调整
   ======================================== */
@media (max-width: 1024px) {
    .two-column-block .left-column {
        min-height: 400px;
    }
}

@media (max-width: 768px) {
    .two-column-block .left-column {
        min-height: 300px;
    }
}

/* ========================================
   确保右栏不受影响
   ======================================== */
@media (min-width: 1025px) {
    .two-column-block {
        display: flex;
        align-items: stretch; /* 让左右栏等高 */
    }
    
    .two-column-block .left-column {
        display: flex;
        flex-direction: column;
    }
    
    /* 右栏保持原有布局 */
    .two-column-block .right-column {
        display: flex;
        flex-direction: column;
    }
}