/* CPU单选按钮样式 */
.cpu-radio-button {
  position: relative;
  height: auto !important;
  min-height: 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 8px 12px !important;
}

.cpu-name {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
}

/* 性能提示 - 默认隐藏，选中时显示 */
/* CPU单选按钮样式 */
.cpu-radio-button {
  position: relative;
  height: auto !important;
  min-height: 50px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  padding: 8px 12px !important;
}

.cpu-name {
  font-size: 14px;
  font-weight: 500;
  line-height: 1.2;
}

/* 性能提示 - 始终显示 */
.performance-hint {
  display: flex;
  align-items: center;
  gap: 4px;
  font-size: 13px;
  margin-top: 2px;
}

/* 图标样式 */
.cpu-icon {
  width: 20px;
  height: 20px;
  vertical-align: middle;
}

/* 根据CPU类型设置不同颜色 */
.performance-hint[data-cpu*="Intel Xeon V2"] {
  color: #e6a23c; /* 警告色 - 黄色 */
}

.performance-hint[data-cpu*="Xeon Gold"] {
  color: #1296db; /* 成功色 - 绿色 */
}

.performance-hint[data-cpu*="Intel Platinum"] {
  color: #1296db; /* 默认灰色 */
}

.performance-hint[data-cpu*="AMD EPYC"] {
  color: #d81e06; /* 橙色 - 与图片一致 */
}






/* 气泡提示容器 */
.storage-bubble {
  display: flex;
  align-items: center;
  padding: 8px 12px;
  margin: 8px 0 12px;
  border-radius: 6px;
  font-size: 14px;
  font-weight: 500;
}

.bubble-icon {
  width: 30px;
  height: 30px;
  margin-right: 8px;
}

/* 固态硬盘气泡 */
.ssd-bubble {
  background: rgba(24, 144, 255, 0.1);
  border-left: 3px solid #1890ff;
  color: #1890ff;
}

/* RAID气泡 */
.raid-bubble {
  background: rgba(24, 144, 255, 0.1);
  border-left: 3px solid #1890ff;
  color: #1890ff;
}















.Hui-title {
    color: #111827;
    font-size: 0.18rem;
    border-bottom: 1px solid #e2e8f0;
    padding-bottom: 0.2rem;
    gap: 0.2rem;
    
}


        .promo-banner {
            max-width: 80%;
            margin: 20px auto;
            padding: 15px 24px;
            background: linear-gradient(135deg, #ff9a00, #ff5e00);
            color: white;
            font-family: 'Microsoft YaHei', sans-serif;
            font-size: 18px;
            font-weight: bold;
            text-align: center;
            border-radius: 8px;
            box-shadow: 0 4px 12px rgba(255, 94, 0, 0.25);
            position: relative;
            animation: pulse 3s ease-in-out infinite;
        }
        .promo-banner::before, .promo-banner::after {
            content: "🔥";
            display: inline-block;
            margin: 0 10px;
        }
        









.promo-banner-jinggao {
    /*max-width: 80%;*/
    margin: 20px auto;
    padding: 12px 24px;
    background: linear-gradient(25deg, #ff6666, #ff3366);
    color: white;
    font-family: 'Arial', sans-serif;
    font-size: 18px;
    font-weight: bold;
    text-align: center;
    border-radius: 8px;
    box-shadow: 0 4px 15px rgba(255, 94, 0, 0.3);
    animation: pulse 2s infinite;
}

@keyframes pulse {
    0% { transform: scale(1); }
    50% { transform: scale(1.02); }
    100% { transform: scale(1); }
}









.template {
  height: 100%;
}
.main-card {
  height: 100%;
}
.config-box {
  height: 100%;
  display: flex;
  flex-direction: column;
}
.content {
  flex: 1;
}
.goods-item-name {
  cursor: pointer;
  padding: 6px 12px;
  border: 1px solid var(--color-primary);
  color: var(--color-primary);
  border-radius: 3px;
  margin-bottom: 30px;
  display: inline-block;
}
.goods-change-box {
  max-width: 100%;
}
.goods-change-box .goods-item-box {
  max-height: 500px;
  overflow-y: auto;
  padding: 0.2rem;
}
.goods-change-box .goods-item-box .goods-group-item {
  margin-bottom: 0.3rem;
}
.goods-change-box .goods-item-box .goods-group-item .goods-group-name {
  font-weight: 700;
  font-size: 0.18rem;
  margin-bottom: 0.15rem;
}
.goods-change-box .goods-item-box .goods-group-item .goods-group-info {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  grid-column-gap: 15px;
  row-gap: 0.1rem;
}
.goods-change-box .goods-item-box .goods-group-item .goods-group-info .option-name {
  cursor: pointer;
  font-size: 0.14rem;
}
.goods-change-box .goods-item-box .goods-group-item .goods-group-info .option-name:hover {
  color: var(--color-primary);
}