/*
 * Tempo de Leitura: modo completo.
 * Os valores padrão reproduzem o widget "Informações do post" do template de post:
 * texto 12px #736B79, ícone 14px #7137E8, 5px entre ícone e texto.
 * Todos podem ser trocados pelas opções do shortcode (cor_texto, cor_icone, tamanho...).
 */
.tl-post-info {
	--tl-cor-texto: #736B79;
	--tl-cor-icone: #7137E8;
	--tl-tamanho: 12px;
	--tl-tamanho-icone: 14px;
	--tl-espaco-icone: 5px;
	--tl-alinhamento: flex-start;

	display: flex;
	flex-wrap: wrap;
	align-items: center;
	justify-content: var(--tl-alinhamento);
	margin: 0;
	padding: 0;
	font-size: var(--tl-tamanho);
	color: var(--tl-cor-texto);
}

.tl-post-info .tl-item {
	display: inline-flex;
	align-items: center;
	margin: 0;
	padding: 0;
	font-size: var(--tl-tamanho);
	color: var(--tl-cor-texto);
	word-break: break-word;
}

.tl-post-info .tl-icone {
	display: flex;
	align-items: center;
	flex-shrink: 0;
	width: var(--tl-tamanho-icone);
	color: var(--tl-cor-icone);
}

.tl-post-info .tl-icone svg {
	display: block;
	width: var(--tl-tamanho-icone);
	height: var(--tl-tamanho-icone);
	fill: var(--tl-cor-icone);
}

.tl-post-info .tl-icone i {
	font-size: var(--tl-tamanho-icone);
	line-height: 1;
	color: var(--tl-cor-icone);
}

.tl-post-info .tl-texto {
	padding: 0;
	font-size: var(--tl-tamanho);
	color: var(--tl-cor-texto);
}

.tl-post-info .tl-icone + .tl-texto {
	padding-inline-start: var(--tl-espaco-icone);
}

.tl-post-info .tl-prefixo,
.tl-post-info .tl-tempo,
.tl-post-info .tl-sufixo {
	font: inherit;
	color: inherit;
}