/* Premium UI Design System - Emerald Green Theme */
:root {
    --primary: #10b981;
    --primary-hover: #059669;
    --secondary: #065f46;
    --background: #f0fdf4;
    --surface: #ffffff;
    --on-background: #064e3b;
    --on-surface-variant: #374151;
    --outline-variant: #d1fae5;
    --secondary-fixed: #d1fae5;
    --transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}

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

@keyframes pulse-subtle {
    0%, 100% { transform: scale(1); }
    50% { transform: scale(1.02); }
}

.animate-fade-in {
    animation: fadeIn 0.5s ease-out forwards;
}

.dropzone-active {
    border-color: var(--primary);
    background-color: rgba(0, 74, 198, 0.05);
    transform: scale(1.01);
}

/* Glassmorphism effects */
.glass-card {
    background: rgba(255, 255, 255, 0.8);
    backdrop-filter: blur(10px);
    border: 1px solid rgba(255, 255, 255, 0.2);
}

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

::-webkit-scrollbar-track {
    background: var(--background);
}

::-webkit-scrollbar-thumb {
    background: var(--outline-variant);
    border-radius: 4px;
}

::-webkit-scrollbar-thumb:hover {
    background: var(--on-surface-variant);
}

/* Loading Spinner */
.loader {
    width: 48px;
    height: 48px;
    border: 5px solid var(--secondary-fixed);
    border-bottom-color: var(--primary);
    border-radius: 50%;
    display: inline-block;
    box-sizing: border-box;
    animation: rotation 1s linear infinite;
}

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

.vertical-text {
    writing-mode: vertical-rl;
    text-orientation: mixed;
    transform: rotate(180deg);
}