﻿.product-card {
    position: sticky; /* 粘性定位 */
    top: 150px; /* 距离页面顶部 0px */
    z-index: 1000; /* 确保覆盖其他内容 */
}


.attr-options .option-btn {
    margin-right: 10px;
    margin-bottom: 10px;
}

    .attr-options .option-btn.selected {
        background-color: #409EFF !important; /* Element-UI 主色 */
        border-color: #409EFF !important;
        color: #fff !important;
    }

.attr-options .option-btn {
    margin-right: 10px;
    margin-bottom: 10px;
    border-radius: 4px;
    min-width: 80px;
}

    /* 选中状态（高亮） */
    .attr-options .option-btn.selected {
        background-color: #409EFF !important; /* Element-UI 默认主题色 */
        border-color: #409EFF !important;
        color: #fff !important;
        font-weight: bold;
        box-shadow: 0 0 5px rgba(64, 158, 255, 0.6);
    }

    /* 可选项（默认状态） */
    .attr-options .option-btn:not(.selected):not([disabled]) {
        border: 1px solid #dcdfe6;
        color: #fff;
    }

    /* 禁用状态（适合白色页面风格） */
    .attr-options .option-btn[disabled] {
        background-color: #fafafa !important; /* 轻微灰白底色，与白底区分 */
        border-color: #dcdfe6 !important; /* 柔和浅灰边框 */
        color: #b8b8b8 !important; /* 字体为中性浅灰 */
        cursor: not-allowed;
        opacity: 0.9; /* 稍高一点透明度，保持清晰 */
        box-shadow: none; /* 干净无阴影 */
    }


.model-display {
    margin-top: 15px;
    font-size: 18px;
    color: #333;
}

    .model-display b {
        color: #409EFF;
        font-weight: bold;
        margin-left: 5px;
    }

/* 优化：深色模式下的禁用按钮（清晰对比、柔和质感） */
/*     .el-button.is-disabled {
        background-color: #cccccc !important; 
        border-color: #6a6a6a !important; 
        color: #5c5c5c !important;
        cursor: not-allowed !important;
        opacity: 1 !important; 
        box-shadow: none !important; 
        transition: background-color 0.2s ease, border-color 0.2s ease;
    } */


/* 可选按钮 */
.attr-options .el-button {
    margin: 4px;
}

    /* 已选按钮高亮 */
    .attr-options .el-button.primary {
        background-color: #409EFF !important; /* Element 默认蓝 */
        color: #fff !important;
    }

.param-list-box {
    background: #f9f9f9;
    padding: 10px 14px;
    border-radius: 6px;
    border: 1px solid #e0e0e0;
    font-size: 14px;
    max-width: 500px; /* 避免撑满整行，按需调整 */
}

.param-row {
    display: grid;
    grid-template-columns: 150px auto; /* 左固定宽度，右自适应 */
    padding: 4px 0;
    word-break: break-all;
}

.param-label {
    font-weight: 600;
    color: #444;
}

.param-value {
    color: #000;
}
