/* Temel stiller */
body {
    font-family: 'Inter', sans-serif;
}

/* Header ve navigasyon */
.nav-link {
    @apply text-gray-700 hover:text-primary transition-colors;
}

/* Hero section */
.hero-gradient {
    @apply bg-gradient-to-br from-blue-50 via-white to-green-50;
}

/* Belgeler bölümü */
.document-card {
    @apply group relative cursor-pointer;
}

.document-image {
    @apply aspect-[3/4] rounded-xl overflow-hidden;
}

.document-overlay {
    @apply absolute inset-0 bg-gradient-to-t from-black/60 to-transparent 
           opacity-0 group-hover:opacity-100 transition-opacity duration-300 
           rounded-xl flex items-end p-6;
}

/* Bağış kartları */
.donation-card {
    @apply bg-white/80 backdrop-blur-sm p-6 rounded-xl shadow-sm 
           hover:shadow-md transition-shadow;
}

/* İletişim ikonları */
.contact-icon {
    @apply w-10 h-10 flex items-center justify-center bg-primary/10 rounded-full;
}

/* Sosyal medya ikonları */
.social-icon {
    @apply w-10 h-10 flex items-center justify-center bg-white/10 rounded-full 
           hover:bg-white/20 transition-colors;
}

/* Modal (Açılır Pencere) Stilleri */
#image-modal {
    transition: opacity 0.3s ease, visibility 0.3s ease;
    opacity: 0;
    visibility: hidden;
}

#image-modal.active {
    opacity: 1;
    visibility: visible;
    display: flex;
}

#modal-content img {
    max-width: 100%;
    height: auto;
    border-radius: 0.75rem;
    margin-bottom: 1rem;
    max-height: 60vh;
    object-fit: contain;
}