/* ============================================
   DRAGON BALL THEME — CSS Completo
   Aplique este arquivo no seu header.php:
   <link rel="stylesheet" href="dragonball-theme.css">
   ============================================ */

@import url('https://fonts.googleapis.com/css2?family=Orbitron:wght@700;900&family=Rajdhani:wght@400;600&display=swap');

/* === RESET & BASE === */
* { margin: 0; padding: 0; box-sizing: border-box; }

body {
  font-family: 'Rajdhani', sans-serif;
  background: #0a0a0f;
  color: #e0d5b0;
  min-height: 100vh;
}

/* === HEADER === */
#header, .header, header {
  background: linear-gradient(135deg, #1a0a00 0%, #2d1400 40%, #1a0800 100%);
  border-bottom: 3px solid #ff6600;
  padding: 0;
  position: relative;
  overflow: hidden;
}

#header::before, .header::before {
  content: '';
  position: absolute;
  top: -50%; left: -10%;
  width: 120%; height: 200%;
  background: radial-gradient(ellipse, rgba(255,140,0,0.15) 0%, transparent 60%);
  animation: aura-pulse 3s ease-in-out infinite;
  pointer-events: none;
}

@keyframes aura-pulse {
  0%, 100% { opacity: 0.5; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.05); }
}

/* Logo / Título do site */
#logo, .site-title, .logo h1 {
  font-family: 'Orbitron', sans-serif !important;
  font-size: 26px !important;
  font-weight: 900 !important;
  color: #ffcc00 !important;
  text-shadow: 0 0 20px rgba(255,180,0,0.8), 2px 2px 0 #cc4400;
  letter-spacing: 2px;
}

/* Navegação */
#menu a, nav a, .navigation a {
  color: #e0c080;
  text-decoration: none;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 1px;
  text-transform: uppercase;
  padding: 8px 14px;
  border-radius: 4px;
  border: 1px solid transparent;
  transition: all 0.2s;
}

#menu a:hover, nav a:hover, .navigation a:hover {
  color: #ffcc00;
  border-color: #ff6600;
  background: rgba(255,100,0,0.15);
  text-shadow: 0 0 10px rgba(255,200,0,0.6);
}

/* === TABELA DE NOTÍCIAS === */
table#news {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
  border: 1px solid #331400;
  border-radius: 8px;
  overflow: hidden;
}

table#news tr.yellow {
  background: linear-gradient(90deg, #1f0d00, #2d1800, #1f0d00) !important;
  border-bottom: 2px solid #ff6600;
}

table#news tr.yellow td {
  padding: 12px 16px;
  font-family: 'Orbitron', sans-serif;
  font-size: 13px;
  color: #ffcc44;
  letter-spacing: 1px;
}

table#news tr.yellow td a {
  color: #ffaa00;
  text-decoration: none;
}

table#news tr.yellow td a:hover {
  color: #ffff00;
  text-shadow: 0 0 8px rgba(255,220,0,0.8);
}

table#news td .zheadline {
  font-family: 'Orbitron', sans-serif;
  font-size: 13px;
  color: #ffcc44;
}

table#news tr td {
  background: #0e0500;
  padding: 16px;
  font-size: 14px;
  line-height: 1.7;
  color: #c8b888;
  border-bottom: 1px solid #220a00;
}

table#news tr td p {
  margin: 0;
}

/* === TABELA DE CHANGELOG === */
table#changelogTable {
  width: 100%;
  border-collapse: collapse;
  margin-bottom: 20px;
  border: 1px solid #1a3300;
  border-radius: 8px;
  overflow: hidden;
}

table#changelogTable tr.yellow td {
  background: linear-gradient(90deg, #0a1a00, #122600, #0a1a00);
  border-bottom: 2px solid #44aa00;
  padding: 10px 14px;
  font-family: 'Orbitron', sans-serif;
  font-size: 11px;
  color: #88ff44;
  letter-spacing: 1px;
}

table#changelogTable tr.yellow td a {
  color: #66ff22;
  text-decoration: none;
}

table#changelogTable tr td {
  background: #070e00;
  border-bottom: 1px solid #0f1e00;
  padding: 8px 14px;
  font-size: 12px;
  color: #aac880;
}

table#changelogTable tr td:first-child {
  color: #448800;
  min-width: 130px;
}

/* === SELECT DE PÁGINAS === */
select[name="newspage"] {
  background: #1a0800;
  border: 1px solid #ff6600;
  color: #ffcc00;
  padding: 6px 12px;
  border-radius: 4px;
  font-family: 'Rajdhani', sans-serif;
  font-size: 13px;
  cursor: pointer;
  margin-top: 8px;
  outline: none;
}

select[name="newspage"]:hover {
  border-color: #ffaa00;
  box-shadow: 0 0 8px rgba(255,140,0,0.4);
}

/* === LINKS GERAIS === */
a {
  color: #ffaa00;
  text-decoration: none;
  transition: color 0.2s, text-shadow 0.2s;
}

a:hover {
  color: #ffff00;
  text-shadow: 0 0 8px rgba(255,200,0,0.5);
}

/* === SCROLLBAR === */
::-webkit-scrollbar { width: 6px; }
::-webkit-scrollbar-track { background: #0a0500; }
::-webkit-scrollbar-thumb { background: #ff6600; border-radius: 3px; }
::-webkit-scrollbar-thumb:hover { background: #ffaa00; }

/* === FOOTER === */
#footer, footer, .footer {
  background: #060300;
  border-top: 2px solid #221000;
  padding: 20px;
  text-align: center;
  font-size: 12px;
  color: #443322;
  letter-spacing: 1px;
  margin-top: 30px;
}

/* === SEPARADOR KI === */
.ki-separator {
  width: 100%;
  height: 2px;
  background: linear-gradient(90deg, transparent, #ff6600, #ffff00, #ff6600, transparent);
  margin: 20px 0;
}

/* === LAYOUT PRINCIPAL === */
#wrapper, #content, .content {
  max-width: 1100px;
  margin: 0 auto;
  padding: 30px 20px;
}

/* === TEXTOS GERAIS === */
p { line-height: 1.7; color: #c8b888; }
h1, h2, h3 { font-family: 'Orbitron', sans-serif; color: #ffcc44; }
b, strong { color: #ffdd88; }

/* === BARRA DE POWER LEVEL (opcional) === */
.power-bar {
  background: #110800;
  border-bottom: 2px solid #331400;
  padding: 6px 20px;
  display: flex;
  align-items: center;
  gap: 12px;
  font-size: 12px;
  color: #886633;
  letter-spacing: 2px;
}