/*
 * Ambient background — 3PE Shop
 * Camada visual fixa, atras do painel e nao-interativa.
 * Integracao isolada: nao altera layout, tema, fonte ou componentes.
 * Importe apenas via <link rel="stylesheet" href="/ambient-background.css" />.
 */

:root {
  /* Cor de fallback caso a imagem nao carregue. */
  --ambient-bg-fallback: #0b1116;
}

body::before {
  content: "";
  position: fixed;
  inset: 0;
  /* Atras de todo o conteudo do painel (#root fica acima). */
  z-index: -1;
  /* Nunca bloqueia cliques em textos, tabelas, drawers, modais ou botoes. */
  pointer-events: none;

  background-color: var(--ambient-bg-fallback);
  background-image: url("/assets/background.webp");
  background-position: center;
  background-size: cover;
  background-repeat: no-repeat;

  /*
   * Leve atenuacao apenas para o fundo nao competir com o conteudo. A leitura
   * e garantida pelas superficies opacas/translucidas (cards, sidebar, header
   * com backdrop-blur) que ficam por cima. Nao e um gradiente novo.
   */
  opacity: 0.8;
}

/* Telas menores: mantem o enquadramento no centro, sem gerar scroll. */
@media (max-width: 640px) {
  body::before {
    background-position: center;
    background-size: cover;
  }
}

/* Respeita usuarios que preferem menos movimento (sem animacoes/transicoes). */
@media (prefers-reduced-motion: reduce) {
  body::before {
    animation: none;
    transition: none;
  }
}