/* 为二级菜单项添加左边距 */
.indentation {
  padding-left: 20px; 
}

/*通用设置*/
.over-y{overflow-y:hidden;padding-right: 8px;}
.over-x{width: calc(100% - 10px);overflow-x:auto;white-space: nowrap;text-overflow: ellipsis;}
.over-x::-webkit-scrollbar {
  width: 5px; /* 设置滚动条的粗细 */
  height: 10px; /* 设置滚动条的高度 */
}
 
/* 滚动条轨道 */
.over-x::-webkit-scrollbar-track {
  background: #f1f1f1; /* 设置轨道的背景颜色 */
}
 
/* 滚动条的Thumb（滑块） */
.over-x::-webkit-scrollbar-thumb {
  background: #E4E4E4; /* 设置滑块的背景颜色 */
  border-radius: 5px; /* 设置滑块的圆角 */
}

.my-checkbox{
	width:16px;
	height:16px;
}


.layui-nav{font-size: 20px;}
.left-side-open{}
#exitfullscreen{display:none}
#spread-left{display:none}

/*home页面样式设计*/
.home-top-left{height:150px;background-color:#FFF;opacity:0.9;border-radius:5px;}
.home-top-right{height:150px;background-color:#G5G5G5;opacity:0.9;}
.top-left-1{height:150px;width:48%;background-color:#FFF;padding-left:10px;margin:10px;}
.top-left-2{height:150px;width:48%;background-color:#FFF;padding-left:10px;margin:10px;}
.myicon{ display: inline-block;
    width: 95%;
    height: 90px;
    line-height: 90px;
    text-align: center;
    border-radius: 2px;
    font-size: 35px;
    background-color: #F8F8F8;
    color: #333;
    transition: all .3s;
    -webkit-transition: all .3s
}
.myicon-1{ display: inline-block;
    width: 95%;
    height: 120px;
    line-height: 90px;
    text-align: center;
    border-radius: 2px;
    font-size: 16px;
    background-color: #F8F8F8;
    color: #333;
    transition: all .3s;
    -webkit-transition: all .3s
}
.my-text{text-align:center;padding-top:10px;}

/*带滚动条的头部样式*/
.top-indentation{width: calc(100% - 15px);float:right;}
.top-position{
	position: fixed; /* 固定定位，不随滚动移动 */
       top: 0; /* 距离顶部0px */
       left: 0; /* 距离左侧0px */
       width: calc(100% - 30px); /* 宽度占满窗口 */
       background-color: #fff; /* 白色背景，避免下方内容透过来 */
       z-index: 999; /* 层级高于下方内容，防止被遮挡 */
       padding: 0 15px; /* 保持与原布局一致的左右内边距 */
       box-shadow: 0 0 0 rgba(0,0,0,0.1); /* 可选：添加阴影，提升视觉层次 */
}

/*物流数据样式*/
.wuliu-1{border-radius: 2px;
		background-color:#43CF7C;
		opacity:0.5;
		width:90%;
		height:90px;
		margin-top:10px;
		font-size:48px;
		font-weight:thin;
		text-align:center;
}
.wuliu-2{border-radius: 2px;
		background-color:#E5E5E5;
		opacity:0.6; width:90%;
		height:90px;
		margin-top:10px;
		font-size:48px;
		text-align:center;
}
.wuliu-font{width:90%;
			margin-top:10px;
			font-size:14px;
			font-weight:100;
			text-align:center;
}
/*投标数据样式*/
.bid-1{border-radius: 2px;
		background-color:#FF8D1A;
		opacity:0.5;
		width:100px;
		height:100px;
		margin-top:60px;
		font-size:48px;
		font-weight:thin;
		text-align:center;
		display: flex;
		align-items: center;
		justify-content: center;
}
.bid-2{border-radius: 2px;
		background-color:#E5E5E5;
		opacity:0.6; 
		width:100px;
		height:100px;
		margin-top:10px;
		font-size:48px;
		font-weight:thin;
		text-align:center;
		display: flex;
		align-items: center;
		justify-content: center;
}
.bid-font{
		width:100px;
		margin-top:10px;
		font-size:14px;
		font-weight:100;
		text-align:center;
}

.layui-input-block:disabled {
  background-color: #e6e6e6; /* 灰色背景 */
  color: #999; /* 灰色文字 */
  cursor: not-allowed; /* 设置鼠标样式为不允许操作 */
}

.my-padding-1{padding-top:8px;padding-left:10px;}
.my-padding-2{padding-top:8px;padding-left:50%;}

.checkbox-container {
  display: flex;
  align-items: center; /* 垂直居中 */
  justify-content: center; /* 水平居中，如果需要的话 */
  height: 30px; /* 设置div的高度 */
  float:left;
}

.layui-tab-title li:first-child .layui-tab-close{
 display: none;
}
.my li:first-child .layui-tab-close{
 display: inline-block;
}

.agreement{
	height:auto;
	width:90%;
	padding-left:30px;
	letter-spacing:1px;
	display:block
}

.layui-icon {
  position: relative;
  display: inline-block;
}
 
.badge {
  position: absolute;
  margin-top:10px;
  width:20px;
  height:20px;
  line-height:20px;
  padding-top:-5px;
  background-color: #FF5733;
  color: white;
  border-radius: 50%;
  font-size: 10px;
  font-weight:300;
  min-width: 18px;
  text-align: center;
}

.flex-center {
  display: flex;
  justify-content: center;
  border-radius:2px;
  margin-top:15px;
  background-color:#E5E5E5
 }
.my-view-1 {
	height:150px;
	background-color:#FFF;
	border-radius:2px;
	margin:10px;
}
.footer {
	display: flex;
	align-items: center;
	height:200px;
	background-color:#393D49
}
.footer-text {
	line-height:35px;
	color:#fff;
	padding-left:20px
}
.footer-text a {
    color: white;
    text-decoration: none; /* 去除下划线 */
  }

.domain {
	text-align:center;
	font-size:28px;
	margin-top:25px;
	margin-bottom:10px
}
/* Flex布局实现间距 */
.flex-container {
  display: flex;
  flex-wrap: wrap;
  margin: -10px; /* 抵消第一个元素的额外边距 */
  margin-bottom:20px;
}

.flex-item {
  flex: 0 0 calc(25% - 20px); /* 四列布局，每列减去20px间距 */
  margin: 10px;
}
.domain-1 {
	height:auto;
	padding:15px;
	font-size:14px;
	margin-top:10px;
	border-radius:10px;
	background-color:rgba(241,246,253,0.9);
}
.domain-title {
	line-height:55px;
	font-size:22px;
	text-align:center;
}
.domain-content {
	line-height:35px;
	font-size:16px;
	padding-left:10px;
}
.renli{
	height:240px;
	padding:15px;
	font-size:14px;
	margin-top:5px;
	margin-bottom:5px;
	border-radius:5px;
	background-color:rgba(229, 229, 229, 0.3);
}
.renli-title {
	line-height:45px;
	font-size:22px;
	text-align:center;
}
.renli-content {
	line-height:28px;
	font-size:16px;
}	
.huoban {
	font-size:24px;
	margin-top:20px;
	margin-bottom:10px;
}
.huoban-form {
	display: flex;
	flex-direction: column;
    justify-content: flex-start;
}
 .domain-1:hover {
      transform: scale(1.05) translateY(-5px);
      box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15); /* 增加阴影深度 */
	  background-color:#4facfe;
	  color:#fff
 }
 /* 水平滚动样式 */
.horizontal-slider {
  width: 100%;
  overflow: hidden;
  position: relative;
  background-color: #fff;
  padding: 20px 0;
  margin-top: 10px;
  border-radius: 8px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  background-color: rgba(229, 229, 229, 0.5)
}

.horizontal-track {
  display: flex;
  animation: scroll-left 30s linear infinite;
  gap: 20px; /* 使用 gap 替代 margin，更简洁地控制间距 */
  /* 可选：确保容器宽度足够 */
  width: max-content; /* 使容器宽度等于内容总宽度 */
}

.horizontal-track img {
  width: auto;
  height: 120px;
  margin-right: 20px;
  flex-shrink: 0;
  border-radius: 4px;
  object-fit: cover;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* 动画关键帧 
@keyframes scroll-left {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-20px); 
  }
}*/

/* 鼠标悬停效果 */
.horizontal-track .merchant:hover {
  transform: scale(1.05);
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.15);
  z-index: 10;
}

/* 鼠标悬停暂停效果 */
.horizontal-track:hover {
  animation-play-state: paused;
}

/* 商家卡片样式 - 核心修改点 */
.merchant {
  position: relative;
  width: 260px; /* 保持固定宽度 */
  flex-shrink: 0; /* 禁用自动收缩 */
  box-sizing: border-box; /* 使 width 包含 padding 和 border */
  border: 1px solid #eee;
  border-radius: 8px;
  margin: 0; /* 移除 margin，改用父容器的 gap */
  padding: 10px;
  overflow: hidden;
  text-align: center;
  background-color: #fff;
  transition: transform 0.3s ease, box-shadow 0.3s ease; /* 添加过渡效果 */
}

/* banner图片样式 */
.merchant > div:first-child {
  height: 150px;
  overflow: hidden;
}

/* logo图片样式 */
.merchant > div:nth-child(2) {
  position: absolute;
  top: 100px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 10;
  width: 60px;
  height: 60px;
  border-radius: 50%;
  overflow: hidden;
  border: 2px solid white;
  box-shadow: 0 2px 5px rgba(0, 0, 0, 0.2);
}

.merchant > div:nth-child(2) img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* 响应式调整 */
@media (max-width: 768px) {
  .merchant {
    width: 280px; /* 缩小卡片宽度以适应移动端 */
  }
  .horizontal-track {
    gap: 10px; /* 缩小间距 */
  }
}
/* 兼容旧版浏览器的居中方式 */
.fixed-btn {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 20px;
  margin: 0 auto; /* 水平居中 */
  width: fit-content; /* 自适应内容宽度 */
  /* 移除 transform 相关代码 */
}