/* CSS para ocultar elementos com permissões por padrão */
[data-permission]:not(.permission-granted),
[data-permissions]:not(.permission-granted),
[data-permissions-all]:not(.permission-granted) {
  display: none !important;
}

/* Classe para mostrar elementos após verificação de permissões */
[data-permission].permission-granted,
[data-permissions].permission-granted,
[data-permissions-all].permission-granted {
  display: block !important;
}

/* Estilos para o indicador de carregamento */
@keyframes fadeIn {
  from { opacity: 0; }
  to { opacity: 1; }
}

.content-loading {
  visibility: hidden;
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.content-visible {
  visibility: visible;
  opacity: 1;
  animation: fadeIn 0.3s ease-in-out;
}

/* Para elementos inline */
button[data-permission].permission-granted,
button[data-permissions].permission-granted,
button[data-permissions-all].permission-granted,
a[data-permission].permission-granted,
a[data-permissions].permission-granted,
a[data-permissions-all].permission-granted,
span[data-permission].permission-granted,
span[data-permissions].permission-granted,
span[data-permissions-all].permission-granted {
  display: inline-block !important;
}

/* Para elementos li na sidebar */
li[data-permission].permission-granted,
li[data-permissions].permission-granted,
li[data-permissions-all].permission-granted {
  display: list-item !important;
}

/* Para elementos flex */
.flex[data-permission].permission-granted,
.flex[data-permissions].permission-granted,
.flex[data-permissions-all].permission-granted {
  display: flex !important;
}

/* Para elementos grid */
.grid[data-permission].permission-granted,
.grid[data-permissions].permission-granted,
.grid[data-permissions-all].permission-granted {
  display: grid !important;
}

/* Para elementos table */
table[data-permission].permission-granted,
table[data-permissions].permission-granted,
table[data-permissions-all].permission-granted {
  display: table !important;
}

tr[data-permission].permission-granted,
tr[data-permissions].permission-granted,
tr[data-permissions-all].permission-granted {
  display: table-row !important;
}

td[data-permission].permission-granted,
td[data-permissions].permission-granted,
td[data-permissions-all].permission-granted,
th[data-permission].permission-granted,
th[data-permissions].permission-granted,
th[data-permissions-all].permission-granted {
  display: table-cell !important;
}