* {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
   font-family: "Microsoft YaHei", "微软雅黑", "PingFang SC", "Helvetica Neue", Arial, sans-serif;
}
html, body 
{
	background-color: #f5f6fa;
	height:100%;
	  margin: 0;
 }


.long-text {
  white-space: nowrap; /* 强制不换行 */
}
.titleHover
{
	display:block;
	
	border-radius: 10px;
	
}

.titleHover:hover {
	background-color: #f0f0f0; /* 鼠标移上去变灰 */
}
.titleHover:hover::after {
  opacity: 1; /* 悬停时显示遮罩，模拟按钮按下效果 */
}
.ftsmall {
    font-size: small;
}
.label-xl {
  font-size: 0.8rem;        /* 更大的字体 */
}
.carousel-item img {
      height: 500px;
      object-fit: contain;
      width: 100%; /* 确保图片宽度填满轮播项 */
    }

.product-item {
	display: grid; 
	height:100px;

	border: 1px solid #ccc; /* 边框 */
	border-radius: 10px;
	box-sizing: border-box;
	 padding: 0px;
	justify-items: start;  /* 单元格内容靠左 */
  align-items: start;    /* 单元格内容靠上 */

	  
}
.product-info {
	width: 100%;
	padding: 4px; 
}

.detailpage_bottom
{
	padding: 4px; 
}

.download-btn {
        background-color: #4285f4;
        color: white;
        padding: 8px 16px;
        border-radius: 4px;
        text-decoration: none;
        font-weight: 500;
        transition: background-color 0.2s;
    }
.download-btn:hover {
        background-color: #3367d6;
    }
  
h1 {
    font-size: 24px;
    margin-bottom: 20px;
    color: #333;
}

.product-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, 300px); /* 使用固定宽度代替minmax */
	grid-template-rows: repeat(auto-fill, auto); /* 使用固定宽度代替minmax */
	padding:4px;
    gap: 8px;
    justify-content: center; /* 居中显示商品网格 */
	 margin-top: 4px;
}


.product-image {
	margin: 0 auto;
	height: 100%;
	padding:10px;
	width:120px;
	object-fit: contain;
}


/* 抽屉 */
#sidebar {
  width: 240px;
  height: 100vh;
  position: fixed;
  top: 0;
  left: 0;
  background: #f5f5f5;
  box-shadow: 2px 0 6px rgba(0,0,0,.3);
  transform: translateX(-100%);
  transition: transform .25s ease;
  padding: 16px;
  z-index: 2000;
}
#sidebar.active {
  transform: translateX(0);
}

/* 遮罩层 */
#overlay {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0,0,0,.4);
  z-index: 1500;
}

/* 按钮 */
#toggleBtn {
  position: fixed;
  top: 2px;
  left: 2px;
  z-index: 1000; /* 保证按钮永远在最上层 */
}

.wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;  /* 撑满视口 */
}