/* ==================================================
   AFC 产品搜索页
   ================================================== */

:root{
  --afc-search-primary:#1EA8A7;
  --afc-search-primary-dark:#168F8E;
  --afc-search-title:#153231;
  --afc-search-text:#4F6665;
  --afc-search-muted:#78908F;
  --afc-search-border:#E3ECEC;
  --afc-search-bg:#F7FAFA;
  --afc-search-white:#FFFFFF;
}

.afc-search-page{
  width:100%;
  margin:0;
  padding:0;
  background:var(--afc-search-bg);
}

/* 顶部搜索区 */
.afc-search-hero{
  padding:36px 0 40px;
  background:
    radial-gradient(circle at 78% 8%,rgba(30,168,167,.12),rgba(30,168,167,0) 32%),
    linear-gradient(115deg,#F4FAFA 0%,#EAF6F5 100%);
  border-bottom:1px solid rgba(30,168,167,.08);
}

.afc-search-hero__inner{
  display:grid;
  grid-template-columns:240px minmax(0,680px);
  align-items:center;
  gap:64px;
}

.afc-search-hero__inner > div > span{
  display:block;
  color:var(--afc-search-primary-dark);
  font-size:12px;
  line-height:1.6;
  font-weight:700;
  letter-spacing:1.4px;
}

.afc-search-hero h1{
  margin:4px 0 0;
  color:var(--afc-search-title);
  font-size:32px;
  line-height:1.4;
  font-weight:700;
}

.afc-search-hero p{
  margin:6px 0 0;
  color:var(--afc-search-text);
  font-size:14px;
  line-height:1.6;
}

.afc-search-hero p strong{
  color:var(--afc-search-primary-dark);
  font-weight:700;
}

.afc-search-main-form{
  width:100%;
  height:50px;
  display:grid;
  grid-template-columns:minmax(0,1fr) 108px;
  overflow:hidden;
  border:1px solid #CBDDDC;
  border-radius:10px;
  background:#FFFFFF;
  box-shadow:0 8px 24px rgba(21,50,49,.06);
}

.afc-search-main-form:focus-within{
  border-color:var(--afc-search-primary);
  box-shadow:0 0 0 3px rgba(30,168,167,.10),0 8px 24px rgba(21,50,49,.06);
}

.afc-search-main-form input{
  width:100%;
  min-width:0;
  height:48px;
  padding:0 18px;
  border:0;
  outline:0;
  background:transparent;
  color:var(--afc-search-title);
  font-size:14px;
  box-sizing:border-box;
}

.afc-search-main-form input::placeholder{
  color:#90A3A2;
}

.afc-search-main-form button{
  height:50px;
  margin:-1px;
  border:0;
  background:var(--afc-search-primary);
  color:#FFFFFF;
  font-size:14px;
  font-weight:600;
  cursor:pointer;
  transition:background-color .2s ease;
}

.afc-search-main-form button:hover{
  background:var(--afc-search-primary-dark);
}

/* 主体 */
.afc-search-content{
  padding:32px 0 64px;
}

.afc-search-layout{
  display:grid;
  grid-template-columns:240px minmax(0,1fr);
  gap:32px;
  align-items:start;
}

/* 左侧筛选 */
.afc-search-sidebar{
  position:sticky;
  top:96px;
  z-index:4;
}

.afc-filter-form{
  overflow:hidden;
  border:1px solid var(--afc-search-border);
  border-radius:10px;
  background:#FFFFFF;
  box-shadow:0 8px 24px rgba(21,50,49,.04);
}

.afc-filter-title{
  min-height:56px;
  padding:0 16px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  border-bottom:1px solid #EEF3F3;
}

.afc-filter-title h2{
  margin:0;
  color:var(--afc-search-title);
  font-size:16px;
  line-height:1.5;
  font-weight:700;
}

.afc-filter-mobile-close{
  display:none;
  border:0;
  background:none;
  color:var(--afc-search-muted);
  font-size:28px;
  line-height:1;
  cursor:pointer;
}

.afc-filter-group{
  padding:18px 16px;
  border-bottom:1px solid #EEF3F3;
}

.afc-filter-group h3{
  margin:0 0 12px;
  color:var(--afc-search-title);
  font-size:14px;
  line-height:1.5;
  font-weight:600;
}

.afc-filter-options{
  display:flex;
  flex-direction:column;
  gap:10px;
}

.afc-filter-options--scroll{
  max-height:220px;
  overflow-y:auto;
  padding-right:4px;
  scrollbar-width:thin;
}

.afc-filter-options label{
  display:grid;
  grid-template-columns:16px minmax(0,1fr) auto;
  align-items:center;
  gap:8px;
  color:var(--afc-search-text);
  font-size:13px;
  line-height:1.5;
  cursor:pointer;
}

.afc-filter-options input{
  width:15px;
  height:15px;
  margin:0;
  accent-color:var(--afc-search-primary);
}

.afc-filter-options small{
  color:#91A3A2;
  font-size:11px;
}

.afc-filter-actions{
  padding:16px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}

.afc-filter-actions a,
.afc-filter-actions button{
  height:38px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:7px;
  font-size:13px;
  font-weight:600;
  text-decoration:none;
  box-sizing:border-box;
}

.afc-filter-actions a{
  border:1px solid var(--afc-search-primary);
  color:var(--afc-search-primary-dark);
  background:#FFFFFF;
}

.afc-filter-actions button{
  border:1px solid var(--afc-search-primary);
  color:#FFFFFF;
  background:var(--afc-search-primary);
  cursor:pointer;
}

/* 工具栏 */
.afc-search-toolbar{
  min-height:52px;
  margin-bottom:16px;
  padding:0 4px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:24px;
  border-bottom:1px solid var(--afc-search-border);
}

.afc-sort-form{
  display:flex;
  align-items:center;
  gap:8px;
}

.afc-sort-form label,
.afc-search-toolbar__right > span{
  color:var(--afc-search-muted);
  font-size:13px;
}

.afc-sort-form select{
  height:36px;
  padding:0 34px 0 12px;
  border:1px solid var(--afc-search-border);
  border-radius:7px;
  background:#FFFFFF;
  color:var(--afc-search-title);
  font-size:13px;
  outline:0;
}

.afc-search-toolbar__right{
  display:flex;
  align-items:center;
  gap:16px;
}

.afc-search-toolbar__right a{
  padding:14px 0 12px;
  color:var(--afc-search-muted);
  font-size:13px;
  line-height:1.4;
  text-decoration:none;
  border-bottom:2px solid transparent;
}

.afc-search-toolbar__right a.is-active{
  color:var(--afc-search-primary-dark);
  border-bottom-color:var(--afc-search-primary);
}

.afc-filter-mobile-open{
  display:none;
}

/* 产品网格 */
.afc-search-product-grid--grid{
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  gap:16px;
}

.afc-search-product-card{
  min-width:0;
  overflow:hidden;
  border:1px solid var(--afc-search-border);
  border-radius:10px;
  background:#FFFFFF;
  box-sizing:border-box;
  transition:transform .22s ease,border-color .22s ease,box-shadow .22s ease;
}

.afc-search-product-card:hover{
  transform:translateY(-3px);
  border-color:rgba(30,168,167,.40);
  box-shadow:0 14px 32px rgba(21,50,49,.08);
}

.afc-search-product-card__image{
  position:relative;
  aspect-ratio:4 / 3;
  display:block;
  overflow:hidden;
  background:#F7FAFA;
  border-bottom:1px solid #EEF3F3;
}

.afc-search-product-card__image img{
  width:100%;
  height:100%;
  padding:16px;
  display:block;
  object-fit:contain;
  box-sizing:border-box;
  transition:transform .3s ease;
}

.afc-search-product-card:hover .afc-search-product-card__image img{
  transform:scale(1.035);
}

.afc-search-product-card__placeholder{
  width:100%;
  height:100%;
  display:flex;
  align-items:center;
  justify-content:center;
  color:rgba(30,168,167,.22);
  font-size:48px;
  font-weight:800;
  letter-spacing:-3px;
  background:radial-gradient(circle at 50% 40%,rgba(30,168,167,.12),rgba(30,168,167,0) 46%),#F5FAFA;
}

.afc-search-product-card__badge{
  position:absolute;
  top:12px;
  left:12px;
  min-width:38px;
  height:24px;
  padding:0 8px;
  display:flex;
  align-items:center;
  justify-content:center;
  border-radius:6px;
  background:rgba(30,168,167,.94);
  color:#FFFFFF;
  font-size:11px;
  line-height:1;
  font-weight:700;
}

.afc-search-product-card__body{
  padding:16px;
}

.afc-search-product-card__category{
  min-height:19px;
  overflow:hidden;
  color:var(--afc-search-muted);
  font-size:11px;
  line-height:1.6;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.afc-search-product-card h2{
  min-height:44px;
  margin:6px 0 0;
  overflow:hidden;
  font-size:16px;
  line-height:1.4;
  font-weight:600;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}

.afc-search-product-card h2 a{
  color:var(--afc-search-title);
  text-decoration:none;
}

.afc-search-product-card__brand{
  margin-top:7px;
  overflow:hidden;
  color:var(--afc-search-muted);
  font-size:12px;
  line-height:1.5;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.afc-search-product-card__tags{
  margin-top:12px;
  display:flex;
  flex-wrap:wrap;
  gap:6px;
}

.afc-search-product-card__tags span{
  max-width:100%;
  padding:4px 7px;
  overflow:hidden;
  border-radius:5px;
  background:#EAF6F5;
  color:var(--afc-search-primary-dark);
  font-size:11px;
  line-height:1.3;
  white-space:nowrap;
  text-overflow:ellipsis;
}

.afc-search-product-card__body > p{
  min-height:44px;
  margin:12px 0 0;
  overflow:hidden;
  color:var(--afc-search-text);
  font-size:12px;
  line-height:1.7;
  display:-webkit-box;
  -webkit-line-clamp:2;
  -webkit-box-orient:vertical;
}

.afc-search-product-card__footer{
  min-height:28px;
  margin-top:14px;
  padding-top:12px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:12px;
  border-top:1px solid #EEF3F3;
}

.afc-search-product-card__footer > a{
  flex-shrink:0;
  color:var(--afc-search-primary-dark);
  font-size:13px;
  font-weight:600;
  text-decoration:none;
}

.afc-search-product-card__footer small{
  min-width:0;
  overflow:hidden;
  color:#91A3A2;
  font-size:10px;
  white-space:nowrap;
  text-overflow:ellipsis;
}

/* 列表模式 */
.afc-search-product-grid--list{
  display:flex;
  flex-direction:column;
  gap:16px;
}

.afc-search-product-grid--list .afc-search-product-card{
  display:grid;
  grid-template-columns:260px minmax(0,1fr);
}

.afc-search-product-grid--list .afc-search-product-card__image{
  aspect-ratio:auto;
  min-height:210px;
  border-bottom:0;
  border-right:1px solid #EEF3F3;
}

.afc-search-product-grid--list .afc-search-product-card__body{
  padding:24px;
}

.afc-search-product-grid--list .afc-search-product-card h2{
  min-height:auto;
  font-size:20px;
}

.afc-search-product-grid--list .afc-search-product-card__body > p{
  min-height:auto;
  max-width:760px;
  -webkit-line-clamp:3;
}

/* 空状态 */
.afc-search-empty{
  min-height:360px;
  padding:48px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  text-align:center;
  border:1px dashed #CBDDDC;
  border-radius:10px;
  background:#FFFFFF;
}

.afc-search-empty strong{
  color:var(--afc-search-title);
  font-size:20px;
}

.afc-search-empty p{
  margin:10px 0 0;
  color:var(--afc-search-muted);
  font-size:14px;
}

.afc-search-empty a{
  margin-top:20px;
  padding:10px 18px;
  border-radius:7px;
  background:var(--afc-search-primary);
  color:#FFFFFF;
  font-size:13px;
  text-decoration:none;
}

/* 分页 */
.afc-search-pagination{
  margin-top:28px;
}

.afc-search-pagination ul{
  margin:0;
  padding:0;
  display:flex;
  align-items:center;
  justify-content:center;
  gap:8px;
  list-style:none;
}

.afc-search-pagination a,
.afc-search-pagination span{
  min-width:36px;
  height:36px;
  padding:0 10px;
  display:flex;
  align-items:center;
  justify-content:center;
  border:1px solid var(--afc-search-border);
  border-radius:7px;
  background:#FFFFFF;
  color:var(--afc-search-text);
  font-size:13px;
  text-decoration:none;
  box-sizing:border-box;
}

.afc-search-pagination .current{
  border-color:var(--afc-search-primary);
  background:var(--afc-search-primary);
  color:#FFFFFF;
}

/* 底部需求入口 */
.afc-search-cta{
  padding:28px 0;
  background:linear-gradient(115deg,#EAF6F5 0%,#F5FBFB 100%);
  border-top:1px solid rgba(30,168,167,.10);
}

.afc-search-cta__inner{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:32px;
}

.afc-search-cta__inner span{
  color:var(--afc-search-title);
  font-size:20px;
  line-height:1.4;
  font-weight:700;
}

.afc-search-cta__inner p{
  margin:5px 0 0;
  color:var(--afc-search-text);
  font-size:13px;
  line-height:1.6;
}

/* 底部“提交产品需求”按钮 */
.afc-search-cta__inner > a,
.afc-search-cta__inner > a:visited{
  flex-shrink:0;
  min-width:156px;
  height:44px;
  padding:0 20px;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  border:1px solid #153231!important;
  border-radius:8px;
  background:#153231!important;
  color:#FFFFFF!important;
  opacity:1!important;
  font-size:13px;
  line-height:1;
  font-weight:600;
  text-decoration:none!important;
  box-sizing:border-box;
  box-shadow:0 6px 16px rgba(21,50,49,.14);
  transition:
    transform .2s ease,
    background-color .2s ease,
    border-color .2s ease,
    box-shadow .2s ease;
}

.afc-search-cta__inner > a:hover{
  transform:translateY(-1px);
  border-color:#1EA8A7!important;
  background:#1EA8A7!important;
  color:#FFFFFF!important;
  box-shadow:0 8px 20px rgba(30,168,167,.22);
}

.afc-search-cta__inner > a:focus-visible{
  outline:3px solid rgba(30,168,167,.22);
  outline-offset:3px;
  color:#FFFFFF!important;
}

.afc-filter-backdrop{
  display:none;
}

/* 适配 1320 内容区下的常见桌面 */
@media(max-width:1180px){
  .afc-search-product-grid--grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
  }
}

@media(max-width:1024px){
  .afc-search-hero__inner{
    grid-template-columns:200px minmax(0,1fr);
    gap:32px;
  }

  .afc-search-layout{
    grid-template-columns:220px minmax(0,1fr);
    gap:24px;
  }
}

/* 移动端筛选抽屉 */
@media(max-width:768px){
  .afc-search-hero{
    padding:28px 0 32px;
  }

  .afc-search-hero__inner{
    grid-template-columns:1fr;
    gap:20px;
  }

  .afc-search-hero h1{
    font-size:28px;
  }

  .afc-search-content{
    padding-top:20px;
    padding-bottom:48px;
  }

  .afc-search-layout{
    grid-template-columns:1fr;
  }

  .afc-search-sidebar{
    position:fixed;
    top:0;
    left:0;
    z-index:10050;
    width:min(86vw,340px);
    height:100vh;
    overflow-y:auto;
    background:#FFFFFF;
    transform:translateX(-105%);
    transition:transform .25s ease;
  }

  body.afc-filter-open{
    overflow:hidden;
  }

  body.afc-filter-open .afc-search-sidebar{
    transform:translateX(0);
  }

  .afc-filter-form{
    min-height:100%;
    border:0;
    border-radius:0;
  }

  .afc-filter-mobile-close{
    display:block;
  }

  .afc-filter-backdrop{
    position:fixed;
    inset:0;
    z-index:10040;
    background:rgba(15,42,42,.42);
  }

  body.afc-filter-open .afc-filter-backdrop{
    display:block;
  }

  .afc-search-toolbar{
    min-height:auto;
    padding-bottom:12px;
    flex-wrap:wrap;
    gap:12px;
  }

  .afc-filter-mobile-open{
    height:36px;
    padding:0 14px;
    display:inline-flex;
    align-items:center;
    border:1px solid var(--afc-search-primary);
    border-radius:7px;
    background:#FFFFFF;
    color:var(--afc-search-primary-dark);
    font-size:13px;
    font-weight:600;
  }

  .afc-search-toolbar__right{
    width:100%;
    justify-content:space-between;
  }

  .afc-search-product-grid--grid{
    grid-template-columns:repeat(2,minmax(0,1fr));
    gap:12px;
  }

  .afc-search-product-card__body{
    padding:14px;
  }

  .afc-search-product-card h2{
    font-size:14px;
  }

  .afc-search-product-card__body > p,
  .afc-search-product-card__category,
  .afc-search-product-card__footer small{
    display:none;
  }

  .afc-search-product-grid--list .afc-search-product-card{
    grid-template-columns:120px minmax(0,1fr);
  }

  .afc-search-product-grid--list .afc-search-product-card__image{
    min-height:150px;
  }

  .afc-search-product-grid--list .afc-search-product-card__body{
    padding:16px;
  }

  .afc-search-product-grid--list .afc-search-product-card h2{
    font-size:15px;
  }

  .afc-search-cta__inner{
    align-items:flex-start;
    flex-direction:column;
  }
}

@media(max-width:480px){
  .afc-search-main-form{
    grid-template-columns:minmax(0,1fr) 84px;
  }

  .afc-search-product-grid--grid{
    grid-template-columns:1fr;
  }

  .afc-search-product-card__image{
    aspect-ratio:4 / 3;
  }

  .afc-search-toolbar__right a{
    display:none;
  }
}