/**
 * Aluminum Price Widget — 价格条样式
 * 设计目标：扁平、紧凑、融入 header，不抢眼但实用
 */

.linsy-al-price {
	display: flex;
	align-items: center;
	justify-content: center;
	flex-wrap: wrap;
	gap: 16px;
	width: 100%;
	box-sizing: border-box;
	padding: 8px 16px;
	font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
	font-size: 13px;
	line-height: 1.4;
	color: #333;
	background: #f8f9fa;
	border-bottom: 1px solid #eee;
}

/* --- 左侧标题区 --- */
.linsy-al-price__title {
	display: flex;
	align-items: baseline;
	gap: 6px;
	flex-shrink: 0;
}

.linsy-al-price__title a {
	color: #1a6fb5;
	font-weight: 600;
	text-decoration: none;
	font-size: 13px;
}

.linsy-al-price__title a:hover {
	text-decoration: underline;
}

.linsy-al-price__date {
	color: #888;
	font-size: 12px;
}

/* --- 中间三个价格点 --- */
.linsy-al-price__items {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.linsy-al-price__item {
	display: flex;
	align-items: center;
	gap: 6px;
}

.linsy-al-price__label {
	color: #555;
	font-weight: 500;
	font-size: 12px;
	text-transform: uppercase;
	letter-spacing: 0.3px;
}

.linsy-al-price__label--lme { color: #1a6fb5; }
.linsy-al-price__label--sm  { color: #2e7d32; }
.linsy-al-price__label--cj  { color: #e65100; }

.linsy-al-price__value {
	font-weight: 700;
	font-size: 13px;
	min-width: 64px;
	display: inline-block;
}

/* 涨跌颜色 */
.linsy-al-price__value.is-up   { color: #d32f2f; }   /* 涨 = 红 */
.linsy-al-price__value.is-down { color: #2e7d32; }   /* 跌 = 绿 */
.linsy-al-price__value.is-flat { color: #666; }     /* 平 = 灰 */

/* 涨跌箭头 */
.linsy-al-price__arrow {
	width: 14px;
	height: 14px;
	display: inline-block;
	vertical-align: middle;
}

.linsy-al-price__arrow--up   { color: #d32f2f; }
.linsy-al-price__arrow--down { color: #2e7d32; }

/* 涨跌为平或数据缺失时箭头为空，不占位 */
.linsy-al-price__arrow:empty { display: none; }

/* --- 加载/错误状态 --- */
.linsy-al-price.is-loading .linsy-al-price__value {
	color: #bbb;
}

.linsy-al-price.is-error .linsy-al-price__items {
	opacity: 0.5;
}

/* --- 移动端适配 --- */
@media (max-width: 767px) {
	.linsy-al-price {
		gap: 10px;
		padding: 10px 12px;
		font-size: 12px;
	}

	.linsy-al-price__items {
		gap: 12px;
	}

	.linsy-al-price__value {
		font-size: 12px;
		min-width: 56px;
	}

	/* 移动端隐藏涨跌箭头，省空间 */
	.linsy-al-price__arrow {
		display: none;
	}
}

@media (max-width: 480px) {
	.linsy-al-price {
		justify-content: center;
	}

	.linsy-al-price__title {
		width: 100%;
		justify-content: center;
		margin-bottom: 2px;
	}
}
