/* Estilos complementares à Tailwind para detalhes específicos da identidade visual */

body {
  background-color: #050608;
  font-size: 18px; /* aumenta de forma mais perceptível o tamanho base da fonte */
}

.bg-copakart-red {
  background-color: #D62828;
}

.text-copakart-red {
  color: #D62828;
}

.bg-copakart-beige {
  background-color: #FBEED7;
}

.text-copakart-beige {
  color: #FBEED7;
}

.bg-copakart-dark {
  background-color: #121212;
}

.flag-pattern {
  background-image: linear-gradient(45deg, #050608 25%, transparent 25%),
    linear-gradient(-45deg, #050608 25%, transparent 25%),
    linear-gradient(45deg, transparent 75%, #050608 75%),
    linear-gradient(-45deg, transparent 75%, #050608 75%);
  background-size: 20px 20px;
  background-position: 0 0, 0 10px, 10px -10px, -10px 0px;
}

.diagonal-stripes {
  background-image: repeating-linear-gradient(
    -45deg,
    rgba(246, 246, 246, 0.05),
    rgba(246, 246, 246, 0.05) 10px,
    transparent 10px,
    transparent 20px
  );
}

.card {
  border-radius: 0.75rem;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.4);
}

.glass-panel {
  background: linear-gradient(135deg, rgba(5, 6, 8, 0.85), rgba(18, 18, 18, 0.9));
  backdrop-filter: blur(14px);
  border: 1px solid rgba(251, 238, 215, 0.12);
}

.timeline-dot {
  box-shadow: 0 0 0 2px #050608, 0 0 0 4px #d62828;
}

/* Animação de shimmer/brilho para efeito moderno */
@keyframes shimmer {
  0% {
    transform: translateX(-100%) skewX(-12deg);
  }
  100% {
    transform: translateX(200%) skewX(-12deg);
  }
}

.animate-shimmer {
  animation: shimmer 3s infinite;
}