/* ==========================================================================
   Design System - JF Diário (Seção Mais Lidas & Breadcrumbs)
   Fiel ao layout single_post.html
   ========================================================================== */

/* Google Fonts Import */
@import url('https://fonts.googleapis.com/css2?family=Cinzel:wght@700;800;900&family=Inter:wght@400;500;600;700&family=Playfair+Display:ital,wght@0,600;0,700;1,400&display=swap');

/* ==========================================================================
   1. BREADCRUMBS AUTOMÁTICOS [jf_breadcrumbs]
   ========================================================================== */
.jf-breadcrumbs {
	font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
	display: flex !important;
	align-items: center !important;
	flex-wrap: nowrap !important;
	gap: 6px !important;
	line-height: 1.4 !important;
}

.jf-breadcrumbs a {
	text-decoration: none !important;
	transition: color 0.2s ease !important;
	white-space: nowrap !important;
}

.jf-breadcrumbs a:hover {
	text-decoration: underline !important;
}

.jf-breadcrumbs .sep {
	color: #94a3b8 !important;
	user-select: none !important;
}

/* ==========================================================================
   2. BLOCO MAIS LIDAS POR EDITORIA [jf_most_read]
   ========================================================================== */
.jf-most-read-container {
	--primary-blue: #1A365D;      /* Azul Marinho Institucional */
	--primary-red: #9B2C2C;       /* Vermelho Noticioso */
	--primary-red-hover: #C53030;
	--dark-text: #111827;         /* Texto Principal */
	--body-text: #27272A;
	--muted-text: #6B7280;
	--bg-card: #FFFFFF;
	--bg-subtle: #F3F4F6;

	box-sizing: border-box;
	font-family: 'Inter', system-ui, -apple-system, sans-serif;
}

.jf-most-read-container *, 
.jf-most-read-container *::before, 
.jf-most-read-container *::after {
	box-sizing: border-box;
}

/* WIDGET CARD */
.jf-most-read-widget {
	background: var(--bg-card);
	padding: 20px;
}

/* TÍTULO DO WIDGET MAIS LIDAS */
.jf-most-read-widget .widget-title {
	font-family: 'Cinzel', serif !important;
	font-size: 1.05rem !important;
	font-weight: 800 !important;
	color: var(--primary-blue) !important;
	border-bottom: 2px solid var(--primary-blue) !important;
	padding-bottom: 6px !important;
	margin: 0 0 16px 0 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	line-height: 1.2 !important;
}

.jf-most-read-widget .widget-title span.category-name {
	color: var(--primary-red) !important;
	font-size: 0.85em !important;
	margin-left: 4px !important;
}

/* LISTA DE NOTÍCIAS MAIS LIDAS */
.jf-most-read-widget .top-reads-list {
	list-style: none !important;
	margin: 0 !important;
	padding: 0 !important;
}

/* ITEM DA LISTA */
.jf-most-read-widget .top-reads-item {
	display: flex !important;
	align-items: flex-start !important;
	gap: 12px !important;
	margin-bottom: 12px !important;
	padding-bottom: 10px !important;
	border-bottom: 1px solid var(--border-color) !important;
}

.jf-most-read-widget .top-reads-item:last-child {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
	border-bottom: none !important;
}

/* NÚMERO EM VERMELHO DE 1 A 3 (ESTILO FIEL AO SINGLE_POST.HTML) */
.jf-most-read-widget .read-number {
	font-family: 'Cinzel', serif !important;
	font-size: 1.6rem !important;
	font-weight: 900 !important;
	color: var(--primary-red) !important;
	line-height: 1 !important;
	flex-shrink: 0 !important;
	min-width: 20px !important;
	text-align: center !important;
}

/* TÍTULO DA NOTÍCIA */
.jf-most-read-widget .read-title {
	font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
	font-size: 0.85rem !important;
	font-weight: 600 !important;
	line-height: 1.35 !important;
	color: var(--dark-text) !important;
}

.jf-most-read-widget .read-title a {
	color: var(--dark-text) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.jf-most-read-widget .read-title a:hover {
	color: var(--primary-red) !important;
}

/* SELO DE CATEGORIA OPCIONAL / METADADOS */
.jf-most-read-widget .read-meta {
	display: block !important;
	font-size: 0.72rem !important;
	color: var(--muted-text) !important;
	margin-top: 3px !important;
	font-weight: 500 !important;
}
