/* Custom CSS for DermScan */
body {
    font-family: 'Cairo', 'Tajawal', sans-serif;
}

/* Smooth scrolling */
html {
    scroll-behavior: smooth;
}

/* Navigation link smooth scrolling */
.nav-link {
    cursor: pointer;
}

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

.fade-in-up {
    animation: fadeInUp 0.6s ease-out;
}

/* Hover effects */
.hover-scale:hover {
    transform: scale(1.05);
    transition: transform 0.3s ease;
}

/* Gradient backgrounds */
.bg-medical-gradient {
    background: linear-gradient(135deg, #eff6ff 0%, #ffffff 100%);
}

.bg-award-gradient {
    background: linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
}

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

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

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

::-webkit-scrollbar-thumb:hover {
    background: #94a3b8;
}

/* Arabic font improvements */
.font-cairo {
    font-family: 'Cairo', 'Tajawal', sans-serif;
}

/* RTL support improvements */
[dir="rtl"] .space-x-reverse > :not([hidden]) ~ :not([hidden]) {
    --tw-space-x-reverse: 1;
    margin-right: calc(var(--tw-space-x) * var(--tw-space-x-reverse));
    margin-left: calc(var(--tw-space-x) * calc(1 - var(--tw-space-x-reverse)));
}

/* Modal animations */
.modal-enter {
    opacity: 0;
    transform: scale(0.9);
}

.modal-enter-active {
    opacity: 1;
    transform: scale(1);
    transition: opacity 0.3s ease, transform 0.3s ease;
}

.modal-exit {
    opacity: 1;
    transform: scale(1);
}

.modal-exit-active {
    opacity: 0;
    transform: scale(0.9);
    transition: opacity 0.3s ease, transform 0.3s ease;
}