.sales-dashboard-product { position: relative; min-width: 280px; outline: none; }
.sales-dashboard-product-main { display: flex; align-items: center; gap: 10px; }
.sales-dashboard-thumb,
.sales-dashboard-thumb-placeholder { display: grid; width: 48px; height: 48px; flex: 0 0 48px; place-items: center; border: 1px solid #e2e8f0; border-radius: 9px; background: #f8fafc; object-fit: cover; color: #94a3b8; font-size: 10px; }
.sales-dashboard-trend-popover { display: none; position: absolute; left: 42px; top: 52px; z-index: 30; width: 300px; padding: 13px; border: 1px solid #bfdbfe; border-radius: 12px; background: #fff; box-shadow: 0 18px 48px rgba(15, 23, 42, .2); }
.sales-dashboard-trend-popover.sales-dashboard-floating-trend { display: block; position: fixed; z-index: 1600; pointer-events: none; }
.sales-dashboard-trend-popover > strong,
.sales-dashboard-trend-popover > small { display: block; }
.sales-dashboard-trend-popover > small { margin: 3px 0 8px; color: #64748b; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.sales-dashboard-trend-chart { display: block; width: 100%; height: 92px; border-radius: 8px; background: linear-gradient(180deg, #eff6ff, #fff); }
.sales-dashboard-trend-chart rect { fill: #bfdbfe; }
.sales-dashboard-trend-chart polyline { fill: none; stroke: #2563eb; stroke-width: 2; }
.sales-dashboard-trend-axis,
.sales-dashboard-trend-summary { display: flex; justify-content: space-between; gap: 8px; color: #64748b; font-size: 10px; }
.sales-dashboard-trend-summary { margin-top: 9px; padding-top: 8px; border-top: 1px solid #e2e8f0; }
.sales-dashboard-trend-empty { display: grid; height: 80px; place-items: center; border-radius: 8px; background: #f8fafc; color: #94a3b8; font-size: 12px; }