/* ============================================================================
 * aprovacao.css — aviso comum de aprovação entre narradores (core/aprovacao_avisos.js,
 * spec-aprovacao-eventos E3). As peças herdadas do passe (.pva-*: modal obrigatório,
 * relógio, restrito, número/balão do Painel, balão "Entrar como narrador") continuam
 * em passe_fluxo_avisos.css; aqui só o que é novo: o grupo por tipo (D6).
 * O resto do card do Dashboard fica em aprovacao_dashboard.css (outro módulo).
 * ========================================================================== */

/* ---------- grupo por tipo: ÚNICO para o modal e o card "Pedidos para você" (E-6) ----------
 * Marcação:
 *   <section|div class="apv-grupo">
 *     <div class="apv-grupo-tit">
 *       <span class="apv-grupo-ic" aria-hidden="true">🐉</span>
 *       <span class="apv-grupo-nome">Raids</span>
 *       <span class="apv-grupo-n">2</span>
 *     </div>
 *     ...itens...
 *   </section>
 * O espaçamento entre grupos mora só aqui (o card não redefine .apv-grupo + .apv-grupo).
 * Mock: docs/mock-aprovacao-eventos.html (③ grupo por tipo). */
.apv-grupo { position: relative; min-width: 0; }
.apv-grupo + .apv-grupo { margin-top: 12px; padding-top: 12px; border-top: 1px dashed rgba(201, 168, 76, .25); }
.apv-grupo-tit {
    display: flex; align-items: center; gap: 8px; min-width: 0; margin: 0 0 7px;
    font: 700 .78rem 'Cinzel', serif; letter-spacing: .07em; text-transform: uppercase;
    color: var(--gold-light, #f3da9c);
}
.apv-grupo-ic {
    flex: none; width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center;
    font-size: .95rem; line-height: 1; letter-spacing: 0;
    background: #000; border: 1px solid rgba(201, 168, 76, .3);
}
.apv-grupo-nome { min-width: 0; overflow-wrap: anywhere; }
.apv-grupo-n {
    flex: none; display: inline-grid; place-items: center; min-width: 20px; height: 20px; padding: 0 6px;
    border-radius: 999px; background: var(--gold, #c9a84c); border: 1px solid #f3da9c; color: #1a0e08;
    font: 700 .72rem/1 'Lora', serif; font-variant-numeric: tabular-nums; letter-spacing: 0; text-transform: none;
}
html[data-viewport="mobile"] .apv-grupo + .apv-grupo { margin-top: 10px; padding-top: 10px; }