/* Custom styles for IBKR website */

/* Smooth transitions */
* {
    transition: all 0.3s ease;
}

/* Button hover effects */
.btn-primary {
    @apply bg-blue-600 text-white px-6 py-3 rounded-lg font-semibold hover:bg-blue-700 transition-colors;
}

.btn-secondary {
    @apply bg-white text-blue-600 px-6 py-3 rounded-lg font-semibold border border-blue-600 hover:bg-blue-50 transition-colors;
}

/* Navigation active state */
.nav-link.active {
    @apply text-blue-600 border-b-2 border-blue-600;
}

/* Card shadows */
.card {
    @apply bg-white rounded-lg shadow-sm hover:shadow-md transition-shadow;
}

/* Form styles */
.form-input {
    @apply w-full px-4 py-2 border border-gray-300 rounded-lg focus:ring-2 focus:ring-blue-500 focus:border-blue-500 outline-none;
}

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

/* Loading states */
.loading {
    opacity: 0.6;
    pointer-events: none;
}

/* Error states */
.error {
    @apply text-red-600 text-sm mt-1;
}

/* Success states */
.success {
    @apply text-green-600 text-sm mt-1;
}

/* Mobile responsive adjustments */
@media (max-width: 768px) {
    .mobile-hidden {
        display: none;
    }
}

/* Animation for dropdown menus */
.dropdown-enter {
    opacity: 0;
    transform: translateY(-10px);
}

.dropdown-enter-active {
    opacity: 1;
    transform: translateY(0);
    transition: opacity 300ms, transform 300ms;
}

.dropdown-exit {
    opacity: 1;
}

.dropdown-exit-active {
    opacity: 0;
    transform: translateY(-10px);
    transition: opacity 300ms, transform 300ms;
}

/* QR Code styling */
.qr-code {
    @apply border border-gray-200 rounded-lg p-2 bg-white;
}

/* Feature icons */
.feature-icon {
    @apply w-12 h-12 rounded-lg flex items-center justify-center mb-4;
}

/* Gradient backgrounds */
.gradient-primary {
    background: linear-gradient(135deg, #3B82F6 0%, #1E40AF 100%);
}

.gradient-secondary {
    background: linear-gradient(135deg, #EFF6FF 0%, #DBEAFE 100%);
}

/* Text gradients */
.text-gradient {
    background: linear-gradient(135deg, #3B82F6 0%, #1E40AF 100%);
    -webkit-background-clip: text;
    -webkit-text-fill-color: transparent;
    background-clip: text;
}

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

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

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

::-webkit-scrollbar-thumb:hover {
    background: #a8a8a8;
}

/* Focus states for accessibility */
.focus-ring {
    @apply focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2;
}

/* Print styles */
@media print {
    .no-print {
        display: none;
    }
}

/* High contrast mode support */
@media (prefers-contrast: high) {
    .card {
        border: 2px solid #000;
    }
}

/* Reduced motion support */
@media (prefers-reduced-motion: reduce) {
    * {
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
        transition-duration: 0.01ms !important;
    }
}