@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Merriweather+Sans:wght@400;700&family=Open+Sans:ital,wght@0,400;0,600;0,700;1,400&display=swap');

:root {
  /* Identidade Visual UFPA */
  --ufpa-color-primary: rgb(191, 23, 43); /* Vermelho padrão UFPA */
  --ufpa-color-header: #ffffff; /* Fundo escuro do header */
  --ufpa-color-hover: #9b1322; /* Tom para interações */

  /* Sobrescrevendo Variáveis do Cassiopeia */
  --cassiopeia-color-primary: var(--ufpa-color-header);
  --cassiopeia-color-hover: var(--ufpa-color-hover);
  --cassiopeia-color-link: var(--ufpa-color-primary);
  
  /* Reset de Cores Bootstrap (Neutralizando o azul) */
  --bs-primary: var(--ufpa-color-primary);
  --bs-info: var(--ufpa-color-primary);
  --bs-link-color: var(--ufpa-color-primary);
  --bs-link-hover-color: var(--ufpa-color-hover);

  /* Tipografia */
  --cassiopeia-font-family-body: 'Open Sans', sans-serif !important;
  --cassiopeia-font-family-headings: 'Merriweather Sans', sans-serif !important;
}

/* ==========================================
   1. TIPOGRAFIA E LINKS (SUBINHADO REMOVIDO)
========================================== */
body {
    font-family: var(--cassiopeia-font-family-body);
}

/* Headers de texto em Preto */
h1, h2, h3, h4, h5, h6,
.h1, .h2, .h3, .h4, .h5, .h6,
.page-header h1, .item-title a {
    color: #000000 !important;
    font-family: var(--cassiopeia-font-family-headings);
    text-decoration: none !important; /* Sem sublinhado em títulos */
    font-weight: 700;
}

/* Ajuste de escala dos títulos */
h1, .h1 { font-size: 2rem !important; }
h2, .h2 { font-size: 1.75rem !important; }
h3, .h3 { font-size: 1.5rem !important; }
h4, .h4 { font-size: 1.25rem !important; }

/* Configuração Global de Links - REMOVENDO SUBUNHADO */
a {
    color: var(--ufpa-color-primary);
    text-decoration: none !important; /* O SEGREDO: Remove o sublinhado de vez */
    transition: color 0.2s;
}

a:hover, a:focus {
    color: var(--ufpa-color-hover);
    text-decoration: none !important; /* Garante que não apareça no hover */
}

.item-title a:hover {
    color: var(--ufpa-color-primary) !important;
}


.container-topbar {
    color: #fff;
    background-color: var(--ufpa-color-primary);
    padding-top: 8px;
    padding-bottom: 1px;
}

.container-topbar p{
    margin-block-end: 8px !important;
}


/* ==========================================
   2. CABEÇALHO E NAVBAR (MENU PRINCIPAL)
========================================== */
.container-header {
  background-color: var(--ufpa-color-header) !important;
  background-image: none !important;
  padding-bottom: 0 !important;
  margin-bottom: 0 !important;
}

.container-header .site-description {
    color: #000000;
    white-space: normal;
    font-size: 1rem;
}

.container-header .search,
.container-header .mod-search {
    margin-bottom: 0.5rem !important; 
}

.container-header .navbar-toggler {
    color: #000000;
    cursor: pointer;
    border: 1px solid #000000;
}

.container-nav {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-bottom: 0 !important;
}

/* Uniformização das fontes na Navbar */
.container-nav .mod-menu > li > a,
.container-nav .mod-menu > li > span,
.container-nav .mod-menu > li > button {
    color: #000000 !important;
    font-size: 0.9rem !important; 
    font-weight: 600 !important; 
    padding: 10px 16px !important;
    transition: background-color 0.2s ease;
    border-radius: 8px 8px 8px 8px;
    text-decoration: none !important;
}

.container-nav .mod-menu ul li a {
    font-size: 0.9rem !important;
    text-decoration: none !important;
}

.container-nav .mod-menu > li:hover > a,
.container-nav .mod-menu > li.active > a {
    color: #ffffff !important;
    background-color: var(--ufpa-color-hover) !important;
}

/* ==========================================
   3. MENUS LATERAIS (SIDEBARS) - BORDAS UFPA
========================================== */
.sidebar-right h3, .sidebar-left h3 {
    font-size: 1.1rem !important;
    color: var(--ufpa-color-primary) !important;
    border-bottom: 2px solid var(--ufpa-color-primary);
    padding-bottom: 8px;
    margin-bottom: 15px;
    text-transform: uppercase;
}

.sidebar-right .mod-menu, .sidebar-left .mod-menu {
    list-style: none;
    padding: 0 !important;
    margin: 0;
    background: #ffffff;
    border: 1px solid #e9ecef;
    border-radius: 10px;
    overflow: hidden; 
    box-shadow: 0 2px 4px rgba(0,0,0,0.05);
}

.sidebar-right .mod-menu li, .sidebar-left .mod-menu li {
    margin: 0 !important;
    padding: 0 !important;
    border: none !important; 
}

.sidebar-right .mod-menu li a, .sidebar-left .mod-menu li a {
    display: block;
    padding: 12px 15px;
    color: #495057;
    font-size: 0.95rem;
    font-weight: 600; 
    border-bottom: 1px solid #e9ecef; 
    transition: background-color 0.2s, color 0.2s, border-color 0.2s;
    margin: 0 !important;
    text-decoration: none !important;
}

.sidebar-right .mod-menu li:last-child a, 
.sidebar-left .mod-menu li:last-child a {
    border-bottom: none !important;
}

.sidebar-right .mod-menu li a:hover, 
.sidebar-right .mod-menu li.active > a,
.sidebar-left .mod-menu li a:hover, 
.sidebar-left .mod-menu li.active > a {
    background-color: var(--ufpa-color-primary) !important;
    color: #ffffff !important;
    border-bottom-color: var(--ufpa-color-primary) !important; 
}

/* ==========================================
   4. BOTÕES E CLASSES DE FUNDO
========================================== */
.btn-primary, .btn-secondary, .btn-info, 
button[type="submit"] {
  background-color: var(--ufpa-color-primary) !important;
  border-color: var(--ufpa-color-primary) !important;
  border-radius: 10px; /* Bordas arredondadas em todos os cantos */
  color: #ffffff !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: background-color 0.2s ease;
}

.mod-search__button {
  background-color: var(--ufpa-color-primary) !important;
  border-color: var(--ufpa-color-primary) !important;
  border-radius: 0 10px 10px 0 !important; /* Bordas arredondadas apenas no lado direito */
  color: #ffffff !important;
  font-weight: 600 !important;
  text-decoration: none !important;
  transition: background-color 0.2s ease;
}

.awesomplete > input {
     border-radius: 10px 0 0 10px !important; /* Bordas arredondadas apenas no lado esquerdo */
     border-right: none !important; /* Remove a borda direita para evitar sobreposição com o botão */
}

.btn-primary:hover, .btn-secondary:hover, .btn-info:hover, 
button[type="submit"]:hover, .mod-search__button:hover {
  background-color: var(--ufpa-color-hover) !important;
  border-color: var(--ufpa-color-hover) !important;
}

.bg-info {
    background-color: #000000 !important;
    color: #ffffff !important;
}

/* ==========================================
   5. COMPONENTES VISUAIS - IMAGENS ARREDONDADAS (CORRIGIDO)
========================================= */
/* Seletores ampliados para garantir bordas arredondadas em todo o site */
main img,
aside img,
.com-content-article__body img, 
.item-image img,
.blog-item img,
.moduletable img {
  border-radius: 10px !important; /* Bordas arredondadas devolvidas */
  box-shadow: 0 4px 10px rgba(0,0,0,0.1); 
  max-width: 100%;
  height: auto;
  display: block; 
  transition: transform 0.3s ease;
}

/* Efeito de hover nas imagens */
main img:hover,
aside img:hover,
.com-content-article__body img:hover, 
.item-image img:hover,
.blog-item img:hover {
  transform: translateY(-2px);
}

footer {
    color: #fff;
    background-color: var(--ufpa-color-primary) !important;
    background-image: none !important;
    margin-top: 1em;
}

footer h3 {
    color: #fff !important;
}

.container-banner h1 {
    color: #fff !important;
}