/* Custom styles cho Coin System */

/* Card hover effect */
.card-hover {
    transition: transform 0.2s, box-shadow 0.2s;
}

.card-hover:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(0, 0, 0, 0.1);
}

/* Coin display */
.coin-display {
    font-family: 'Inter', -apple-system, BlinkMacSystemFont, sans-serif;
    font-weight: 700;
    font-variant-numeric: tabular-nums;
}

/* Transaction row animation */
.transaction-row {
    transition: background-color 0.2s;
}

.transaction-row:hover {
    background-color: rgba(59, 130, 246, 0.05);
}

/* Amount colors */
.amount-positive {
    color: #10B981;
}

.amount-negative {
    color: #EF4444;
}

/* Loading spinner */
.spinner {
    border: 3px solid #f3f3f3;
    border-top: 3px solid #3B82F6;
    border-radius: 50%;
    width: 24px;
    height: 24px;
    animation: spin 1s linear infinite;
}

@keyframes spin {
    0% { transform: rotate(0deg); }
    100% { transform: rotate(360deg); }
}

/* Responsive table */
@media (max-width: 640px) {
    .responsive-table {
        display: block;
        overflow-x: auto;
        white-space: nowrap;
    }
}

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

::-webkit-scrollbar-track {
    background: #f1f1f1;
    border-radius: 4px;
}

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

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