/* ==========================================================================
   Design System - JF Diário (Bloco de Opinião & Últimas Colunas)
   Fiel ao layout homepage.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');

.jf-columns-container {
	--primary-blue: #1A365D;      /* Azul Marinho Institucional */
	--primary-red: #9B2C2C;       /* Vermelho Noticioso */
	--primary-red-hover: #C53030;
	--dark-text: #111827;         /* Texto Principal */
	--body-text: #374151;
	--muted-text: #6B7280;
	--bg-card: #FFFFFF;
	--border-color: #E5E7EB;

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

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

/* WIDGET CONTAINER */
.jf-columns-widget {
	background: var(--bg-card);
	border: 1px solid var(--border-color);
	border-radius: 6px;
	padding: 20px;
}

/* TÍTULO DO WIDGET DE OPINIÃO */
.jf-columns-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 18px 0 !important;
	text-transform: uppercase !important;
	letter-spacing: 0.5px !important;
	display: flex !important;
	justify-content: space-between !important;
	align-items: center !important;
	line-height: 1.2 !important;
}

.jf-columns-widget .widget-title span.badge-tag {
	font-size: 0.72rem !important;
	color: var(--primary-red) !important;
	font-weight: 700 !important;
	font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
}

/* ITEM DE COLUNA / OPINIÃO */
.jf-columns-widget .opinion-item {
	display: flex !important;
	align-items: flex-start !important;
	gap: 12px !important;
	margin-bottom: 16px !important;
	padding-bottom: 14px !important;
	border-bottom: 1px dashed var(--border-color) !important;
}

.jf-columns-widget .opinion-item:last-child {
	margin-bottom: 0 !important;
	padding-bottom: 0 !important;
	border-bottom: none !important;
}

/* CIRCULO DO AVATAR DO COLUNISTA */
.jf-columns-widget .avatar-circle {
	width: 46px !important;
	height: 46px !important;
	border-radius: 50% !important;
	background-color: var(--primary-blue) !important;
	color: #ffffff !important;
	display: flex !important;
	align-items: center !important;
	justify-content: center !important;
	font-weight: 700 !important;
	font-size: 0.88rem !important;
	flex-shrink: 0 !important;
	border: 2px solid var(--primary-red) !important;
	overflow: hidden !important;
}

.jf-columns-widget .avatar-circle img {
	width: 100% !important;
	height: 100% !important;
	object-fit: cover !important;
	border-radius: 50% !important;
}

/* INFOS DA COLUNA */
.jf-columns-widget .opinion-info {
	display: flex !important;
	flex-direction: column !important;
	justify-content: center !important;
}

.jf-columns-widget .opinion-info h5 {
	font-family: 'Inter', system-ui, -apple-system, sans-serif !important;
	font-size: 0.8rem !important;
	color: var(--primary-red) !important;
	text-transform: uppercase !important;
	font-weight: 700 !important;
	margin: 0 !important;
	letter-spacing: 0.5px !important;
}

.jf-columns-widget .opinion-info h4 {
	font-family: 'Playfair Display', Georgia, serif !important;
	font-size: 0.95rem !important;
	font-weight: 700 !important;
	line-height: 1.35 !important;
	margin: 3px 0 0 0 !important;
	color: var(--dark-text) !important;
}

.jf-columns-widget .opinion-info h4 a {
	color: var(--dark-text) !important;
	text-decoration: none !important;
	transition: color 0.2s ease !important;
}

.jf-columns-widget .opinion-info h4 a:hover {
	color: var(--primary-red) !important;
}