/* Estilos globais para o TL AI */

/* Variáveis de cores */
:root {
    --primary: #D4AF37; /* Gold */
    --secondary: #1F2937; /* Dark Gray */
    --background: #F9FAFB; /* Light Gray */
    --success: #10B981; /* Green */
    --warning: #F59E0B; /* Amber */
    --danger: #EF4444; /* Red */
    --info: #3B82F6; /* Blue */
}

/* Estilos de Cartões */
.card {
    @apply bg-white p-6 rounded-lg shadow-md border-l-4 border-gold;
}

/* Botões */
.btn-gold {
    @apply bg-gradient-to-r from-gold to-yellow-500 text-white font-semibold py-2 px-4 rounded-md shadow hover:shadow-lg hover:from-yellow-500 hover:to-gold transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-gold focus:ring-opacity-50;
}

.btn-secondary {
    @apply bg-secondary text-white font-semibold py-2 px-4 rounded-md shadow hover:bg-gray-800 transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-secondary focus:ring-opacity-50;
}

.btn-outline-gold {
    @apply border-2 border-gold text-gold font-semibold py-2 px-4 rounded-md hover:bg-gold hover:text-white transition-all duration-200 focus:outline-none focus:ring-2 focus:ring-gold focus:ring-opacity-50;
}

/* Inputs */
.input-styled {
    @apply mt-1 block w-full px-3 py-2 bg-white border border-gray-300 rounded-md shadow-sm focus:outline-none focus:ring-2 focus:ring-gold focus:ring-opacity-50 focus:border-gold;
}

/* Logo */
.logo-container {
    background: radial-gradient(circle at center, #000000 60%, #1a1a1a 100%);
}

.logo-shadow {
    filter: drop-shadow(0 0 10px rgba(212, 175, 55, 0.3));
}

/* Animações */
.animate-fadeIn {
    animation: fadeIn 0.5s ease-in-out;
}

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

/* Status tags */
.status-tag {
    @apply px-2 py-1 text-xs font-semibold rounded-full;
}

.status-pending {
    @apply bg-gray-100 text-gray-800;
}

.status-processing {
    @apply bg-blue-100 text-blue-800;
}

.status-success {
    @apply bg-green-100 text-green-800;
}

.status-error {
    @apply bg-red-100 text-red-800;
}

/* Dashboard-specific styles */
.stat-card {
    @apply bg-white rounded-lg shadow-md p-4 flex flex-col;
}

.stat-card h3 {
    @apply text-gray-500 text-sm font-medium mb-2;
}

.stat-card p {
    @apply text-2xl font-bold text-secondary;
}

/* Timeline styles */
.timeline {
    @apply relative pl-8 border-l border-gray-200;
}

.timeline-item {
    @apply mb-6 relative;
}

.timeline-item::before {
    content: '';
    @apply absolute w-4 h-4 bg-gold rounded-full -left-10 border-4 border-white;
}

/* Responsive utilities */
@media (max-width: 640px) {
    .mobile-hide {
        display: none;
    }
}