/* ============================================================
   AprovAKI — Hotfix UI/UX v6 (2026-07-19)
   Arquivo ADITIVO. Carregue DEPOIS de aki_uiux_v5.css.
   Escopo:
   1. Chip "moeda + X pts" do dropdown do userchip agora fica
      REALMENTE pequeno e limpo (estilo Brainly): sem fundo
      lilás, ícone 12 px, tipografia .75rem.
   2. Balão de contexto (tooltip do glossário) também abre ao
      clicar/hover na pontuação — explica o que é AKIcoin.
   3. Ranking Top 50: quando o aluno logado aparece na LISTA
      (Top 50), o card grande "Seu placar" acima do pódio é
      totalmente ocultado, evitando qualquer duplicidade.
   4. Bandeirinha de denúncia do #4 em diante ainda menor
      (18 px), ancorada dentro do card sem invadir o layout.
   ============================================================ */

/* ---------------------------------------------------------
   1. Chip de AKIcoins no dropdown do userchip — versão final,
   compacta e limpa. Sobrescreve as regras antigas de
   aki_ui_extra.css que ainda pintavam a pill de lilás.
   --------------------------------------------------------- */
.aki-userchip .aki-userchip__head-coins,
.aki-userchip__head-coins.aki-coin-chip {
    background: transparent !important;
    border: 0 !important;
    padding: 0 !important;
    margin: 2px 0 0 !important;
    gap: 4px !important;
    font-size: .74rem !important;
    line-height: 1.2 !important;
    letter-spacing: 0 !important;
    box-shadow: none !important;
    color: #2D2464 !important;
    display: inline-flex !important;
    align-items: center !important;
    max-width: none !important;
    white-space: nowrap;
    cursor: help;
    outline: none;
}
.aki-userchip .aki-userchip__head-coins:hover,
.aki-userchip .aki-userchip__head-coins:focus-visible,
.aki-userchip .aki-userchip__head-coins:active {
    background: transparent !important;
    border-color: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    filter: none !important;
    outline: none !important;
}
.aki-userchip .aki-userchip__head-coins strong,
.aki-userchip .aki-userchip__head-coins [data-aki-pontos-head] {
    font-weight: 900 !important;
    font-size: .78rem !important;
    color: #2D2464 !important;
}
.aki-userchip .aki-userchip__head-coins span:last-child {
    color: #7c7691 !important;
    font-weight: 700 !important;
    font-size: .72rem !important;
}

/* Ícone da moeda — pequenininho tipo Brainly (12px). Removemos
   o disco colorido de fundo e o mix-blend-mode que deixava a
   moeda "gorda" no fundo lilás. */
.aki-userchip .aki-userchip__coin--mini,
.aki-userchip__coin--mini {
    width: 12px !important;
    height: 12px !important;
    flex: 0 0 12px !important;
    background: transparent !important;
    border-radius: 50% !important;
    box-shadow: none !important;
    overflow: visible !important;
    color: inherit !important;
}
.aki-userchip .aki-userchip__coin--mini img,
.aki-userchip__coin--mini img {
    width: 100% !important;
    height: 100% !important;
    object-fit: contain !important;
    mix-blend-mode: normal !important;
    opacity: 1 !important;
    display: block !important;
}
/* Se o PNG faltar, cai para um "A" dourado igual ao Brainly,
   mas em disco pequeno neutro. */
.aki-userchip .aki-userchip__coin--mini.is-fallback {
    background: #F4C24A !important;
    color: #fff !important;
    border-radius: 50% !important;
    line-height: 12px !important;
    font-weight: 900 !important;
    font-size: 9px !important;
    text-align: center;
}
.aki-userchip .aki-userchip__coin--mini.is-fallback::before {
    content: "A";
}

/* ---------------------------------------------------------
   2. Balão de contexto na pontuação. O header.php v12 injeta
   data-aki-glossario no chip, e a mesma engine já usada em
   "Bronze · Aprendiz" (aki_tooltip.js) abre um popover claro
   com título + explicação curta.
   --------------------------------------------------------- */
[data-aki-glossario].aki-userchip__head-coins {
    position: relative;
}
/* Trava o tamanho do balão para não estourar o dropdown. */
.aki-glossario-popover,
[data-aki-tooltip]::after,
[data-aki-glossario]::after {
    max-width: 240px;
}

/* ---------------------------------------------------------
   3. Ranking Top 50 — quando o aluno está na lista (não só
   no pódio), esconder o card "Seu placar" acima do pódio.
   O ranking.php v6 aplica a classe .ranking-you--oculto no
   próprio elemento. Este CSS garante o hide mesmo em cache.
   --------------------------------------------------------- */
.ranking-you--oculto {
    display: none !important;
}

/* ---------------------------------------------------------
   4. Botão Denunciar no Top 50 — versão final: ainda menor
   (18 px), ancorado dentro do card à direita das estatísticas,
   nunca fora do card. Mantém o hover suave em cor de alerta.
   --------------------------------------------------------- */
.ranking-row .aki-denunciar-btn {
    width: 20px !important;
    height: 20px !important;
    top: 50% !important;
    right: 8px !important;
    transform: translateY(-50%) !important;
    background: transparent !important;
    border: 1px solid transparent !important;
    color: #b1abc7 !important;
    box-shadow: none !important;
    opacity: .45;
    z-index: 3;
    transition: opacity .15s ease, color .15s ease, background .15s ease, border-color .15s ease;
}
.ranking-row .aki-denunciar-btn i {
    font-size: 11px !important;
}
.ranking-row:hover .aki-denunciar-btn {
    opacity: .9;
}
.ranking-row .aki-denunciar-btn:hover,
.ranking-row .aki-denunciar-btn:focus-visible {
    background: #fdecec !important;
    border-color: #f5c1c1 !important;
    color: #b42323 !important;
    opacity: 1 !important;
    transform: translateY(-50%) scale(1.06) !important;
    outline: none !important;
}
@media (max-width: 640px) {
    .ranking-row {
        padding-right: 30px !important;
    }
    .ranking-row .aki-denunciar-btn {
        width: 18px !important;
        height: 18px !important;
        right: 6px !important;
    }
    .ranking-row .aki-denunciar-btn i {
        font-size: 10px !important;
    }
}

/* Pódio: ainda um pouco mais compacto para não competir
   com a medalha numerada do topo esquerdo. */
.podium-card .aki-denunciar-btn {
    width: 22px !important;
    height: 22px !important;
    top: 10px !important;
    right: 10px !important;
    background: rgba(255, 255, 255, 0.9) !important;
    border: 1px solid #ece7fa !important;
    color: #8f8ab0 !important;
    opacity: .8;
}
.podium-card .aki-denunciar-btn i {
    font-size: 12px !important;
}
.podium-card:hover .aki-denunciar-btn {
    opacity: 1;
}
