/* ==========================================================================
   AXIONMESK — Item "Painel Admin" no menu Mais
   Destaque sutil: borda dourada e brilho, para diferenciar de ações comuns.
   ========================================================================== */

.cm-admin-item {
  position: relative !important;
  border-color: rgba(56,107,255, .34) !important;
  background:
    linear-gradient(168deg, rgba(56,107,255, .13), rgba(56,107,255, .04)) !important;
}

.cm-admin-item .mais-item__icon {
  background: rgba(56,107,255, .16) !important;
  color: #386BFF !important;
  box-shadow: 0 0 0 1px rgba(56,107,255, .26) inset !important;
}

.cm-admin-item .mais-item__label {
  color: #386BFF !important;
}

.cm-admin-item:active {
  background:
    linear-gradient(168deg, rgba(56,107,255, .22), rgba(56,107,255, .08)) !important;
  transform: scale(.965) !important;
}

/* o selo ADMIN não deve ser lido por leitores de tela duas vezes */
.cm-admin-dot { pointer-events: none; }

@media (prefers-reduced-motion: reduce) {
  .cm-admin-item:active { transform: none !important; }
}

/* ==========================================================================
   POSICIONAMENTO NA GRADE (3 colunas)

   Sem ajuste, o 10º item caía sozinho numa 4ª linha (visto no print).
   Melhor: o "Painel Admin" ocupa as 3 colunas da última linha, virando
   um botão largo — destaque apropriado para uma área de administração.
   ========================================================================== */
@media (max-width: 900px) {
  .mais-grid > .cm-admin-item {
    grid-column: 1 / -1 !important;
    flex-direction: row !important;
    justify-content: flex-start !important;
    align-items: center !important;
    gap: 12px !important;
    min-height: 62px !important;
    padding: 10px 14px !important;
    border-radius: 14px !important;
  }

  .mais-grid > .cm-admin-item .mais-item__icon {
    width: 38px !important;
    height: 38px !important;
    flex: 0 0 38px !important;
    border-radius: 11px !important;
  }

  .mais-grid > .cm-admin-item .mais-item__icon svg {
    width: 19px !important;
    height: 19px !important;
  }

  .mais-grid > .cm-admin-item .mais-item__label {
    font-size: 13px !important;
    font-weight: 800 !important;
    text-align: left !important;
    letter-spacing: -.01em !important;
  }

  /* o selo ADMIN fica à direita, como um chip */
  .mais-grid > .cm-admin-item .cm-admin-dot {
    position: static !important;
    margin-left: auto !important;
    font-size: 8px !important;
    padding: 3px 6px !important;
    border-radius: 5px !important;
  }

  /* seta indicando navegação */
  .mais-grid > .cm-admin-item::after {
    content: "›";
    margin-left: 6px;
    font-size: 18px;
    font-weight: 700;
    color: rgba(56,107,255, .75);
    line-height: 1;
  }
}

/* telas muito estreitas: mantém o formato largo, com fonte menor */
@media (max-width: 380px) {
  .mais-grid > .cm-admin-item { min-height: 58px !important; padding: 9px 12px !important; }
  .mais-grid > .cm-admin-item .mais-item__label { font-size: 12.5px !important; }
}