/* 1. 左侧：产品描述文字 */
.product-info p {
    font-size: 15px !important;   /* 调大字号 */
    line-height: 1.8 !important;  /* 增加行高，阅读更舒适 */
    color: #555 !important;       /* 加深颜色，增加清晰度 */
    margin-bottom: 5px;
}

/* 2. 右侧：订单概览 (全局文字调大) */
#orderSummary, 
.order-summary {
    font-size: 15px !important;   /* 基础字号设为 15px */
}

/* 针对概览内部的具体项目 (如配置选项、价格等) */
#producttotal span,
#producttotal div,
.summary-totals,
.clearfix {
    font-size: 15px !important;
    line-height: 1.6 !important;
}

/* 特别调整：概览里的“产品名称” (例如: 住宅代理) */
.order-summary .product-name {
    font-size: 18px !important;   /* 标题再大一点，拉开层次 */
    font-weight: 700 !important;
    margin-bottom: 10px;
    display: block;
}

/* 特别调整：概览底部的“总计”金额 */
.total-due-today .amt {
    font-size: 26px !important;   /* 金额保持醒目 */
}

/* ====================================================
   4. 修复订单概览的双重分割线
   ==================================================== */

/* 移除“总计金额”区域顶部的边框和内边距 */
.order-summary .summary-totals {
    border-top: none !important;   /* 去掉下面那条线 */
    padding-top: 5px !important;   /* 稍微减小一点间距，让它靠上去 */
    margin-top: 5px !important;
}

/* ====================================================
   5. 隐藏缩放/移动端出现的额外菜单 (分类与动作)
   ==================================================== */

/* 隐藏移动端/响应式布局下的顶部下拉菜单 */
.sidebar-collapsed {
    display: none !important;
}

/* 再次确保桌面端侧边栏也被隐藏 */
.cart-sidebar {
    display: none !important;
}

/* 再次强制内容区域全宽 (防止因隐藏侧边栏留下的空白) */
.cart-body {
    width: 100% !important;
    float: none !important;
    flex-basis: 100% !important;
    max-width: 100% !important;
}

/* 额外修复：清除 Bootstrap 原生伪元素干扰 */
#productConfigurableOptions .row::before,
#productConfigurableOptions .row::after {
    content: none !important;
    display: none !important;
}

/* ====================================================
   5. 终极对齐修复：卡片网格 (微调版)
   ==================================================== */

/* 1. 父级列保持原样 */
#productConfigurableOptions .col-sm-12 {
    padding-left: 15px;
    padding-right: 15px;
}

/* 2. 定义网格容器 */
.config-option-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 15px;
    
    /* --- 桌面端设置 --- */
    
    /* 左边：0 (保持不动，因为左边已经对齐) */
    margin-left: 0 !important;
    
    /* 右边：改为 -10px (把拉伸距离从 15 减小到 10) */
    margin-right: -10px !important; 
    
    /* 宽度：自动适应 */
    width: auto !important; 
}

/* 3. 手机端适配 (改为两列布局) */
@media (max-width: 768px) {
    .config-option-grid {
        /* 核心修改：repeat(2, 1fr) 表示强制分为两列 */
        grid-template-columns: repeat(2, 1fr) !important; 
        
        /* 优化：手机屏幕较窄，把间距从 15px 调小为 10px，留更多空间给文字 */
        gap: 10px !important; 
        
        /* 保持之前的右侧对齐修复 (使用您刚才测试成功的数值，如 -10px) */
        margin-left: 0 !important;
        margin-right: -10px !important; 
        width: auto !important;
    }
    
    /* 可选：防止手机上文字折行，稍微减小一点字号 (如果您觉得文字太挤可以加上这段) */
    .card-title, .card-price {
        font-size: 13px !important; 
    }
    .radio-card {
        padding: 10px 10px !important; /* 减小内边距，更紧凑 */
        min-height: 80px !important;
    }
}