/**
 * Meta Row Component
 *
 * Inline metadata display (date, type, status, etc.)
 *
 * @package CPDC_Sovereign_Debt_Hub
 * @since 0.1.0
 */

.meta-row {
	display: flex;
	flex-wrap: wrap;
	align-items: center;
	gap: var(--wp--preset--spacing--sm);
	margin: 0;
	padding: 0;
	list-style: none;
	font-size: var(--wp--preset--font-size--sm);
	color: var(--wp--preset--color--gray-600);
}

.meta-row__item {
	display: inline-flex;
	align-items: center;
	gap: 0.35em;
}

.meta-row__label {
	font-weight: 500;
	color: var(--wp--preset--color--gray-700);
}

.meta-row__value {
	color: var(--wp--preset--color--gray-600);
}

.meta-row__separator {
	color: var(--wp--preset--color--gray-400);
	user-select: none;
}

/* ==========================================================================
   Variants
   ========================================================================== */

/* Single page meta - slightly larger */
.meta-row--single {
	font-size: var(--wp--preset--font-size--sm);
	gap: var(--wp--preset--spacing--md);
}

/* Card meta - compact */
.meta-row--card {
	font-size: var(--wp--preset--font-size--xs);
	gap: var(--wp--preset--spacing--xs);
}

/* ==========================================================================
   Stacked Layout (for mobile or tight spaces)
   ========================================================================== */

.meta-row--stacked {
	flex-direction: column;
	align-items: flex-start;
	gap: var(--wp--preset--spacing--xs);
}

.meta-row--stacked .meta-row__separator {
	display: none;
}