/* =========================================================
   イベント一覧・詳細の両方で使う共通パーツ
   (ステータスバッジ / 開催日時・会場などのメタ情報表示)
   ========================================================= */

.event-card__media-placeholder {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--c-text-muted);
	font-size: 13px;
	letter-spacing: 0.1em;
	background: repeating-linear-gradient(
		45deg,
		var(--c-surface-alt),
		var(--c-surface-alt) 10px,
		var(--c-surface) 10px,
		var(--c-surface) 20px
	);
}
.event-card__media-placeholder--large {
	font-size: 16px;
}

.event-card__status {
	position: absolute;
	top: 12px;
	left: 12px;
	z-index: 2;
	font-size: 12px;
	font-weight: 700;
	padding: 5px 14px;
	border-radius: 999px;
	box-shadow: 0 2px 6px rgba(0, 0, 0, 0.12);
}
.event-card__status--ongoing {
	background: var(--c-status-ongoing-bg);
	color: var(--c-status-ongoing-fg);
}
.event-card__status--upcoming {
	background: var(--c-status-upcoming-bg);
	color: var(--c-status-upcoming-fg);
}
.event-card__status--ended {
	background: var(--c-status-ended-bg);
	color: var(--c-status-ended-fg);
}

.event-card__meta {
	margin: 0 0 16px;
	padding-top: 12px;
	border-top: 1px dashed var(--c-border);
}
.event-card__meta-row {
	display: flex;
	gap: 12px;
	padding: 6px 0;
	font-size: 13px;
	align-items: baseline;
}
.event-card__meta-row dt {
	flex-shrink: 0;
	background: var(--c-navy);
	color: #fff;
	font-size: 11px;
	font-weight: 700;
	padding: 3px 10px;
	border-radius: 4px;
	white-space: nowrap;
}
.event-card__meta-row dd {
	margin: 0;
	color: var(--c-text);
	line-height: 1.6;
}
.event-card__meta-note {
	color: var(--c-text-muted);
	font-size: 12px;
}