﻿/* 隐藏Chrome/Safari/Edge的滚动条 */
::-webkit-scrollbar {
  display: none; /* 宽度设为0也可以：width: 0; */
}

/* 隐藏Firefox的滚动条 */
html {
  scrollbar-width: none; /* 可选值：auto | thin | none */
}

/* 兼容IE/Edge旧版本 */
body {
  -ms-overflow-style: none; /* 可选值：auto | none | scrollbar | -ms-autohiding-scrollbar */
}
    .header-wai-left{
      box-shadow: none !important;
      clip-path:none !important;
      background: none !important;
      border: none !important;
      height: auto !important;
      width: 238px !important;
      margin-left: 10vw;
      padding-left: 0px !important;
    }
    .header-wai-container{
      border-bottom: none !important;
      background: #fafafa !important;
    }
    .header-wai-right{
      margin-left: 40px !important;
      gap: 40px !important;
    }
    .header-wai-left::after{
      background-color: none !important;
      height: 0px !important;
      width: 0px !important;
    }
    .yin{
      display: none;
    }
    .wai-logo{
      margin-left: 0px !important;
    }
   
    .wai-logo-desc-top{
      font-size: 18px;
      color: #202020;
      margin-bottom: 10px;
    }
    .wai-logo-desc-bot{
      font-size: 8px;
    }
    #clear-filters{
      color: #1B7EFD;
    }
    /* .header-wai-left{
      width: 400px;
    } */
    /* .nav-menu{
      margin-left: 0px !important;
    } */
    .filter-active{
      color: #CE2A0D !important;
    }
    .border-primary{
      border: none !important;
    }
    .bg-light{
      background: #F8F8F8 !important;
    }
    .filter-top{
      display: flex;
      justify-content: space-between;
    }
    .header-wai-container{
      padding: 10px 180px
    }
    .header-search-groups{
    border-right: none;
    border-radius: 6px;
    outline: none;
    width: 300px;
    display: flex;
    background: #FFF;
    border-radius: 6px;
    }
    .header-search-inputs{
      padding: 6px 10px;
    border-right: none;
    border-radius: 4px 0 0 4px;
    outline: none;
    width: 280px;
    border-right: none;
    border-radius: 6px 0 0 6px;
    }
    .header-search-btns{
      width: 110px;
      padding: 6px 0px;
      color: #fff;
      border: none;
      
    position: relative;
      border-radius: 0px 6px 6px 0px;
      cursor: pointer;
      /* background-color: #C8102E; */
    }
    .header-search-btns::before {
    content: "";
    /* 放大镜镜头大小 */
    width: 16px;
    height: 16px;
    /* 白色边框，粗细1px更精致 */
    border: 1px solid #999;
    border-radius: 50%;
    /* 圆形镜头 */
    position: absolute;
    left: 38px;
    /* 水平居中调整 */
    top: 50%;
    transform: translateY(-50%);
}
.header-search-btns::after {
    content: "";
    width: 8px;
    height: 1px;
    background-color: #999;
    position: absolute;
    left: 52px;
    /* 手柄位置和镜头对齐 */
    top: 65%;
    transform: rotate(45deg);
    /* 旋转成斜角手柄 */
}
    .transition-shadow{
      border: transparent;
      border-top: 1px solid #EEE;
    }
    .house-left{
      width: 180px !important;
      height: 130px !important;
    }
    .house-left img{
      width: 180px;
      height: 130px;
    }

	.space-y-6 > :not([hidden]) ~ :not([hidden]){
		margin-top:0px !important;
	}
	.spaned span{
		margin-right:15px;
	}
	.hover\:bg-gray-200:hover{
		background-color:transparent !important;
		color:#CE2A0D;
	}
	#toggle-filter{
		color:#A7A8A9 !important;
	}
	#custom-area-btn{
		color:#A7A8A9 !important;
	}
	.mb-4{
		/* display:flex; */
	}
	.mb-4 span{
		width: 100px; /* 可根据实际文字长度调整 */
		font-weight:800;
	}
	/* .mb-4 .inline-block{
		display: flex;
  flex-wrap: wrap;

	} */ 
	.top_bq{
		display:flex;
	}
	.biaoqian{
		background: #F7B500;
    border-radius: 4px;
    color: #fff;
    padding: 5px;
    margin-left: 10px;
    font-size: 10px;
	}
    .full-left{
      max-width: 830px !important;
    }
    .container{
      max-width: auto !important;
      margin: auto;
    }
    .border-list{
      padding: 30px 0;
      /* border-bottom: 1px solid #EEE; */
    }
    .bg-gray-100{
      background-color: #f2f5fb !important;
    }
.bg-light{
  border-bottom: 1px solid #EEE;
}
.full-right{
  width: 77% !important;
}
.text-sm{
  color: #828282;
}

    /* 右侧推荐区样式优化 - 重点修改 */
    .recommend-section {
      border-radius: 8px;
      /* padding: 16px; */
      background: #FFFFFF;

      position: relative;
    }

    .you{
      position: absolute;
      left: 0;
      top: 0;
      width: 80px;
      height: 32px;
      z-index: 2;
    }
    .recommend-title {
      font-size: 16px;
      font-weight: 600;
      color: #333333;
      padding-bottom: 8px;
      margin-bottom: 16px;
    }
    .recommend-content {
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    .recommend-item {
      border: 1px solid #E5E7EB;
      border-radius: 8px;
      overflow: hidden;
      transition: all 0.3s ease;
      margin-bottom: 30px;
      box-shadow: 0px 0 10px 0px rgba(0,0,0,0.1);
    }
    .recommend-item:hover {
      box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
      transform: translateY(-2px);
    }
    .recommend-item img {
      width: 100%;
      height: 120px;
      object-fit: cover;
    }
    .recommend-item .recommend-info {
      padding: 12px;
    }
    .recommend-item h4 {
         font-weight: bold;
      font-size: 18px;
      color: #333333;
      margin-bottom: 10px;
	  white-space: nowrap;
  /* 2. 超出容器部分隐藏 */
  overflow: hidden;
  /* 3. 超出部分用省略号代替 */
  text-overflow: ellipsis;
    }
    .recommend-item p {
      font-size: 16px;
      color: #474B4E;
      margin-bottom: 20px;
    }
    .recommend-item .price {
      font-size: 14px;
      color: #fd4e39;
      font-weight: 500;
    }
    .text-primary{
      color: #fd4e39 !important;
    }
    /* 分页样式优化 */
    .pagination {
      margin: 30px auto;
      text-align: center;
    }
.pagination a {
    position: relative;
    display: inline-flex;
    align-items: center;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    background-color: rgb(255 255 255 / var(--tw-bg-opacity, 1));
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    --tw-text-opacity: 1;
    color: rgb(55 65 81 / var(--tw-text-opacity, 1));
    transition-property: color, background-color, border-color, fill, stroke, -webkit-text-decoration-color;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke;
    transition-property: color, background-color, border-color, text-decoration-color, fill, stroke, -webkit-text-decoration-color;
    transition-timing-function: cubic-bezier(0.4, 0, 0.2, 1);
    transition-duration: 200ms;
}
.pagination span{
background-color: #C8102E;
      color: #FFFFFF;
      border-color: #C8102E;
position: relative;
    display: inline-flex;
    align-items: center;
    border-width: 1px;
    --tw-border-opacity: 1;
    border-color: rgb(209 213 219 / var(--tw-border-opacity, 1));
    --tw-bg-opacity: 1;
    
    padding-left: 1rem;
    padding-right: 1rem;
    padding-top: 0.5rem;
    padding-bottom: 0.5rem;
    font-size: 0.875rem;
    line-height: 1.25rem;
    font-weight: 500;
    --tw-text-opacity: 1;
}
.pagination a {
    margin: 0 2px;
    border-radius: 4px;
}
    .pagination-btn {
      margin: 0 2px;
      border-radius: 4px;
    }
    .pagination-btn.active {
      background-color: #C8102E;
      color: #FFFFFF;
      border-color: #C8102E;
    }

.zhuneu .filter-container .filter-item{ padding-left: 100px; position: relative;}
.zhuneu .filter-container .filter-item .font-medium{ position: absolute; left: 0; top: 0;}

@media (min-width: 1536px) {
    .container {
        max-width: 1200px !important;
    }
    
}
@media(max-width:1440px){
  .header-container{
    max-width: 980px !important;
  }
  .header-wai-left{
      margin-left: 4vw;
    }
    .nav-menu{
      margin-left: 220px !important;
    }
    .zhuneu{
      max-width: 1000px !important;
      margin: auto;
    }
    .nav-main .container{
      max-width: 100% !important;
      overflow: hidden;
    }
}
@media(max-width:1366px){
  .header-container{
    max-width: 900px !important;
  }
   .nav-menu{
      margin-left: 180px !important;
    }
  .header-wai-left{
      margin-left: 1vw;
    }
   
}

/* house-detail.html */

