/* ============================================================
 * Visão Universitária — Custom CSS
 * Upload via: OJS Admin → Configurações → Website → Aparência → Avançado
 *             → "Folha de estilo do diário" (Journal stylesheet)
 *
 * Aplica regras pra:
 *   1. Limitar tamanho da logo no header (evita renderização gigante)
 *   2. Limitar imagem do rodapé
 *   3. Defensiva pra qualquer imagem dentro de blocos custom HTML
 *   4. Layout do "Platform & workflow by OJS/PKP"
 *
 * Selectors PKP padrão + !important pra override do tema.
 * Criado: 2026-05-09
 * ============================================================ */

/* ===== 1. Logo do HEADER (topo) — defensiva agressiva ===== */
.pkp_site_name img,
.pkp_site_name_wrapper img,
.pkp_brand_image img,
.pkp_site_title img,
header img.logo,
header .logo img,
.pkp_structure_head img,
.page-header img,
#headerNavigationContainer img,
.header_view img,
header > div img,
header img {
  max-width: 400px !important;
  max-height: 120px !important;
  height: auto !important;
  width: auto !important;
  object-fit: contain !important;
}

/* Container do header — limita altura total da seção */
.pkp_structure_head,
.page-header,
header.header {
  max-height: 160px !important;
  overflow: hidden !important;
}

/* ===== 2. Imagem do RODAPÉ / footer ===== */
.pkp_structure_footer img,
.pkp_brand_footer img,
.cmp_footer_content img,
footer img,
#footer img {
  max-width: 300px !important;
  max-height: 100px !important;
  height: auto !important;
  width: auto !important;
}

/* ===== 3. Imagens em blocos de conteúdo (sidebar, página inicial, custom HTML) ===== */
.cmp_main_content img,
.pkp_page_content img,
.page-content img,
.homepage-image img,
.pkp_block img,
.cmp_sidebar img {
  max-width: 100% !important;
  height: auto !important;
}

/* ===== 4. Layout footer flex (logo esquerda, "Platform by OJS/PKP" direita) ===== */
.pkp_brand_footer,
.pkp_structure_footer .pkp_footer_content,
.pkp_structure_footer {
  display: flex !important;
  justify-content: space-between !important;
  align-items: center !important;
  flex-wrap: wrap !important;
  gap: 1rem !important;
  padding: 1.5rem 2rem !important;
}

/* ===== 4.1. Reduzir e alinhar bloco "Platform & workflow by OJS/PKP" ===== */
.pkp_brand_footer p,
.pkp_brand_footer .pkp_brand_footer__text,
.cmp_footer_content p,
.pkp_structure_footer p {
  font-size: 0.85rem !important;
  line-height: 1.3 !important;
  margin: 0 !important;
  text-align: right !important;
  font-weight: 400 !important;
}

/* Logo OJS/PKP do rodapé (img dentro do bloco "powered by") */
.pkp_brand_footer img[alt*="OJS"],
.pkp_brand_footer img[alt*="PKP"],
.pkp_brand_footer img[src*="ojs_brand"],
.pkp_brand_footer img[src*="pkp_brand"],
.cmp_footer_content img[alt*="OJS"],
.pkp_structure_footer img[alt*="OJS"],
.pkp_structure_footer img[alt*="PKP"] {
  max-width: 90px !important;
  max-height: 50px !important;
  height: auto !important;
}

/* ===== 4.2. Container do bloco direito (logo PKP + texto) também flex/centered ===== */
.pkp_brand_footer > *,
.pkp_structure_footer > * {
  display: flex !important;
  align-items: center !important;
  gap: 0.5rem !important;
}

/* Caso "Platform & workflow by" venha em <span> ao invés de <p> */
.pkp_brand_footer span,
.pkp_structure_footer span {
  font-size: 0.85rem !important;
  line-height: 1.3 !important;
}

/* ===== 5. Genérico defensivo: qualquer img inserida em editor rich-text ===== */
.tinymce-content img,
[contenteditable] img {
  max-width: 100% !important;
  height: auto !important;
}

/* ===== 6. Reduzir altura da seção do logo no homepage ===== */
.pkp_homepage_image,
.homepage-image {
  max-height: 250px !important;
  overflow: hidden !important;
}

.pkp_homepage_image img,
.homepage-image img {
  object-fit: contain !important;
}