/* ============================================================
   BIJUU.CSS
   ============================================================ */
.bijuu-page { max-width: 1200px; margin:0 auto; padding:24px 20px 60px; }

/* Header */
.bijuu-header { margin-bottom:20px; }
.bijuu-header h1 { font-family:'Bangers',cursive; font-size:2rem; color:#20212A; letter-spacing:1px; margin:0 0 4px; }
.bijuu-header p  { font-size:.85rem; color:#666873; margin:0; }

/* Layout */
.bijuu-layout { display:grid; grid-template-columns:1fr 280px; gap:20px; align-items:start; }

/* Toolbar */
.bijuu-toolbar {
  display:flex; align-items:center; gap:10px; flex-wrap:wrap;
  margin-bottom:16px;
}
.bijuu-busca {
  flex:1; min-width:180px; background:#F4F2ED; border:1px solid #D9D5CC;
  border-radius:8px; padding:8px 14px; color:#20212A; font-family:'Nunito',sans-serif;
  font-size:.82rem; outline:none;
}
.bijuu-busca:focus { border-color:#e74c3c; }
.bijuu-busca::placeholder { color:#666873; }
.bijuu-filtro-btn {
  padding:7px 16px; border-radius:20px; border:1.5px solid #D9D5CC;
  background:transparent; color:#666873; font-size:.78rem; font-weight:800;
  cursor:pointer; font-family:'Nunito',sans-serif; transition:all .15s;
}
.bijuu-filtro-btn:hover  { border-color:#e74c3c; color:#e74c3c; }
.bijuu-filtro-btn.active { background:#e74c3c; border-color:#e74c3c; color:#fff; }

/* Grid 2 colunas */
.bijuu-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; }

/* Card */
.bijuu-card {
  background:#F4F2ED; border:1px solid #D9D5CC; border-radius:14px;
  overflow:hidden; transition:transform .15s, border-color .15s;
}
.bijuu-card:hover { transform:translateY(-2px); }
.bijuu-card.possuida { border-color:#e74c3c44; }
.bijuu-card.ativa    { border-color:#e74c3c; box-shadow:0 0 20px rgba(231,76,60,.25); }

/* Topo do card */
.bijuu-card-topo {
  display:flex; align-items:center; gap:12px;
  padding:14px 16px; border-bottom:1px solid #D9D5CC;
  background:#FFFFFF;
}
.bijuu-card-img {
  width:100px; height:100px; border-radius:12px;
  object-fit:cover; flex-shrink:0; background:#EDE9DE;
}
.bijuu-card-img-emoji {
  width:100px; height:100px; border-radius:12px;
  background:#EDE9DE; display:flex; align-items:center;
  justify-content:center; font-size:3rem; flex-shrink:0;
}
.bijuu-card-meta { flex:1; min-width:0; }
.bijuu-card-nome {
  font-family:'Bangers',cursive; font-size:1rem; color:#20212A;
  letter-spacing:.5px; text-transform:uppercase;
}
.bijuu-card-caudas { font-size:.7rem; color:#666873; font-weight:700; margin-top:1px; }
.bijuu-card-status {
  font-size:.65rem; font-weight:900; margin-top:4px;
}
.bijuu-card-status.possuido { color:#2ecc71; }
.bijuu-card-status.nao      { color:#666873; }
.bijuu-card-status.ativo    { color:#e74c3c; }

/* Stats grid */
.bijuu-stats {
  display:grid; grid-template-columns:1fr 1fr 1fr;
  gap:1px; background:#D9D5CC;
  border-bottom:1px solid #D9D5CC;
}
.bijuu-stat-box { background:#F4F2ED; padding:8px 10px; }
.bijuu-stat-label {
  font-size:.58rem; font-weight:900; color:#666873;
  text-transform:uppercase; letter-spacing:.5px; display:block; margin-bottom:2px;
}
.bijuu-stat-val {
  font-family:'Bangers',cursive; font-size:.95rem; color:#20212A; letter-spacing:.3px;
}
.bijuu-stat-icon { font-size:.75rem; margin-right:2px; }

/* Traço singular */
.bijuu-traco-wrap { padding:10px 14px; border-bottom:1px solid #D9D5CC; }
.bijuu-traco-label { font-size:.58rem; font-weight:900; color:#666873; text-transform:uppercase; letter-spacing:.5px; margin-bottom:4px; }
.bijuu-traco-txt   { font-size:.75rem; color:#666873; line-height:1.4; }

/* Requisito */
.bijuu-req {
  display:flex; align-items:flex-start; gap:6px;
  padding:8px 14px; background:rgba(231,76,60,.05);
  border-bottom:1px solid rgba(231,76,60,.15); font-size:.72rem; color:#e74c3c;
}

/* Acções */
.bijuu-actions { display:flex; gap:6px; padding:12px 14px; }
.bijuu-btn-sinc {
  flex:1; padding:9px; border-radius:8px; border:none;
  background:#e74c3c; color:#fff; font-family:'Nunito',sans-serif;
  font-size:.82rem; font-weight:900; cursor:pointer; transition:background .15s;
}
.bijuu-btn-sinc:hover    { background:#c0392b; }
.bijuu-btn-sinc:disabled { opacity:.4; cursor:not-allowed; }
.bijuu-btn-desativ {
  flex:1; padding:9px; border-radius:8px;
  border:1.5px solid #e74c3c; background:transparent; color:#e74c3c;
  font-family:'Nunito',sans-serif; font-size:.82rem; font-weight:900;
  cursor:pointer; transition:all .15s;
}
.bijuu-btn-desativ:hover { background:#e74c3c; color:#fff; }
.bijuu-btn-restrito {
  flex:1; padding:9px; border-radius:8px;
  border:1px solid #D9D5CC; background:transparent; color:#666873;
  font-family:'Nunito',sans-serif; font-size:.82rem; font-weight:700;
  cursor:not-allowed;
}

/* ── PAINEL DIREITO ─────────────────────────────────────────── */
.bijuu-side { display:flex; flex-direction:column; gap:14px; position:sticky; top:20px; }

/* Identificação Jinchuuriki */
.bijuu-id-card {
  background:#F4F2ED; border:1px solid #D9D5CC; border-radius:14px; overflow:hidden;
}
.bijuu-id-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 14px; background:#FFFFFF; border-bottom:1px solid #D9D5CC;
}
.bijuu-id-titulo { font-size:.62rem; font-weight:900; color:#e74c3c; text-transform:uppercase; letter-spacing:1px; display:flex; align-items:center; gap:6px; }
.bijuu-id-body   { padding:14px; }
.bijuu-id-player { display:flex; align-items:center; gap:10px; margin-bottom:12px; }
.bijuu-id-foto   { width:48px; height:48px; border-radius:10px; object-fit:cover; background:#EDE9DE; }
.bijuu-id-emoji  { width:48px; height:48px; border-radius:10px; background:#EDE9DE; display:flex; align-items:center; justify-content:center; font-size:1.5rem; }
.bijuu-id-nome   { font-family:'Bangers',cursive; font-size:1rem; color:#20212A; letter-spacing:.5px; }
.bijuu-id-sub    { font-size:.68rem; color:#666873; }
.bijuu-id-rank   { background:#e74c3c; color:#fff; font-size:.58rem; font-weight:900; padding:2px 7px; border-radius:4px; display:inline-block; margin-top:3px; }
.bijuu-id-poder  { font-size:.72rem; color:#666873; margin-top:4px; }
.bijuu-id-poder strong { color:#e74c3c; font-family:'Bangers',cursive; font-size:1rem; }

/* Conexão activa */
.bijuu-conexao {
  background:#FFFFFF; border-radius:10px; padding:10px 12px;
  display:flex; align-items:center; gap:10px; margin-bottom:10px;
  border:1px solid #D9D5CC;
}
.bijuu-conexao-img { width:40px; height:40px; border-radius:8px; object-fit:cover; background:#EDE9DE; flex-shrink:0; }
.bijuu-conexao-info { flex:1; }
.bijuu-conexao-nome { font-size:.82rem; font-weight:900; color:#20212A; }
.bijuu-conexao-traco { font-size:.65rem; color:#666873; margin-top:2px; line-height:1.3; }
.bijuu-conexao-badge {
  background:#2ecc71; color:#fff; font-size:.6rem; font-weight:900;
  padding:2px 7px; border-radius:4px; flex-shrink:0;
}
.bijuu-sem-conexao { font-size:.78rem; color:#666873; text-align:center; padding:10px 0; }

/* Análise de atributos */
.bijuu-analise {
  background:#F4F2ED; border:1px solid #D9D5CC; border-radius:14px; overflow:hidden;
}
.bijuu-analise-header {
  display:flex; align-items:center; justify-content:space-between;
  padding:10px 14px; background:#FFFFFF; border-bottom:1px solid #D9D5CC;
}
.bijuu-analise-titulo { font-size:.62rem; font-weight:900; color:#e74c3c; text-transform:uppercase; letter-spacing:1px; display:flex; align-items:center; gap:6px; }
.bijuu-analise-body  { padding:12px 14px; }
.bijuu-analise-tabela { width:100%; border-collapse:collapse; font-size:.75rem; }
.bijuu-analise-tabela th { text-align:left; color:#666873; font-size:.6rem; font-weight:900; text-transform:uppercase; letter-spacing:.5px; padding-bottom:8px; }
.bijuu-analise-tabela th:last-child { text-align:right; }
.bijuu-analise-tabela td { padding:5px 0; color:#666873; border-bottom:1px solid #D9D5CC; }
.bijuu-analise-tabela td:last-child { text-align:right; }
.bijuu-analise-tabela tr:last-child td { border-bottom:none; }
.bijuu-attr-base  { color:#20212A; font-weight:700; }
.bijuu-attr-bonus { color:#e74c3c; font-size:.7rem; font-weight:800; }
.bijuu-ressonancia {
  display:flex; align-items:center; justify-content:space-between;
  margin-top:10px; padding-top:10px; border-top:1px solid #D9D5CC;
}
.bijuu-ressonancia-label { font-size:.65rem; font-weight:900; color:#666873; text-transform:uppercase; letter-spacing:.5px; }
.bijuu-ressonancia-val   { font-family:'Bangers',cursive; font-size:1.3rem; color:#e74c3c; }

/* Caixa */
.bijuu-caixa-card {
  background:#F4F2ED; border:1px solid #e74c3c33; border-radius:14px; padding:14px;
  text-align:center;
}
.bijuu-caixa-icon { font-size:2.5rem; margin-bottom:6px; }
.bijuu-caixa-titulo { font-family:'Bangers',cursive; font-size:1rem; color:#20212A; letter-spacing:.5px; margin-bottom:4px; }
.bijuu-caixa-desc   { font-size:.72rem; color:#666873; margin-bottom:10px; line-height:1.4; }
.bijuu-caixa-qtd    { font-size:.75rem; color:#e67e22; font-weight:800; margin-bottom:8px; }
.bijuu-btn-abrir {
  width:100%; padding:10px; border-radius:8px; border:none;
  background:linear-gradient(135deg,#e74c3c,#c0392b); color:#fff;
  font-family:'Nunito',sans-serif; font-size:.88rem; font-weight:900;
  cursor:pointer; transition:opacity .15s;
}
.bijuu-btn-abrir:hover    { opacity:.85; }
.bijuu-btn-abrir:disabled { opacity:.4; cursor:not-allowed; }

/* Abrir várias caixas de uma vez */
.bijuu-lote-wrap {
  margin-top:10px; text-align:left;
  background:#fff; border:1px solid #e74c3c33; border-radius:8px;
  padding:10px; display:flex; flex-direction:column; gap:8px;
}
.bijuu-lote-label { font-size:.7rem; color:#666873; font-weight:700; }
.bijuu-lote-row { display:flex; gap:8px; }
.bijuu-lote-input {
  width:64px; background:#F4F2ED; border:1px solid #D9D5CC; border-radius:8px;
  color:#20212A; font-size:.85rem; font-weight:800; font-family:'Nunito',sans-serif;
  text-align:center; padding:0 6px;
}
.bijuu-lote-row .bijuu-btn-abrir { flex:1; width:auto; padding:8px; font-size:.8rem; }

/* Resultado da caixa */
.bijuu-resultado {
  margin-top:10px; padding:10px; border-radius:8px;
  background:rgba(231,76,60,.08); border:1px solid rgba(231,76,60,.2);
  font-size:.78rem; color:#20212A; display:none;
}
.bijuu-resultado.show { display:block; }
.bijuu-resultado.bijuu { background:rgba(241,196,15,.08); border-color:rgba(241,196,15,.3); color:#f1c40f; font-weight:900; }

/* Msg */
.bijuu-msg { border-radius:8px; padding:10px 16px; margin-bottom:14px; font-size:.85rem; display:none; }
.bijuu-msg.show    { display:block; }
.bijuu-msg.success { background:rgba(46,204,113,.1); border:1px solid #2ecc71; color:#2ecc71; }
.bijuu-msg.error   { background:rgba(231,76,60,.1);  border:1px solid #e74c3c; color:#e74c3c; }
.bijuu-msg.info    { background:rgba(52,152,219,.1); border:1px solid #3498db; color:#7fb3d3; }

@media(max-width:900px){
  .bijuu-layout{grid-template-columns:1fr;}
  .bijuu-grid{grid-template-columns:1fr;}
  .bijuu-side{position:static;}
}

/* ── Painel de bijuus sincronizadas e bónus ────────────────── */
.bijuu-sinc-card, .bijuu-bonus-card {
  background: #F4F2ED;
  border: 1px solid #D9D5CC;
  border-radius: 14px;
  overflow: hidden;
  margin-bottom: 12px;
}
.bijuu-sinc-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  background: #FFFFFF;
  border-bottom: 1px solid #D9D5CC;
}
.bijuu-sinc-titulo {
  font-size: .72rem;
  font-weight: 900;
  color: #e67e22;
  text-transform: uppercase;
  letter-spacing: 1px;
}
.bijuu-sinc-count {
  font-size: .7rem;
  font-weight: 900;
  color: #666873;
}
.bijuu-sinc-lista {
  padding: 8px 0;
  max-height: 260px;
  overflow-y: auto;
}
.bijuu-sinc-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 14px;
  border-bottom: 1px solid #D9D5CC;
}
.bijuu-sinc-item:last-child { border-bottom: none; }
.bijuu-sinc-img {
  width: 40px; height: 40px;
  border-radius: 8px;
  object-fit: cover;
  background: #EDE9DE;
  flex-shrink: 0;
}
.bijuu-sinc-info { flex: 1; }
.bijuu-sinc-nome  { font-size: .78rem; font-weight: 800; color: #20212A; }
.bijuu-sinc-caudas{ font-size: .68rem; color: #2ecc71; font-weight: 700; }
.bijuu-btn-dessync {
  background: rgba(231,76,60,.12);
  border: 1px solid #e74c3c44;
  color: #e74c3c;
  border-radius: 5px;
  padding: 3px 8px;
  font-size: .75rem;
  cursor: pointer;
  flex-shrink: 0;
  font-family: 'Nunito', sans-serif;
}
.bijuu-btn-dessync:hover { background: rgba(231,76,60,.25); }

/* Bônus */
.bijuu-bonus-body { padding: 10px 14px; }
.bijuu-bonus-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 5px 0;
  border-bottom: 1px solid #D9D5CC;
}
.bijuu-bonus-row:last-of-type { border-bottom: none; }
.bijuu-bonus-label { font-size: .72rem; color: #666873; font-weight: 700; }
.bijuu-bonus-val   { font-size: .82rem; font-weight: 900; color: #666873; }
.bijuu-bonus-total {
  display: flex;
  justify-content: space-between;
  padding: 8px 0 2px;
  margin-top: 6px;
  border-top: 1px solid #e67e2222;
  font-size: .75rem;
  font-weight: 900;
  color: #e67e22;
  text-transform: uppercase;
  letter-spacing: 1px;
}
