/* Bridge — alias + ajustes mínimos sobre o CSS legado */

/* Alias usado nas páginas internas ainda em BEM */
.container {
  width: 100%;
  margin-left: auto;
  margin-right: auto;
  padding-left: 1rem;
  padding-right: 1rem;
}

/* Garante que [hidden] vença utilitários Tailwind (ex.: inline-flex) */
[hidden] {
  display: none !important;
}

@media (min-width: 640px) {
  .container { max-width: 640px; }
}

@media (min-width: 768px) {
  .container {
    max-width: 768px;
    padding-left: 2rem;
    padding-right: 2rem;
  }
}

@media (min-width: 1024px) {
  .container { max-width: 1024px; }
}

@media (min-width: 1280px) {
  .container { max-width: 1280px; }
}

@media (min-width: 1536px) {
  .container { max-width: 1536px; }
}

/* Animações: elementos aguardando reveal (como AnimatedElement do legado) */
[data-animate].opacity-0 {
  opacity: 0;
}

@media (prefers-reduced-motion: reduce) {
  [data-animate] {
    opacity: 1 !important;
    transform: none !important;
    animation: none !important;
    transition: none !important;
  }
}

/* Classes dinâmicas de Valores (About) que o purge do legado não gerou */
.bg-green-500\/5 { background-color: rgb(34 197 94 / 0.05); }
.bg-yellow-500\/5 { background-color: rgb(234 179 8 / 0.05); }
.bg-purple-500\/5 { background-color: rgb(168 85 247 / 0.05); }
.bg-green-500\/10 { background-color: rgb(34 197 94 / 0.1); }
.bg-yellow-500\/10 { background-color: rgb(234 179 8 / 0.1); }
.bg-purple-500\/10 { background-color: rgb(168 85 247 / 0.1); }
.border-green-500\/20 { border-color: rgb(34 197 94 / 0.2); }
.border-yellow-500\/20 { border-color: rgb(234 179 8 / 0.2); }
.border-purple-500\/20 { border-color: rgb(168 85 247 / 0.2); }
.text-yellow-500 { color: #eab308; }
.text-purple-500 { color: #a855f7; }
.text-accent { color: rgb(var(--color-accent) / 1); }
.bg-accent\/10 { background-color: rgb(var(--color-accent) / 0.1); }
.hover\:text-secondary\/80:hover { color: rgb(var(--color-secondary) / 0.8); }
.hover\:text-accent\/80:hover { color: rgb(var(--color-accent) / 0.8); }

/* Aspect ratio (plugin do legado não entrou no bundle) */
.aspect-w-16.aspect-h-9 {
  aspect-ratio: 16 / 9;
}

.resize-vertical {
  resize: vertical;
}


.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}