/* DC360 Search — structural styling only.
 * Colors/typography defer to the site-wide design-system tokens where present
 * (var(--dc-*) with safe fallbacks). Buy-yellow #FFD814 is buy-only.
 * Fully responsive: dropdown and results reflow to one column on mobile. */

.dc360s-panel{
	position:absolute; top:calc(100% + 6px); left:0; right:0; z-index:9999;
	max-height:70vh; overflow-y:auto;
	background:#fff; border:1px solid var(--dc-border,#e2e6ea);
	border-radius:var(--dc-radius,10px); box-shadow:0 12px 32px rgba(0,0,0,.14);
}
.dc360s-group{ border-bottom:1px solid var(--dc-border,#eef1f4); }
.dc360s-group:last-child{ border-bottom:0; }
.dc360s-group__h{
	font:600 11px/1 var(--dc-font-head,inherit); letter-spacing:.06em; text-transform:uppercase;
	color:var(--dc-muted,#6b7785); padding:10px 14px 6px;
}
.dc360s-row{
	display:flex; align-items:center; gap:12px; padding:8px 14px; text-decoration:none;
	color:var(--dc-text,#1f2933);
}
.dc360s-row:hover{ background:var(--dc-surface,#f5f8fb); }
.dc360s-row--pinned{ background:var(--dc-surface,#eef6ff); }
.dc360s-row__img{ width:44px; height:44px; object-fit:contain; flex:0 0 44px; border-radius:6px; background:#fff; }
.dc360s-row__img--ph{ background:var(--dc-surface,#eef1f4); }
.dc360s-row__main{ flex:1 1 auto; min-width:0; }
.dc360s-row__name{ display:block; font-size:14px; font-weight:600; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.dc360s-row__meta{ display:flex; align-items:center; gap:8px; margin-top:3px; }
.dc360s-row__sku{ font-size:12px; color:var(--dc-muted,#6b7785); font-family:var(--dc-font-mono,ui-monospace,monospace); }
.dc360s-row__right{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.dc360s-row__price{ font-size:14px; font-weight:700; }
.dc360s-row__cta.dc-btn--buy{ background:#FFD814; color:#111; border:0; padding:6px 12px; border-radius:6px; font-size:13px; font-weight:700; }

.dc-badge{ font-size:11px; padding:2px 7px; border-radius:999px; font-weight:600; }
.dc-badge--ok{ background:#e3f6ea; color:#1a7f37; }
.dc-badge--muted{ background:#eef1f4; color:#6b7785; }

.dc360s-all{ display:block; text-align:center; padding:11px; font-weight:700; font-size:13px;
	color:var(--dc-primary,#1763a6); text-decoration:none; border-top:1px solid var(--dc-border,#eef1f4); }
.dc360s-all:hover{ background:var(--dc-surface,#f5f8fb); }
.dc360s-empty,.dc360s-loading{ padding:18px 14px; color:var(--dc-muted,#6b7785); font-size:14px; text-align:center; }

/* ---- full results page ---- */
.dc360s-results{ max-width:1180px; margin:0 auto; padding:24px 16px;
	display:grid; grid-template-columns:240px 1fr; gap:28px; }
.dc360s-results__count{ font-size:13px; color:var(--dc-muted,#6b7785); margin-bottom:10px; }
.dc360s-results__facets{ position:sticky; top:90px; align-self:start; }
.dc360s-facet{ margin-bottom:18px; }
.dc360s-facet__h{ font-weight:700; font-size:13px; margin-bottom:7px; text-transform:uppercase; letter-spacing:.04em; }
.dc360s-facet__opt{ display:flex; align-items:center; gap:6px; font-size:13px; padding:3px 0; cursor:pointer; }
.dc360s-facet__opt span{ color:var(--dc-muted,#9aa5b1); margin-left:auto; }
.dc360s-results__list .dc360s-row{ border:1px solid var(--dc-border,#eef1f4); border-radius:8px; margin-bottom:8px; padding:12px 14px; }

@media (max-width:860px){
	.dc360s-results{ grid-template-columns:1fr; }
	.dc360s-results__facets{ position:static; }
}
@media (max-width:480px){
	.dc360s-row__right{ flex-direction:column; align-items:flex-end; gap:4px; }
	.dc360s-row__cta.dc-btn--buy{ padding:8px 12px; } /* keep >=44px tap height with line-box */
}
