body {
    background-color: #121212;
    /* Fundo escuro principal */
    color: #e4e6eb;
    /* Cor do texto padrão */
    padding: 0px;
    padding-top: 100px;
}

.card {
    background-color: #1e1e1e;
    /* Fundo do card ligeiramente mais claro que o body */
    border: none;
    border-radius: 10px;
    /* Sombra adaptada para superfícies escuras */
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.4);
    margin-bottom: 20px;
    overflow: hidden;
}

.card-img {
    width: 100%;
    height: 200px;
    object-fit: cover;
}

.card-info {
    padding: 1rem;
}

.card-title {
    color: #ffffff;
    /* Título em destaque */
    font-size: 1.25rem;
    font-weight: 600;
    margin-bottom: 0.5rem;
}

.card-text {
    margin-bottom: 1rem;
    font-size: 0.95rem;
    color: #b0b3b8;
    /* Texto secundário legível no escuro */
    flex-grow: 1;
}

.badge {
    font-size: 0.85rem;
    margin-right: 0.5rem;
}

/* Garante que as caixas de "Sem imagem" e o container do Prompt 
   que usavam a classe Bootstrap 'bg-light' também fiquem escuras
*/
.bg-light {
    background-color: #2a2a2a !important;
    color: #e4e6eb !important;
}

/* Mantém os textos de suporte (como o prompt em itálico) visíveis */
.text-muted {
    color: #a0a0a0 !important;
}

.cursor-pointer {
    cursor: pointer;
}

/* Make image take 50% width on medium+ screens, full width on small */
@media (min-width: 768px) {
    .card-row {
        flex-direction: row;
    }

    .card-col-img {
        flex: 0 0 50%;
        max-width: 50%;
    }

    .card-col-info {
        flex: 0 0 50%;
        max-width: 50%;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }

    .card-img {
        height: 100%;
    }
}

/* Estilos premium para a HomeView e micro-animações */
.bg-gradient-hero {
    background: linear-gradient(135deg, #1e1b4b 0%, #311042 50%, #0f172a 100%);
    border: 1px solid rgba(255, 255, 255, 0.05);
}

.transition-hover {
    transition: transform 0.2s ease-in-out, box-shadow 0.2s ease-in-out, border-color 0.2s ease-in-out;
}

.transition-hover:hover {
    transform: translateY(-5px);
    box-shadow: 0 10px 20px rgba(0, 0, 0, 0.5) !important;
    border-color: rgba(13, 110, 253, 0.25) !important;
}

.fw-extrabold {
    font-weight: 800;
}

@keyframes fadeIn {
    from {
        opacity: 0;
        transform: translateY(10px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fade-in {
    animation: fadeIn 0.5s ease-out forwards;
}
.modal-dialog.modal-xl {
    max-width: 1400px;
}

.card-detail-image {
    max-height: 80vh;
    object-fit: contain;
}

/* Base da Badge Minimalista com Fundo Destacado */
.badge-minimal {
  display: inline-flex;
  align-items: center;
  padding: 0.2rem 0.5rem;       /* Padding sutil para dar respiro ao fundo */
  font-size: 0.80rem;           /* Tamanho micro mantido (aprox. 10px) */
  font-weight: 600;             /* Peso da fonte levemente aumentado para legibilidade */
  letter-spacing: 0.03em;
  border-radius: 4px;           /* Cantos retos e limpos */
  border: none;                 /* Remove a borda para o foco ser 100% no fundo */
}

/* Variação Azul (Elemento) - Fundo visível, texto contrastante */
.badge-min-primary {
  color: #0d6efd;
  background: rgba(13, 110, 253, 0.15); /* Fundo colorido sutil, mas bem visível */
}

/* Variação Cinza (Raça) - Perfeito para o tema escuro */
.badge-min-secondary {
  color: #adb5bd;
  background: rgba(255, 255, 255, 0.1); /* Fundo cinza nítido sobre o card escuro */
}

/* Variação Ciano (Estilo de Arte) */
.badge-min-info {
  color: #0dcaf0;
  background: rgba(13, 202, 240, 0.15); /* Fundo ciano perceptível */
}