/* Theme Name: Terra Prometida Theme URI: https://terraprometida.ao Author: Rui Mata Description: Tema personalizado para o site Terra Prometida, Angola. Version: 1.1 License: GPLv2 or later Text Domain: terraprometida */ /* =================== VARIÁVEIS DE COR =================== */ /* Fallbacks — Customizer sobrescreve no */ :root { --cor-primaria: #1565c0; /* azul principal */ --cor-secundaria: #1e88e5; /* azul médio */ --cor-destaque: #90caf9; /* azul claro */ --cor-fundo: #f5f5f5; /* fundo neutro */ --cor-texto: #333; /* texto padrão */ --cor-branca: #ffffff; } /* =================== BASE =================== */ body { font-family: 'Open Sans', sans-serif; margin: 0; padding: 0; background: var(--cor-fundo); color: var(--cor-texto); padding-top: 60px; /* altura do header fixo */ padding-bottom: 60px;/* altura do footer fixo */ } /* =================== HEADER =================== */ .site-header { display: flex; justify-content: space-between; align-items: center; background: var(--cor-primaria); color: var(--cor-branca); padding: 10px 20px; position: fixed; top: 0; left: 0; right: 0; z-index: 1000; } .logo-texto .logo-link { display: flex; align-items: center; text-decoration: none; } .logo-texto .site-nome { font-size: 1.2em; font-weight: bold; color: var(--cor-branca); } /* =================== MENU =================== */ .menu-principal { flex-grow: 1; display: flex; justify-content: flex-end; } .menu-principal .nav-list { list-style: none; display: flex; gap: 15px; margin: 0; padding: 0; } .menu-principal .nav-list li { position: relative; } .menu-principal .nav-list li a { color: var(--cor-branca); text-decoration: none; font-weight: bold; padding: 5px 10px; transition: color 0.3s ease; } .menu-principal .nav-list li a:hover { color: var(--cor-destaque); } /* Submenu */ .menu-principal .nav-list li ul.sub-menu { display: none; position: absolute; top: 100%; left: 0; background: var(--cor-secundaria); list-style: none; margin: 0; padding: 0; min-width: 180px; z-index: 999; } .menu-principal .nav-list li ul.sub-menu li a { padding: 8px 12px; color: var(--cor-branca); display: block; } .menu-principal .nav-list li ul.sub-menu li a:hover { background: var(--cor-primaria); } /* Mostrar submenu */ .menu-principal .nav-list li:hover > ul.sub-menu { display: block; } /* Setinhas ▾ ▴ */ .menu-principal .nav-list li.menu-item-has-children > a::after { content: " ▾"; font-size: 0.8em; margin-left: 5px; color: var(--cor-destaque); } .menu-principal .nav-list li.menu-item-has-children:hover > a::after { content: " ▴"; color: var(--cor-branca); } /* Itens ativos */ .menu-principal .nav-list .current-menu-item > a, .menu-principal .nav-list .current_page_item > a { color: #ffeb3b; border-bottom: 2px solid #ffeb3b; } .menu-principal .nav-list .current-menu-parent > a, .menu-principal .nav-list .current-menu-ancestor > a { color: #80d8ff; border-bottom: 2px solid #80d8ff; } .menu-principal .nav-list .sub-menu .current-menu-item > a { background: var(--cor-primaria); border-radius: 4px; } /* =================== BREADCRUMBS =================== */ .breadcrumbs { font-size: 0.85em; color: var(--cor-destaque); margin: 5px 0; } .breadcrumbs a { color: var(--cor-branca); text-decoration: none; } .breadcrumbs a:hover { text-decoration: underline; } .breadcrumbs span.separator { margin: 0 5px; color: var(--cor-destaque); } /* =================== FOOTER =================== */ .site-footer { background: var(--cor-primaria); color: var(--cor-branca); height: 60px; display: flex; align-items: center; justify-content: center; font-size: 0.9em; position: fixed; bottom: 0; left: 0; right: 0; z-index: 1000; } .footer-direitos { text-align: center; margin-top: 20px; border-top: 1px solid var(--cor-secundaria); padding-top: 10px; font-size: 0.8em; } /* =================== CONTEÚDO =================== */ #conteudo-pagina, #conteudo-post { max-width: 1000px; margin: 40px auto; padding: 20px; background: var(--cor-branca); border-radius: 8px; } .titulo-pagina, .titulo-post { color: var(--cor-primaria); } /* =================== RESPONSIVIDADE =================== */ @media (max-width: 768px) { .menu-principal .nav-list { flex-direction: column; gap: 10px; } .site-header { flex-direction: column; align-items: flex-start; } } .imagem-principal img { max-width: 100%; height: auto; display: block; margin: 20px auto; border-radius: 8px; box-shadow: 0 4px 8px rgba(0,0,0,0.2); } /* =================== LOGOTIPO =================== */ .logo-texto { display: flex; align-items: center; /* Alinha verticalmente */ gap: 10px; /* Espaço entre logo e texto */ } .site-nome { font-size: 0.8rem; font-weight: bold; color: var(--cor-primaria); text-transform: uppercase; letter-spacing: 1px; } /* Logotipo global — quadrado 100x100 */ .custom-logo, .logo-texto img, .logo-link img, .terraprometida-logo-wrap img { width: 50px !important; height: 50px !important; object-fit: cover; border-radius: 8px; display: block; margin: 0 auto; }