/* ============================================= */
/* == NOVO PAINEL DE INFORMAÇÕES DO JOGADOR (FINAL) == */
/* ============================================= */

/* --- Container Principal --- */
.player-panel-container {
    max-width: 320px; 
    width: 90vw;
    transition: width 0.2s ease-in-out, height 0.2s ease-in-out;
    /* Garante que o container não seja arrastável, apenas o painel dentro */
    cursor: default;
}

/* --- Corpo do Painel --- */
.player-panel {
    position: relative; /* Essencial para posicionar o botão dentro dele */
    background-color: rgba(49, 83, 138, 0.85);
    background-image: url(/public/images/home/bgnew.png);
    backdrop-filter: blur(10px);
    border: 1px solid #739dce;
    border-radius: 8px;
    box-shadow: 0 8px 25px rgba(0, 0, 0, 0.5);
    color: #e0eafc;
    cursor: move;
}
/* --- Estado Minimizado e Botão "Abrir" --- */
#infomenu-minimized-placeholder {
    width: 100%;
    height: 100%;
}

/* --- Botão de Minimizar (Dentro do Painel) --- */
.btn-minimize {
    position: absolute;
    top: 8px;
    right: 8px;
    z-index: 10;
    background-color: rgba(25, 42, 71, 0.7);
    border: 1px solid #739dce;
    color: #a6c5f7;
    border-radius: 5px;
    padding: 2px 8px;
    font-size: 11px;
    cursor: pointer;
    transition: background-color 0.2s, color 0.2s;
}
.btn-minimize:hover {
    background-color: rgba(49, 83, 138, 1);
    color: #fff;
}

/* --- Estado Minimizado e Botão "Abrir" --- */
#infomenu-minimized-placeholder {
    width: 100%;
    height: 100%;
}
.btn-minimize-restaurar {
    background-color: rgba(49, 83, 138, 0.9);
    border: 1px solid #739dce;
    color: #e0eafc;
    border-radius: 5px;
    padding: 4px 12px;
    font-size: 12px;
    cursor: pointer;
    width: 100px;
    height: 30px;
}
.btn-minimize-restaurar:hover {
    background-color: rgba(69, 103, 158, 1);
}


/* --- Itens do Painel (Caixas de conteúdo) --- */
.panel-item, .panel-item-currency {
    background-color: rgba(25, 42, 71, 0.6);
    border-radius: 6px;
    padding: 8px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.panel-item-header {
    background: rgba(19, 32, 54, 0.7);
    padding: 8px 12px;
}

.item-title {
    font-size: 0.8rem;
    font-weight: 500;
    color: #a6c5f7;
    margin-bottom: 5px;
    display: flex;
    align-items: center;
}

.item-icon {
    width: 16px;
    height: 16px;
    margin-right: 6px;
}

.item-value {
    font-size: 1.1rem;
    font-weight: 600;
    color: #ffffff;
}

.player-nick {
    font-size: 1.1rem;
    font-weight: bold;
}
.player-nick a {
    color: inherit;
    text-decoration: none;
}

.player-rank {
    font-size: 0.9rem;
    color: #fde047;
}

.region-name {
    color: #93c5fd;
    font-weight: bold;
}

/* --- Barra de Progresso (Pokédex) --- */
.progress {
    background-color: #192a47;
}
.progress-bar {
    background-color: #60a5fa;
}

/* --- Moedas (Silver e Gold) --- */
.panel-item-currency {
    flex-direction: row;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    font-weight: bold;
    gap: 8px;
}
.currency-icon {
    width: 20px;
    height: 20px;
}

/* --- Time Pokémon --- */
.pokemon-team {
    background-color: rgba(19, 32, 54, 0.7);
    border-radius: 6px;
    padding: 8px;
    gap: 5px;
}

.pokemon-slot {
    cursor: pointer; 
    width: 100%;
    aspect-ratio: 1 / 1;
    background-color: rgba(25, 42, 71, 0.6);
    border: 1px solid #3b5a8a;
    border-radius: 4px;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: background-color 0.2s;
    padding: 2px; /* Pequeno espaçamento interno */
}
.pokemon-slot:hover {
    background-color: rgba(49, 83, 138, 0.8);
}

/* NOVO SELETOR PARA A IMAGEM/SPRITE */
.pokemon-sprite {
  
    background-size: contain;
    background-position: center;
    background-repeat: no-repeat;
    image-rendering: pixelated;
}

.pokemon-sprite.icon{
  width: 100%;
    height: 100%;
}

.pokemon-sprite.dead {
    filter: grayscale(100%) opacity(50%);
}

.pokemon-slot.empty {
    background-image: url("data:image/svg+xml,%3csvg width='100%25' height='100%25' xmlns='http://www.w3.org/2000/svg'%3e%3crect width='100%25' height='100%25' fill='none' rx='4' ry='4' stroke='%233B5A8AFF' stroke-width='2' stroke-dasharray='4%2c 4' stroke-dashoffset='0' stroke-linecap='square'/%3e%3c/svg%3e" );
    cursor: default;
}


/* ============================================= */
/* == ESTILOS DE COR PARA O MÉRITO (REPRESENTANTE) == */
/* ============================================= */
.representative-box {
    text-align: center;
    border: 1px solid transparent;
    transition: background-color 0.3s, border-color 0.3s;
}

.representative-type {
    text-transform: uppercase;
    font-size: 1rem;
    font-weight: bold;
    text-shadow: 1px 1px 2px rgba(0, 0, 0, 0.7);
}

.type-normal   { background-color: #A8A87855; border-color: #A8A878; }
.type-fire     { background-color: #F0803055; border-color: #F08030; }
.type-water    { background-color: #6890F055; border-color: #6890F0; }
.type-grass    { background-color: #78C85055; border-color: #78C850; }
.type-electric { background-color: #F8D03055; border-color: #F8D030; }
.type-ice      { background-color: #98D8D855; border-color: #98D8D8; }
.type-fighting { background-color: #C0302855; border-color: #C03028; }
.type-poison   { background-color: #A040A055; border-color: #A040A0; }
.type-ground   { background-color: #E0C06855; border-color: #E0C068; }
.type-flying   { background-color: #A890F055; border-color: #A890F0; }
.type-psychic  { background-color: #F8588855; border-color: #F85888; }
.type-bug      { background-color: #A8B82055; border-color: #A8B820; }
.type-rock     { background-color: #B8A03855; border-color: #B8A038; }
.type-ghost    { background-color: #70589855; border-color: #705898; }
.type-dragon   { background-color: #7038F855; border-color: #7038F8; }
.type-dark     { background-color: #70584855; border-color: #705848; }
.type-steel    { background-color: #B8B8D055; border-color: #B8B8D0; }
.type-fairy    { background-color: #EE99AC55; border-color: #EE99AC; }

.type-electric .representative-type,
.type-ice .representative-type,
.type-ground .representative-type,
.type-steel .representative-type,
.type-fairy .representative-type { color: #222; }