/* 
 * Tailwind CSS Dark Theme Custom Styles
 * Sistema de Controle de Acesso v2.0
 */

/* Base dark theme styles */
.dark {
    color-scheme: dark;
}

/* Custom animations */
@keyframes fadeInUp {
    from {
        opacity: 0;
        transform: translateY(30px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.animate-fadeInUp {
    animation: fadeInUp 0.6s ease-out;
}

/* Card styles for dark theme */
.dark-card {
    @apply bg-gray-800 border border-gray-700 rounded-lg shadow-lg;
}

.dark-card-header {
    @apply bg-gray-700 border-b border-gray-600 px-6 py-4 rounded-t-lg;
}

.dark-card-body {
    @apply p-6;
}

/* Button styles */
.btn-primary-dark {
    @apply bg-blue-600 hover:bg-blue-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 focus:ring-offset-gray-800;
}

.btn-secondary-dark {
    @apply bg-gray-600 hover:bg-gray-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-gray-500 focus:ring-offset-2 focus:ring-offset-gray-800;
}

.btn-success-dark {
    @apply bg-green-600 hover:bg-green-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-green-500 focus:ring-offset-2 focus:ring-offset-gray-800;
}

.btn-danger-dark {
    @apply bg-red-600 hover:bg-red-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-red-500 focus:ring-offset-2 focus:ring-offset-gray-800;
}

.btn-warning-dark {
    @apply bg-yellow-600 hover:bg-yellow-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-yellow-500 focus:ring-offset-2 focus:ring-offset-gray-800;
}

.btn-info-dark {
    @apply bg-cyan-600 hover:bg-cyan-700 text-white font-medium py-2 px-4 rounded-lg transition-colors duration-200 focus:outline-none focus:ring-2 focus:ring-cyan-500 focus:ring-offset-2 focus:ring-offset-gray-800;
}

/* Form styles */
.form-input-dark {
    @apply bg-gray-700 border border-gray-600 text-white placeholder-gray-400 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent;
}

.form-select-dark {
    @apply bg-gray-700 border border-gray-600 text-white rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent;
}

.form-textarea-dark {
    @apply bg-gray-700 border border-gray-600 text-white placeholder-gray-400 rounded-lg px-3 py-2 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:border-transparent resize-y;
}

/* Table styles */
.table-dark {
    @apply w-full text-sm text-left text-gray-300;
}

.table-dark th {
    @apply px-6 py-3 bg-gray-700 text-xs font-medium text-gray-400 uppercase tracking-wider;
}

.table-dark td {
    @apply px-6 py-4 border-b border-gray-700;
}

.table-dark tbody tr:hover {
    @apply bg-gray-700;
}

/* Alert/notification styles */
.alert-success-dark {
    @apply bg-green-100 border border-green-400 text-green-700 px-4 py-3 rounded relative;
}

.alert-error-dark {
    @apply bg-red-100 border border-red-400 text-red-700 px-4 py-3 rounded relative;
}

.alert-warning-dark {
    @apply bg-yellow-100 border border-yellow-400 text-yellow-700 px-4 py-3 rounded relative;
}

.alert-info-dark {
    @apply bg-blue-100 border border-blue-400 text-blue-700 px-4 py-3 rounded relative;
}

/* Badge styles */
.badge-success {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800;
}

.badge-error {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800;
}

.badge-warning {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800;
}

.badge-info {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800;
}

.badge-secondary {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-gray-100 text-gray-800;
}

/* Modal styles */
.modal-dark {
    @apply fixed inset-0 z-50 overflow-y-auto;
}

.modal-overlay {
    @apply fixed inset-0 bg-black bg-opacity-50 transition-opacity;
}

.modal-content-dark {
    @apply bg-gray-800 rounded-lg shadow-xl border border-gray-700;
}

.modal-header-dark {
    @apply px-6 py-4 border-b border-gray-700;
}

.modal-body-dark {
    @apply px-6 py-4;
}

.modal-footer-dark {
    @apply px-6 py-4 border-t border-gray-700;
}

/* Sidebar responsive behavior */
@media (max-width: 1023px) {
    .sidebar-mobile {
        transform: translateX(-100%);
    }
    
    .sidebar-mobile.active {
        transform: translateX(0);
    }
}

/* Loading spinner */
.spinner {
    @apply inline-block w-4 h-4 border-2 border-gray-300 border-t-blue-600 rounded-full animate-spin;
}

/* Scrollbar styles for dark theme */
.dark ::-webkit-scrollbar {
    width: 8px;
}

.dark ::-webkit-scrollbar-track {
    background: #374151;
}

.dark ::-webkit-scrollbar-thumb {
    background: #6b7280;
    border-radius: 4px;
}

.dark ::-webkit-scrollbar-thumb:hover {
    background: #9ca3af;
}

/* Custom focus styles */
.focus-dark:focus {
    @apply outline-none ring-2 ring-blue-500 ring-offset-2 ring-offset-gray-800;
}

/* Utility classes for responsive text */
.text-responsive {
    @apply text-sm sm:text-base lg:text-lg;
}

.heading-responsive {
    @apply text-lg sm:text-xl lg:text-2xl xl:text-3xl;
}

/* Print styles */
@media print {
    .no-print {
        display: none !important;
    }
    
    .print-full-width {
        width: 100% !important;
        margin: 0 !important;
        padding: 0 !important;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .dark {
        --tw-text-opacity: 1;
        color: rgb(255 255 255 / var(--tw-text-opacity));
    }
    
    .dark .bg-gray-800 {
        --tw-bg-opacity: 1;
        background-color: rgb(0 0 0 / var(--tw-bg-opacity));
    }
    
    .dark .border-gray-700 {
        --tw-border-opacity: 1;
        border-color: rgb(255 255 255 / var(--tw-border-opacity));
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    .animate-fadeInUp,
    .transition-colors,
    .transition-transform {
        animation: none !important;
        transition: none !important;
    }
}

/* Custom components for specific SAM v2 features */
.domain-status-active {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800;
}

.domain-status-inactive {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800;
}

.domain-status-pending {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800;
}

.log-level-info {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-blue-100 text-blue-800;
}

.log-level-warning {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-yellow-100 text-yellow-800;
}

.log-level-error {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-red-100 text-red-800;
}

.log-level-success {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium bg-green-100 text-green-800;
}