/* BRC-20 Overdrive Custom Styles */

/* Custom scrollbar */
::-webkit-scrollbar {
    width: 8px;
}

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

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

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

/* Navigation styles */
.nav-link {
    @apply text-gray-300 hover:text-white px-3 py-2 rounded-md text-sm font-medium transition-colors;
}

.nav-link.active {
    @apply text-orange-500 bg-gray-700;
}

/* Section visibility */
.section {
    display: none;
}

.section.active {
    display: block;
}

/* Button styles */
.btn-primary {
    @apply bg-orange-600 hover:bg-orange-700 text-white font-medium py-2 px-4 rounded-lg transition-colors;
}

.btn-secondary {
    @apply bg-gray-700 hover:bg-gray-600 text-white font-medium py-2 px-4 rounded-lg transition-colors;
}

.btn-danger {
    @apply bg-red-600 hover:bg-red-700 text-white font-medium py-2 px-4 rounded-lg transition-colors;
}

/* Status badges */
.status-badge {
    @apply inline-flex items-center px-2.5 py-0.5 rounded-full text-xs font-medium;
}

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

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

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

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

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

/* Token card styles */
.token-card {
    @apply bg-gray-800 rounded-lg p-4 border border-gray-700 hover:border-gray-600 transition-colors cursor-pointer;
}

.token-card:hover {
    @apply transform scale-105;
}

/* Form styles */
.form-input {
    @apply w-full bg-gray-700 text-white px-4 py-2 rounded-lg border border-gray-600 focus:border-orange-500 focus:outline-none transition-colors;
}

.form-label {
    @apply block text-sm font-medium text-gray-300 mb-2;
}

/* Table styles */
.table-header {
    @apply px-6 py-3 text-left text-xs font-medium text-gray-300 uppercase tracking-wider;
}

.table-cell {
    @apply px-6 py-4 whitespace-nowrap text-sm text-gray-300;
}

/* Loading animations */
@keyframes pulse {
    0%, 100% {
        opacity: 1;
    }
    50% {
        opacity: 0.5;
    }
}

.animate-pulse {
    animation: pulse 2s cubic-bezier(0.4, 0, 0.6, 1) infinite;
}

@keyframes spin {
    to {
        transform: rotate(360deg);
    }
}

.animate-spin {
    animation: spin 1s linear infinite;
}

/* Toast notifications */
.toast {
    @apply bg-gray-800 border border-gray-700 rounded-lg p-4 shadow-lg max-w-sm;
    animation: slideIn 0.3s ease-out;
}

.toast-success {
    @apply border-green-500;
}

.toast-error {
    @apply border-red-500;
}

.toast-warning {
    @apply border-yellow-500;
}

.toast-info {
    @apply border-blue-500;
}

@keyframes slideIn {
    from {
        transform: translateX(100%);
        opacity: 0;
    }
    to {
        transform: translateX(0);
        opacity: 1;
    }
}

/* Responsive design */
@media (max-width: 768px) {
    .nav-link {
        @apply text-sm px-2 py-1;
    }
    
    .token-card {
        @apply p-3;
    }
    
    .table-cell {
        @apply px-3 py-2 text-xs;
    }
}

/* Dark mode enhancements */
.dark {
    color-scheme: dark;
}

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

/* Utility classes */
.text-gradient {
    background: linear-gradient(135deg, #f97316, #ea580c);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

.bg-gradient {
    background: linear-gradient(135deg, #1f2937, #111827);
}

.border-gradient {
    border-image: linear-gradient(135deg, #f97316, #ea580c) 1;
}

/* Animation for page transitions */
.page-transition {
    animation: fadeIn 0.3s ease-in-out;
}

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

/* Custom checkbox and radio styles */
input[type="checkbox"], input[type="radio"] {
    @apply w-4 h-4 text-orange-600 bg-gray-700 border-gray-600 rounded focus:ring-orange-500 focus:ring-2;
}

/* Custom select styles */
select {
    @apply bg-gray-700 text-white border-gray-600 rounded-lg focus:border-orange-500 focus:outline-none;
}

/* Loading skeleton */
.skeleton {
    @apply animate-pulse bg-gray-700 rounded;
}

.skeleton-text {
    @apply h-4 bg-gray-700 rounded;
}

.skeleton-avatar {
    @apply w-10 h-10 bg-gray-700 rounded-full;
}

/* Hover effects */
.hover-lift {
    @apply transition-transform duration-200 hover:scale-105;
}

.hover-glow {
    @apply transition-shadow duration-200 hover:shadow-lg hover:shadow-orange-500/25;
}

/* Custom scrollbar for specific elements */
.custom-scrollbar {
    scrollbar-width: thin;
    scrollbar-color: #6b7280 #374151;
}

.custom-scrollbar::-webkit-scrollbar {
    width: 6px;
}

.custom-scrollbar::-webkit-scrollbar-track {
    background: #374151;
    border-radius: 3px;
}

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

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