/* TradesFolks 18.4.158
   Premium, resolution-safe Search Marketplace.
   Scoped strictly to .tf-search-marketplace.
*/

.tf-search-marketplace{
  --sr-navy:#0a2b5a;
  --sr-navy-2:#103d78;
  --sr-blue:#0b68d8;
  --sr-gold:#ffbc2d;
  --sr-bg:#f4f7fb;
  --sr-line:#dbe5ef;
  --sr-text:#102746;
  --sr-muted:#687d95;
}

/* ===========================
   PREMIUM SEARCH INTELLIGENCE HERO
   =========================== */
.tf-search-marketplace .tf-search-hero{
  position:relative!important;
  overflow:hidden!important;
  padding:28px 0!important;
  background:
    radial-gradient(circle at 92% 12%,rgba(49,116,203,.26),transparent 28%),
    radial-gradient(circle at 62% 120%,rgba(255,188,45,.10),transparent 30%),
    linear-gradient(135deg,#092957 0%,#103d78 100%)!important;
}
.tf-search-marketplace .tf-search-hero::before{
  content:""!important;
  position:absolute!important;
  width:360px!important;
  height:360px!important;
  right:-150px!important;
  top:-230px!important;
  border:1px solid rgba(255,255,255,.12)!important;
  border-radius:50%!important;
  box-shadow:0 0 0 48px rgba(255,255,255,.025),0 0 0 96px rgba(255,188,45,.018)!important;
  pointer-events:none!important;
}
.tf-search-marketplace .tf-search-hero .shell,
.tf-search-marketplace .tf-search-results-section>.shell{
  width:calc(100% - 56px)!important;
  max-width:none!important;
  margin-inline:auto!important;
}
.tf-search-marketplace .tf-search-hero-grid{
  position:relative!important;
  z-index:1!important;
  display:grid!important;
  grid-template-columns:minmax(0,1.12fr) minmax(430px,.88fr)!important;
  gap:34px!important;
  align-items:end!important;
}
.tf-search-marketplace .tf-search-intro{
  min-width:0!important;
}
.tf-search-marketplace .tf-search-hero .eyebrow{
  display:inline-flex!important;
  align-items:center!important;
  gap:8px!important;
  color:#ffd15b!important;
  font-size:8px!important;
  line-height:1!important;
  font-weight:900!important;
  letter-spacing:.13em!important;
}
.tf-search-marketplace .tf-search-hero .eyebrow::before{
  content:""!important;
  width:26px!important;
  height:3px!important;
  border-radius:999px!important;
  background:#ffbc2d!important;
}
.tf-search-marketplace .tf-search-hero h1{
  max-width:15ch!important;
  margin:11px 0 8px!important;
  color:#fff!important;
  font-size:clamp(38px,3.65vw,58px)!important;
  line-height:.99!important;
  letter-spacing:-.05em!important;
  font-weight:850!important;
}
.tf-search-marketplace .tf-search-hero p{
  max-width:760px!important;
  margin:0!important;
  color:#dce8f6!important;
  font-size:12px!important;
  line-height:1.5!important;
}

.tf-search-marketplace .tf-search-expansion,
.tf-search-marketplace .tf-search-discovery-row>div{
  display:flex!important;
  min-width:0!important;
  gap:6px!important;
  align-items:center!important;
}
.tf-search-marketplace .tf-search-expansion{
  flex-wrap:wrap!important;
  margin-top:13px!important;
}
.tf-search-marketplace .tf-search-expansion>span,
.tf-search-marketplace .tf-search-discovery-row b{
  flex:0 0 auto!important;
  color:#fff!important;
  font-size:8px!important;
  font-weight:850!important;
  text-transform:none!important;
  letter-spacing:0!important;
}
.tf-search-marketplace .tf-search-expansion>a,
.tf-search-marketplace .tf-search-discovery-row a{
  display:inline-flex!important;
  flex:0 0 auto!important;
  min-height:28px!important;
  align-items:center!important;
  padding:0 10px!important;
  border:1px solid rgba(255,194,55,.58)!important;
  border-radius:999px!important;
  background:#fff9e8!important;
  color:#6b4800!important;
  font-size:7.5px!important;
  line-height:1!important;
  font-weight:850!important;
  text-decoration:none!important;
}
.tf-search-marketplace .tf-search-discovery-row{
  display:flex!important;
  flex-wrap:wrap!important;
  gap:8px 14px!important;
  margin-top:13px!important;
}

.tf-search-marketplace .tf-search-proof{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  gap:8px!important;
}
.tf-search-marketplace .tf-search-proof article{
  display:flex!important;
  min-width:0!important;
  min-height:82px!important;
  align-items:flex-start!important;
  gap:10px!important;
  padding:13px!important;
  border:1px solid rgba(255,255,255,.15)!important;
  border-radius:15px!important;
  background:linear-gradient(145deg,rgba(255,255,255,.07),rgba(255,255,255,.035))!important;
  box-shadow:inset 0 1px rgba(255,255,255,.06)!important;
  backdrop-filter:blur(4px)!important;
}
.tf-search-marketplace .tf-search-proof i{
  display:grid!important;
  width:28px!important;
  height:28px!important;
  flex:0 0 28px!important;
  place-items:center!important;
  border-radius:9px!important;
  background:rgba(255,188,45,.13)!important;
  color:#ffd15b!important;
  font-size:7px!important;
  font-style:normal!important;
  font-weight:900!important;
}
.tf-search-marketplace .tf-search-proof article>div{
  min-width:0!important;
}
.tf-search-marketplace .tf-search-proof b{
  display:block!important;
  color:#fff!important;
  font-size:14px!important;
  line-height:1.12!important;
  font-weight:850!important;
}
.tf-search-marketplace .tf-search-proof span{
  display:block!important;
  margin-top:6px!important;
  color:#bdcde0!important;
  font-size:6.6px!important;
  line-height:1.35!important;
}

/* ===========================
   RESULTS SURFACE
   =========================== */
.tf-search-marketplace .tf-search-results-section{
  padding:20px 0 42px!important;
  background:
    linear-gradient(180deg,#f5f8fc 0%,#f1f5fa 100%)!important;
}
.tf-search-marketplace .tf-search-results-head{
  display:flex!important;
  align-items:flex-end!important;
  justify-content:space-between!important;
  gap:18px!important;
  margin-bottom:12px!important;
}
.tf-search-marketplace .tf-search-results-head>div>span{
  display:block!important;
  color:#0868d6!important;
  font-size:7px!important;
  font-weight:900!important;
  letter-spacing:.12em!important;
}
.tf-search-marketplace .tf-search-results-head h2{
  margin:5px 0 0!important;
  color:#102746!important;
  font-size:23px!important;
  line-height:1.06!important;
  letter-spacing:-.025em!important;
}
.tf-search-marketplace .tf-search-results-head>small{
  display:flex!important;
  align-items:center!important;
  gap:5px!important;
  min-height:32px!important;
  padding:0 10px!important;
  border:1px solid #d8e3ee!important;
  border-radius:999px!important;
  background:#fff!important;
  box-shadow:0 4px 12px rgba(16,43,87,.035)!important;
  color:#667c94!important;
  font-size:6.7px!important;
  font-style:normal!important;
  white-space:nowrap!important;
}
.tf-search-marketplace .tf-search-results-head>small b{
  color:#284765!important;
  font-size:7px!important;
}
.tf-search-marketplace .tf-search-results-head>small em{
  color:#526a84!important;
  font-style:normal!important;
  font-weight:750!important;
}
.tf-search-marketplace .tf-search-results-head>small i{
  color:#7d90a5!important;
  font-style:normal!important;
}
.tf-search-marketplace .tf-search-trending-inline{
  display:flex!important;
  gap:6px!important;
  align-items:center!important;
  overflow-x:auto!important;
  margin:-1px 0 10px!important;
  padding-bottom:2px!important;
  scrollbar-width:none!important;
}
.tf-search-marketplace .tf-search-trending-inline::-webkit-scrollbar{display:none!important}
.tf-search-marketplace .tf-search-trending-inline>*{flex:0 0 auto!important}
.tf-search-marketplace .tf-search-trending-inline b{
  color:#49617c!important;
  font-size:7px!important;
}
.tf-search-marketplace .tf-search-trending-inline a{
  min-height:26px!important;
  display:inline-flex!important;
  align-items:center!important;
  padding:0 9px!important;
  border:1px solid #dce5ef!important;
  border-radius:999px!important;
  background:#fff!important;
  color:#31506f!important;
  font-size:6.5px!important;
  font-weight:750!important;
}

/* ===========================
   FILTER + CATALOG
   =========================== */
.tf-search-marketplace .tf-search-catalog{
  display:grid!important;
  grid-template-columns:245px minmax(0,1fr)!important;
  gap:16px!important;
  align-items:start!important;
}
.tf-search-marketplace .tf-search-catalog>.filter-sidebar{
  position:sticky!important;
  top:82px!important;
  min-width:0!important;
  border:1px solid #dbe5ef!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 10px 26px rgba(16,43,87,.045)!important;
  overflow:hidden!important;
}
.tf-search-marketplace .catalog-filter{
  padding:14px!important;
}
.tf-search-marketplace .filter-head{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:8px!important;
  margin-bottom:13px!important;
}
.tf-search-marketplace .filter-head>div{
  display:flex!important;
  align-items:center!important;
  gap:6px!important;
}
.tf-search-marketplace .filter-head strong{
  color:#102746!important;
  font-size:14px!important;
}
.tf-search-marketplace .filter-head span{
  padding:4px 7px!important;
  border-radius:999px!important;
  background:#eaf3ff!important;
  color:#0969d6!important;
  font-size:6px!important;
  font-weight:850!important;
}
.tf-search-marketplace .filter-head>[data-filter-close]{
  display:none!important;
}
.tf-search-marketplace .tf-filter-field,
.tf-search-marketplace .tf-facet-group{
  display:block!important;
  margin:0 0 12px!important;
  padding:0!important;
  border:0!important;
}
.tf-search-marketplace .tf-filter-field>span,
.tf-search-marketplace .tf-facet-group legend{
  display:block!important;
  margin-bottom:6px!important;
  color:#334e6c!important;
  font-size:8px!important;
  font-weight:850!important;
}
.tf-search-marketplace .catalog-filter input[type="search"],
.tf-search-marketplace .catalog-filter input[type="number"],
.tf-search-marketplace .catalog-filter select{
  width:100%!important;
  min-height:40px!important;
  border:1px solid #d8e2ed!important;
  border-radius:10px!important;
  background:#fbfdff!important;
  padding:0 10px!important;
  color:#173251!important;
  font-size:8px!important;
}
.tf-search-marketplace .range-row{
  display:grid!important;
  grid-template-columns:1fr 1fr!important;
  gap:6px!important;
}
.tf-search-marketplace .check-row{
  display:flex!important;
  min-height:30px!important;
  align-items:center!important;
  gap:7px!important;
  color:#425d79!important;
  font-size:8px!important;
}
.tf-search-marketplace .check-row input{
  width:15px!important;
  height:15px!important;
}
.tf-search-marketplace .tf-filter-actions{
  display:grid!important;
  gap:6px!important;
  margin-top:13px!important;
}
.tf-search-marketplace .filter-apply{
  min-height:40px!important;
  border:0!important;
  border-radius:10px!important;
  background:linear-gradient(135deg,#0a4fa9,#0d6ddd)!important;
  color:#fff!important;
  font-size:8px!important;
  font-weight:850!important;
}
.tf-search-marketplace .filter-clear{
  text-align:center!important;
  color:#687e96!important;
  font-size:7px!important;
  font-weight:750!important;
}

.tf-search-marketplace .catalog-toolbar{
  display:flex!important;
  align-items:center!important;
  justify-content:space-between!important;
  gap:12px!important;
  min-height:48px!important;
  margin:0 0 10px!important;
  padding:0!important;
  border:0!important;
  background:transparent!important;
}
.tf-search-marketplace .catalog-toolbar>div{
  display:flex!important;
  align-items:center!important;
  gap:8px!important;
}
.tf-search-marketplace .catalog-toolbar strong{
  color:#172f4d!important;
  font-size:10px!important;
}
.tf-search-marketplace .mobile-filter-button{
  display:none!important;
}
.tf-search-marketplace .catalog-toolbar select{
  min-width:165px!important;
  min-height:40px!important;
  border:1px solid #d8e2ed!important;
  border-radius:10px!important;
  background:#fff!important;
  padding:0 32px 0 10px!important;
  color:#1b324e!important;
  font-size:8px!important;
}

/* Search result cards: denser/premium without changing component logic. */
.tf-search-marketplace .product-grid{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  gap:12px!important;
}
.tf-search-marketplace .product-card{
  border:1px solid #dbe5ef!important;
  border-radius:16px!important;
  background:#fff!important;
  box-shadow:0 7px 18px rgba(16,43,87,.035)!important;
  overflow:hidden!important;
}
.tf-search-marketplace .product-card:hover{
  transform:translateY(-2px)!important;
  box-shadow:0 14px 28px rgba(16,43,87,.075)!important;
}
.tf-search-marketplace .product-image{
  height:205px!important;
  padding:11px!important;
}
.tf-search-marketplace .product-image img{
  object-fit:contain!important;
}
.tf-search-marketplace .product-body{
  padding:13px!important;
}
.tf-search-marketplace .product-body h3{
  height:auto!important;
  min-height:38px!important;
  margin-bottom:8px!important;
  font-size:11px!important;
  line-height:1.32!important;
}
.tf-search-marketplace .price{
  font-size:15px!important;
}
.tf-search-marketplace .supplier-line{
  font-size:8px!important;
}
.tf-search-marketplace .card-actions{
  gap:6px!important;
  margin-top:10px!important;
}
.tf-search-marketplace .card-actions a,
.tf-search-marketplace .card-actions button{
  min-height:35px!important;
  border-radius:8px!important;
  font-size:7.5px!important;
}

/* ===========================
   TABLET
   =========================== */
@media(max-width:1180px){
  .tf-search-marketplace .tf-search-hero .shell,
  .tf-search-marketplace .tf-search-results-section>.shell{
    width:calc(100% - 36px)!important;
  }
  .tf-search-marketplace .tf-search-hero-grid{
    grid-template-columns:minmax(0,1fr) minmax(340px,.82fr)!important;
    gap:22px!important;
  }
  .tf-search-marketplace .tf-search-catalog{
    grid-template-columns:220px minmax(0,1fr)!important;
    gap:12px!important;
  }
  .tf-search-marketplace .product-grid{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
  }
}

/* ===========================
   MOBILE / SMALL TABLET
   =========================== */
@media(max-width:900px){
  .tf-search-marketplace .tf-search-hero{
    padding:18px 0!important;
  }
  .tf-search-marketplace .tf-search-hero .shell,
  .tf-search-marketplace .tf-search-results-section>.shell{
    width:calc(100% - 16px)!important;
  }
  .tf-search-marketplace .tf-search-hero-grid{
    grid-template-columns:1fr!important;
    gap:14px!important;
  }
  .tf-search-marketplace .tf-search-hero h1{
    max-width:14ch!important;
    margin:8px 0 6px!important;
    font-size:30px!important;
    line-height:1.01!important;
  }
  .tf-search-marketplace .tf-search-hero p{
    display:-webkit-box!important;
    max-width:100%!important;
    overflow:hidden!important;
    font-size:9px!important;
    line-height:1.4!important;
    -webkit-line-clamp:2!important;
    -webkit-box-orient:vertical!important;
  }

  .tf-search-marketplace .tf-search-expansion,
  .tf-search-marketplace .tf-search-discovery-row,
  .tf-search-marketplace .tf-search-discovery-row>div{
    flex-wrap:nowrap!important;
    overflow-x:auto!important;
    overflow-y:hidden!important;
    width:100%!important;
    padding-bottom:2px!important;
    scrollbar-width:none!important;
    overscroll-behavior-inline:contain!important;
    -webkit-overflow-scrolling:touch!important;
  }
  .tf-search-marketplace .tf-search-expansion::-webkit-scrollbar,
  .tf-search-marketplace .tf-search-discovery-row::-webkit-scrollbar,
  .tf-search-marketplace .tf-search-discovery-row>div::-webkit-scrollbar{display:none!important}
  .tf-search-marketplace .tf-search-expansion>a,
  .tf-search-marketplace .tf-search-discovery-row a{
    min-height:27px!important;
    padding:0 9px!important;
    font-size:7px!important;
  }

  .tf-search-marketplace .tf-search-proof{
    grid-template-columns:repeat(3,minmax(0,1fr))!important;
    gap:6px!important;
  }
  .tf-search-marketplace .tf-search-proof article{
    min-height:64px!important;
    gap:6px!important;
    padding:9px!important;
    border-radius:11px!important;
  }
  .tf-search-marketplace .tf-search-proof i{
    display:none!important;
  }
  .tf-search-marketplace .tf-search-proof b{
    font-size:10px!important;
  }
  .tf-search-marketplace .tf-search-proof span{
    margin-top:4px!important;
    font-size:5.5px!important;
  }

  .tf-search-marketplace .tf-search-results-section{
    padding:13px 0 92px!important;
  }
  .tf-search-marketplace .tf-search-results-head{
    display:block!important;
    margin-bottom:9px!important;
  }
  .tf-search-marketplace .tf-search-results-head h2{
    font-size:18px!important;
    line-height:1.05!important;
  }
  .tf-search-marketplace .tf-search-results-head>small{
    display:inline-flex!important;
    max-width:100%!important;
    margin-top:8px!important;
    min-height:29px!important;
    overflow:hidden!important;
    padding:0 8px!important;
    font-size:6px!important;
  }
  .tf-search-marketplace .tf-search-results-head>small i{
    display:none!important;
  }

  .tf-search-marketplace .tf-search-catalog{
    display:block!important;
    width:100%!important;
  }
  .tf-search-marketplace .tf-search-catalog>main{
    width:100%!important;
    min-width:0!important;
  }

  /* Premium off-canvas filter drawer */
  .tf-search-marketplace .tf-search-catalog>.filter-sidebar{
    position:fixed!important;
    z-index:1002!important;
    top:0!important;
    bottom:0!important;
    left:0!important;
    width:min(340px,88vw)!important;
    height:100dvh!important;
    overflow-y:auto!important;
    border:0!important;
    border-radius:0 18px 18px 0!important;
    transform:translateX(-105%)!important;
    transition:transform .23s ease!important;
    box-shadow:18px 0 44px rgba(6,28,58,.22)!important;
  }
  .tf-search-marketplace .tf-search-catalog>.filter-sidebar.open{
    transform:translateX(0)!important;
  }
  .tf-search-marketplace .filter-head>[data-filter-close]{
    display:grid!important;
    width:32px!important;
    height:32px!important;
    place-items:center!important;
    border:1px solid #dce5ef!important;
    border-radius:9px!important;
    background:#fff!important;
    color:#294764!important;
  }
  .tf-search-marketplace .filter-backdrop{
    position:fixed!important;
    z-index:1001!important;
    inset:0!important;
    background:rgba(5,24,49,.42)!important;
    backdrop-filter:blur(2px)!important;
    opacity:0!important;
    visibility:hidden!important;
    transition:.2s!important;
  }
  .tf-search-marketplace:has(.filter-sidebar.open) .filter-backdrop{
    opacity:1!important;
    visibility:visible!important;
  }

  .tf-search-marketplace .catalog-toolbar{
    position:sticky!important;
    top:0!important;
    z-index:24!important;
    display:grid!important;
    grid-template-columns:minmax(0,1fr) auto!important;
    gap:7px!important;
    min-height:48px!important;
    margin:0 0 8px!important;
    padding:5px 0!important;
    background:rgba(245,248,252,.94)!important;
    backdrop-filter:blur(10px)!important;
  }
  .tf-search-marketplace .mobile-filter-button{
    display:inline-flex!important;
    min-height:38px!important;
    align-items:center!important;
    justify-content:center!important;
    padding:0 10px!important;
    border:1px solid #d8e2ed!important;
    border-radius:10px!important;
    background:#fff!important;
    color:#173251!important;
    font-size:8px!important;
    font-weight:850!important;
  }
  .tf-search-marketplace .catalog-toolbar strong{
    font-size:8px!important;
    white-space:nowrap!important;
  }
  .tf-search-marketplace .catalog-toolbar select{
    min-width:132px!important;
    min-height:38px!important;
    font-size:7.5px!important;
  }

  .tf-search-marketplace .product-grid{
    grid-template-columns:repeat(2,minmax(0,1fr))!important;
    gap:8px!important;
  }
  .tf-search-marketplace .product-card{
    border-radius:13px!important;
  }
  .tf-search-marketplace .product-image{
    height:150px!important;
    padding:8px!important;
  }
  .tf-search-marketplace .product-body{
    padding:9px!important;
  }
  .tf-search-marketplace .product-body h3{
    display:-webkit-box!important;
    min-height:31px!important;
    overflow:hidden!important;
    margin-bottom:6px!important;
    font-size:8.5px!important;
    line-height:1.25!important;
    -webkit-box-orient:vertical!important;
    -webkit-line-clamp:2!important;
  }
  .tf-search-marketplace .price{
    font-size:12px!important;
  }
  .tf-search-marketplace .product-body>p,
  .tf-search-marketplace .supplier-line{
    font-size:6.5px!important;
  }
  .tf-search-marketplace .card-actions a,
  .tf-search-marketplace .card-actions button{
    min-height:32px!important;
    font-size:6.5px!important;
  }
}

/* ===========================
   PHONE
   =========================== */
@media(max-width:560px){
  .tf-search-marketplace .tf-search-hero{
    padding:15px 0 14px!important;
  }
  .tf-search-marketplace .tf-search-hero .shell,
  .tf-search-marketplace .tf-search-results-section>.shell{
    width:calc(100% - 12px)!important;
  }
  .tf-search-marketplace .tf-search-hero .eyebrow{
    font-size:6.2px!important;
  }
  .tf-search-marketplace .tf-search-hero h1{
    max-width:13ch!important;
    font-size:27px!important;
  }
  .tf-search-marketplace .tf-search-proof article{
    min-height:58px!important;
    padding:8px!important;
  }
  .tf-search-marketplace .tf-search-proof b{
    font-size:9.5px!important;
  }
  .tf-search-marketplace .tf-search-results-head h2{
    font-size:17px!important;
  }
  .tf-search-marketplace .product-image{
    height:132px!important;
  }
}

@media(max-width:390px){
  .tf-search-marketplace .tf-search-hero h1{
    font-size:24px!important;
  }
  .tf-search-marketplace .tf-search-proof{
    grid-template-columns:1fr 1fr!important;
  }
  .tf-search-marketplace .tf-search-proof article:nth-child(3){
    grid-column:1/-1!important;
    min-height:52px!important;
  }
  .tf-search-marketplace .catalog-toolbar{
    grid-template-columns:1fr auto!important;
  }
  .tf-search-marketplace .catalog-toolbar select{
    min-width:118px!important;
  }
  .tf-search-marketplace .product-image{
    height:118px!important;
  }
}
