/* Fundo Gear 5 — vídeo global (otimizado p/ GPU, mesma resolução) */
.dx-gear5-bg {
  position: fixed !important;
  inset: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  z-index: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
  background: #0a0610 !important;
  contain: paint;
}

.dx-gear5-bg .dx-gear5-media {
  position: absolute !important;
  inset: 0 !important;
  width: 100% !important;
  height: 100% !important;
  object-fit: cover !important;
  display: block !important;
  z-index: 1 !important;
  opacity: 0;
  /* sem transition — evita composição extra na GPU */
  transform: translateZ(0);
  backface-visibility: hidden;
}

.dx-gear5-bg .dx-gear5-media.is-ready {
  opacity: 1;
}

.dx-gear5-bg.is-paused .dx-gear5-media {
  /* frame congelado: browser para decode */
}

.dx-gear5-bg .dx-gear5-veil {
  position: absolute !important;
  inset: 0 !important;
  z-index: 2 !important;
  /* overlay simples (sem blur / sem radial caro) */
  background: rgba(5, 4, 8, 0.28) !important;
  pointer-events: none !important;
}

/* Só na tela de login (sem admin-layout): mantém o card no centro */
body.dx-has-gear5:has(> .login-container):not(:has(.admin-layout)) {
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
}

html.dx-has-gear5,
html.dx-has-gear5 body,
body.dx-has-gear5 {
  background: transparent !important;
  background-image: none !important;
  background-color: transparent !important;
}

body.dx-has-gear5::before,
body.dx-has-gear5::after {
  display: none !important;
  content: none !important;
  background: none !important;
}

body.dx-has-gear5 .admin-layout,
body.dx-has-gear5 .main-content,
body.dx-has-gear5 .login-container,
body.dx-has-gear5 .content-area,
body.dx-has-gear5 .header,
body.dx-has-gear5 .container {
  position: relative;
  z-index: 2;
}

/* Particles: desliga — animação CSS + vídeo = GPU quente */
body.dx-has-gear5 .particles {
  display: none !important;
}

body.dx-has-gear5 .admin-layout {
  background: transparent !important;
}

/* SEM backdrop-filter (blur na GPU é o maior vilão com vídeo atrás) */
body.dx-has-gear5 .sidebar {
  background: rgba(8, 8, 12, 0.88) !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.dx-has-gear5 .main-content,
body.dx-has-gear5 .content-area {
  background: transparent !important;
}

body.dx-has-gear5 .topbar {
  background: rgba(8, 8, 12, 0.9) !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.dx-has-gear5 .card,
body.dx-has-gear5 .stat-card,
body.dx-has-gear5 .panel,
body.dx-has-gear5 .dashboard-card,
body.dx-has-gear5 .fade-in-up,
body.dx-has-gear5 .info-card,
body.dx-has-gear5 .table-responsive,
body.dx-has-gear5 .table-container,
body.dx-has-gear5 .keys-table-wrap,
body.dx-has-gear5 .section-card,
body.dx-has-gear5 .box,
body.dx-has-gear5 .well,
body.dx-has-gear5 .quick-actions .btn,
body.dx-has-gear5 .action-card {
  background: rgba(12, 12, 16, 0.9) !important;
  background-image: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.dx-has-gear5 .login-container {
  margin: 0 auto !important;
  flex-shrink: 0 !important;
  background: rgba(14, 14, 18, 0.92) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

body.dx-has-gear5 .header {
  background: rgba(10, 10, 14, 0.9) !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

/* Modais: NÃO igualar z-index do modal e do backdrop (cobre o conteúdo).
   Deixa o dream-admin.css cuidar (modal 10500 > backdrop 10400). */