/* 부위 분석 / 브랜드 분석 화면 공통 */
:root {
	--c-max: #eb6834;   /* 최고가 */
	--c-avg: #2a78d6;   /* 평균가 */
	--c-min: #1baf7a;   /* 최저가 */
	--c-up: #d6336c;
	--c-down: #2a78d6;
}
body { background:#f4f6f9; font-size:14px; }
a { text-decoration:none; }
.page-wrap { max-width:1280px; margin:0 auto; padding:16px; }
.top-bar { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:12px; margin-bottom:12px; }
.top-bar h1 { font-size:20px; font-weight:700; margin:0; }
.date-nav { display:flex; align-items:center; gap:6px; }
.date-nav input { width:150px; }
.panel { background:#fff; border:1px solid #e3e6ea; border-radius:8px; }
.filter-box { padding:10px 12px; margin-bottom:12px; }
.filter-box .info { color:#6c757d; font-size:12px; margin-top:6px; }
.table-box { overflow:auto; }

.an-table { margin:0; white-space:nowrap; }
.an-table thead th { position:sticky; top:0; z-index:2; background:#343a40; color:#fff; font-weight:500; font-size:13px; border:0; }
.an-table td { vertical-align:middle; }
.an-table .num { text-align:right; font-variant-numeric:tabular-nums; }
.an-table tr.group-row th { background:#eef1f5; font-size:15px; padding:8px 10px; }
.an-table tr.group-row th small { color:#6c757d; font-weight:400; font-size:12px; margin-left:6px; }
.an-table .price-avg { font-weight:700; }
.an-table a.price { color:inherit; border-bottom:1px dotted #adb5bd; }
.an-table a.price:hover { color:#0d6efd; }
.an-table .sub { display:block; color:#868e96; font-size:12px; }

.dot { display:inline-block; width:8px; height:8px; border-radius:50%; margin-right:4px; vertical-align:middle; }
.dot.max { background:var(--c-max); } .dot.avg { background:var(--c-avg); } .dot.min { background:var(--c-min); }
.chg { font-variant-numeric:tabular-nums; font-size:13px; }
.chg.up { color:var(--c-up); } .chg.down { color:var(--c-down); } .chg.same { color:#868e96; }
.chg .sub { display:block; color:#adb5bd; font-size:11px; }
.badge.g-1pp { background:#dc3545; } .badge.g-1p { background:#fd7e14; } .badge.g-1 { background:#198754; } .badge.g-etc { background:#6c757d; }
.sex-거세 { color:#0d6efd; } .sex-암 { color:#d63384; } .sex-한돈 { color:#b45309; }

.spark { display:block; cursor:crosshair; }
.spark-band { fill:var(--c-avg); fill-opacity:.2; stroke:none; }
.spark-line { fill:none; stroke:var(--c-avg); stroke-width:2; stroke-linejoin:round; stroke-linecap:round; }
.spark-end { fill:var(--c-avg); }
.spark-cursor { stroke:#adb5bd; stroke-width:1; }
.spark-hover { fill:#fff; stroke:var(--c-avg); stroke-width:2; }
#spark-tip { position:fixed; z-index:20; display:none; pointer-events:none; background:#212529; color:#fff; border-radius:6px; padding:6px 10px; font-size:12px; line-height:1.6; font-variant-numeric:tabular-nums; }
#spark-tip b { font-weight:600; }

.legend-inline { font-size:12px; color:#6c757d; }
.legend-inline span { margin-right:10px; white-space:nowrap; }
.legend-inline .band { display:inline-block; width:14px; height:8px; background:var(--c-avg); opacity:.5; vertical-align:middle; margin-right:4px; }
.empty { padding:60px 20px; text-align:center; color:#6c757d; }

.modal .sub, .goods-table .sub { display:block; color:#868e96; font-size:12px; }
.goods-table .thumb { width:44px; height:44px; object-fit:cover; border-radius:4px; }
.goods-table .num { font-variant-numeric:tabular-nums; }
#trend-chart-wrap { position:relative; height:340px; }
#trend-table { font-variant-numeric:tabular-nums; }
