/* =====================================================================
 * [bestselling_tiles] — "Our Bestselling Tiles" feature row.
 * Self-contained, scoped under .tcbest so it never leaks into the theme.
 * ================================================================== */

.tcbest{
	--tcbest-green:#3f5330;
	--tcbest-green-dark:#33442a;
	--tcbest-ink:#20211c;
	--tcbest-muted:#7c7a72;
	--tcbest-bg:#f7f5f0;
	--tcbest-card:#ffffff;
	--tcbest-border:#e7e3d9;
	--tcbest-radius:6px;
	--tcbest-heading-font:Georgia,"Times New Roman",serif;
	box-sizing:border-box;
	background:var(--tcbest-bg);
	color:var(--tcbest-ink);
	padding:clamp(32px,5vw,72px) clamp(16px,4vw,48px);
}
.tcbest *,.tcbest *::before,.tcbest *::after{box-sizing:border-box;}
.tcbest-inner{max-width:1240px;margin:0 auto;}

/* ---- Header ---- */
.tcbest-head{
	display:flex;align-items:flex-end;justify-content:space-between;
	gap:24px;flex-wrap:wrap;margin-bottom:clamp(24px,3vw,40px);
}
.tcbest-eyebrow{
	display:flex;align-items:center;gap:14px;margin:0 0 14px;
	font-size:12px;font-weight:600;letter-spacing:.22em;text-transform:uppercase;
	color:var(--tcbest-green);
}
.tcbest-eyebrow::after{content:"";width:46px;height:1px;background:currentColor;opacity:.5;}
.tcbest-title{
	margin:0;color:var(--tcbest-ink);
	font-family:var(--tcbest-heading-font);
	font-weight:600;line-height:1.03;letter-spacing:-.01em;
	font-size:clamp(34px,5vw,60px);
}
.tcbest-sub{margin:12px 0 0;color:var(--tcbest-muted);font-size:clamp(15px,1.4vw,17px);}
.tcbest-explore{
	display:inline-flex;align-items:center;gap:12px;white-space:nowrap;
	border:1px solid var(--tcbest-green);color:var(--tcbest-green);background:transparent;
	text-decoration:none;padding:16px 26px;border-radius:2px;
	font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
	transition:background .2s ease,color .2s ease;
}
.tcbest-explore:hover{background:var(--tcbest-green);color:#fff;}
.tcbest-explore svg{width:16px;height:16px;flex:none;}

/* ---- Sales groups (fast / least selling rows) ---- */
.tcbest-group + .tcbest-group{margin-top:clamp(28px,3.4vw,48px);}
.tcbest-grouplabel{
	display:flex;align-items:center;gap:16px;margin:0 0 18px;
	font-size:12px;font-weight:600;letter-spacing:.18em;text-transform:uppercase;
	color:var(--tcbest-green);
}
.tcbest-grouplabel::after{content:"";flex:1;height:1px;background:var(--tcbest-border);}

/* ---- Grid ---- */
.tcbest-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:clamp(16px,1.6vw,24px);}
.tcbest-card{
	display:flex;flex-direction:column;overflow:hidden;
	background:var(--tcbest-card);border:1px solid var(--tcbest-border);
	border-radius:var(--tcbest-radius);
	transition:box-shadow .22s ease,transform .22s ease;
}
.tcbest-card:hover{box-shadow:0 14px 32px rgba(20,20,15,.10);transform:translateY(-3px);}
.tcbest-media{position:relative;display:block;aspect-ratio:4/3;overflow:hidden;background:#efece5;}
.tcbest-media img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .5s ease;}
.tcbest-card:hover .tcbest-media img{transform:scale(1.045);}
.tcbest-noimg{position:absolute;inset:0;background:linear-gradient(135deg,#eceae3,#dedacf);}
.tcbest-badge{
	position:absolute;top:14px;left:14px;
	background:var(--tcbest-green-dark);color:#f3f1e9;
	padding:7px 12px;border-radius:2px;
	font-size:10.5px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
}
.tcbest-body{display:flex;flex-direction:column;gap:12px;flex:1;padding:20px 20px 22px;}
.tcbest-name{
	margin:0;color:var(--tcbest-ink);
	font-family:var(--tcbest-heading-font);font-size:22px;font-weight:600;line-height:1.15;
}
.tcbest-name a{color:inherit;text-decoration:none;}
.tcbest-name a:hover{color:var(--tcbest-green);}
.tcbest-spec{margin:0;font-size:13.5px;color:var(--tcbest-muted);}
.tcbest-spec .tcbest-sep{margin:0 9px;opacity:.55;}
/* Per-m² price (from TileCat_Settings::tile_price_html) — styled here so it
   looks right even when the main catalog stylesheet isn't on the page. */
.tcbest-price{margin:-2px 0 0;}
.tcbest-price .tilecat-price{display:inline-flex;align-items:baseline;gap:4px;white-space:nowrap;}
.tcbest-price .tilecat-price-v{font-size:19px;font-weight:700;color:var(--tcbest-ink);}
.tcbest-price .tilecat-price-u{font-size:12.5px;font-weight:500;color:var(--tcbest-muted);}
.tcbest-btn{
	margin-top:auto;align-self:flex-start;
	display:inline-flex;align-items:center;gap:10px;
	background:var(--tcbest-green);color:#fff;text-decoration:none;
	padding:13px 20px;border-radius:2px;
	font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;
	transition:background .2s ease;
}
.tcbest-btn:hover{background:var(--tcbest-green-dark);color:#fff;}
.tcbest-btn svg{width:15px;height:15px;flex:none;}
.tcbest-empty{grid-column:1/-1;padding:30px;text-align:center;color:var(--tcbest-muted);}

/* ---- Responsive ---- */
@media(max-width:1024px){.tcbest-grid{grid-template-columns:repeat(2,1fr)!important;}}
@media(max-width:560px){
	.tcbest-grid{grid-template-columns:1fr!important;}
	.tcbest-head{flex-direction:column;align-items:flex-start;}
}
