/* --------------------------------------------------------------
   Blog — correcoes de layout mobile (carregado por ULTIMO)
   O bootstrap-5.3.3.min.css e enfileirado depois do CSS base do
   blog e sobrescrevia as regras de imagem e tabela. Este arquivo
   entra na prioridade 999 para vencer a ordem de origem.
   Escopo: body.single-post, body.blog, body.archive.
   -------------------------------------------------------------- */

/* ---------- Conteineres: sem isto, 100% e maior que a tela ---------- */

body.single-post .wrap,
body.blog .wrap,
body.archive .wrap {
	max-width: 100% !important;
	width: auto !important;
	padding-left: 0 !important;
	padding-right: 0 !important;
	box-sizing: border-box !important;
	overflow-x: hidden !important;
}

body.single-post #primary,
body.single-post .content-area,
body.single-post .site-main {
	max-width: 100% !important;
	width: auto !important;
	float: none !important;
	box-sizing: border-box !important;
}

/* o tema tem sidebar em duas colunas; no artigo isso espreme o texto */
body.single-post .sidebar,
body.blog .sidebar {
	display: none !important;
}

/* ---------- Imagem destacada do topo ---------- */

body.single-post .single-featured-image-header,
body.single-post .panel-image,
body.single-post .has-header-image .custom-header-media {
	max-height: 22rem !important;
	overflow: hidden !important;
}

body.single-post .single-featured-image-header img {
	width: 100% !important;
	height: auto !important;
	max-height: 22rem !important;
	object-fit: cover !important;
	display: block !important;
}

/* ---------- TODA imagem do artigo ---------- */

body.single-post img,
body.blog img,
body.archive img {
	max-width: 100% !important;
	height: auto !important;
	box-sizing: border-box !important;
}

body.single-post .entry-content figure,
body.single-post .entry-content .wp-block-image {
	max-width: 100% !important;
	width: auto !important;
	margin-left: 0 !important;
	margin-right: 0 !important;
}

body.single-post .entry-content figure img {
	width: 100% !important;
	height: auto !important;
	border-radius: 10px;
}

/* ---------- Tabelas ---------- */

body.single-post .entry-content table {
	max-width: 100% !important;
	width: 100% !important;
	display: table !important;
	table-layout: auto;
}

/* ---------- Nada pode estourar a largura da tela ---------- */

body.single-post,
body.blog,
body.archive {
	overflow-x: hidden !important;
}

body.single-post .entry-content > * {
	max-width: 100%;
}

body.single-post .entry-content pre,
body.single-post .entry-content code {
	white-space: pre-wrap;
	word-break: break-word;
}

/* ---------- Celular ---------- */

@media (max-width: 782px) {

	body.single-post .entry-content,
	body.single-post .entry-header {
		padding-left: 1rem !important;
		padding-right: 1rem !important;
		max-width: 100% !important;
	}

	body.single-post .single-featured-image-header,
	body.single-post .single-featured-image-header img {
		max-height: 13rem !important;
	}

	/* tabela rola na horizontal em vez de estourar */
	body.single-post .entry-content table {
		display: block !important;
		overflow-x: auto !important;
		-webkit-overflow-scrolling: touch;
		white-space: nowrap;
		font-size: .875rem !important;
	}

	body.single-post .entry-content figure { margin: 1.4rem 0 !important; }

	body.single-post .entry-title {
		font-size: clamp(1.45rem, 1.1rem + 2vw, 2rem) !important;
		line-height: 1.25 !important;
	}
}

@media (max-width: 480px) {
	body.single-post .single-featured-image-header,
	body.single-post .single-featured-image-header img {
		max-height: 10rem !important;
	}
	body.single-post .entry-content { font-size: 1rem !important; }
}


/* ---------- Listagem: deixar claro que o card e clicavel ---------- */

body.blog .site-main article,
body.archive .site-main article {
	border: 1px solid #e3ecf3 !important;
	border-radius: 12px !important;
	padding: 1.25rem !important;
	margin-bottom: 1.5rem !important;
	background: #fff !important;
	transition: box-shadow .18s ease, transform .18s ease;
}

body.blog .site-main article:hover,
body.archive .site-main article:hover {
	box-shadow: 0 6px 20px rgba(18,58,92,.12);
	transform: translateY(-2px);
}

body.blog .entry-title a,
body.archive .entry-title a {
	color: #0d6ea8 !important;
	text-decoration: none !important;
	display: inline-block;
}

body.blog .entry-title a:hover,
body.archive .entry-title a:hover {
	text-decoration: underline !important;
	text-underline-offset: 3px;
	color: #08415f !important;
}

/* seta indicando que leva a algum lugar */
body.blog .entry-title a::after,
body.archive .entry-title a::after {
	content: ' \2192';
	font-weight: 400;
	opacity: .55;
}

body.blog .site-main article img,
body.archive .site-main article img {
	border-radius: 8px !important;
	max-width: 100% !important;
	height: auto !important;
}

/* resumo abaixo do titulo */
body.blog .entry-summary,
body.blog .entry-content,
body.archive .entry-summary {
	color: #46555f;
	font-size: .975rem;
	line-height: 1.6;
}


/* ===== CORRECAO 1: fonte =====
   O style.css do tema define Raleway com especificidade maior e vencia
   a regra base do blog. Forcado aqui para Poppins, a mesma das money
   pages, para o blog nao destoar do resto do site. */

body.single-post .entry-content,
body.single-post .entry-content p,
body.single-post .entry-content li,
body.single-post .entry-content td,
body.single-post .entry-content th,
body.single-post .entry-content caption,
body.single-post .entry-title,
body.single-post .entry-content h2,
body.single-post .entry-content h3,
body.blog .entry-title,
body.blog .site-main {
	font-family: 'Poppins', -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Arial, sans-serif !important;
}

/* ===== CORRECAO 2: tabela cabe na tela =====
   Antes a tabela tinha 1645px de largura real contra 343px visiveis, com
   white-space:nowrap forcando rolagem horizontal. Virava um bloco cortado
   no meio do texto. Agora o conteudo quebra e a tabela inteira aparece. */

@media (max-width: 782px) {

	body.single-post .entry-content table {
		display: table !important;
		width: 100% !important;
		table-layout: fixed !important;
		overflow-x: visible !important;
		white-space: normal !important;
		font-size: .8125rem !important;
	}

	body.single-post .entry-content th,
	body.single-post .entry-content td {
		white-space: normal !important;
		word-break: break-word !important;
		hyphens: auto;
		padding: .5rem .45rem !important;
		vertical-align: top !important;
	}

	body.single-post .entry-content caption {
		white-space: normal !important;
		font-size: .8125rem !important;
	}
}