
/* ==================== PROJECT CARDS ==================== */
.project-card {
    height: 100%;
    overflow: hidden;
}

.project-card img {
    transition: transform 0.3s ease;
}

.project-card:hover img {
    transform: scale(1.05);
}

.tech-badge {
    display: inline-block;
    margin: 0.2rem;
}

/* ==================== JOB CARDS ==================== */
.job-card {
    border-left: 4px solid #0d6efd;
    transition: all 0.3s ease;
}

.job-card:hover {
    border-left-width: 8px;
}

.job-header {
    display: flex;
    justify-content: space-between;
    align-items: start;
}

/* ==================== ABOUT PAGE ==================== */
.profile-card {
    text-align: center;
    position: sticky;
    top: 20px;
}

.profile-image {
    width: 100%;
    max-height: 300px;
    object-fit: cover;
    background-color: #2a2a2a;
    border-radius: 20px;
}


.social-links a {
    transition: all 0.3s ease;
}

.social-links a:hover {
    transform: scale(1.1);
}

.education-item {
    position: relative;
    padding-left: 2rem;
    border-left: 2px solid #0d6efd;
}

.education-item::before {
    content: '';
    position: absolute;
    left: -6px;
    top: 5px;
    width: 12px;
    height: 12px;
    border-radius: 50%;
    background-color: #0d6efd;
}

/* ==================== DETAILS PAGE ==================== */
.details-page .card {
    max-width: 1000px;
    margin: 2rem auto;
}

.image-container {
    position: relative;
    overflow: hidden;
    border-radius: 10px;
}

.image-container img {
    transition: transform 0.3s ease;
}

.image-container:hover img {
    transform: scale(1.05);
}

/* ==================== ANIMATIONS FOR PUBLIC PAGES ==================== */
@keyframes slideIn {
    from {
        opacity: 0;
        transform: translateX(-30px);
    }
    to {
        opacity: 1;
        transform: translateX(0);
    }
}

.job-card, .project-card {
    animation: slideIn 0.5s ease;
}

/* ==================== RESPONSIVE (MOBİL İYİLEŞTİRMELERİ) ==================== */

/* Tablet ve daha küçük ekranlar */
@media (max-width: 991px) {
    .profile-card {
        position: static; /* Sticky'yi kaldır */
        margin-bottom: 2rem;
    }
    
    .profile-image {
        max-height: 250px; /* Biraz daha küçült */
    }
}

/* Mobil cihazlar */
@media (max-width: 768px) {
    .welcome-section h1 {
        font-size: 2.5rem;
    }
    
    /* Profil kartı mobilde küçük ve şık */
    .profile-card {
        padding: 1rem;
    }
    
    /* Profil fotoğrafı container'ı */
    .profile-card .d-flex {
        padding: 0.5rem !important;
    }
    
    /* Profil fotoğrafı küçült */
    .profile-card .d-flex > div {
        width: 200px !important;
        height: 200px !important;
    }
    
    .profile-image {
        max-height: 200px;
    }
    
    /* Sosyal medya butonları daha kompakt */
    .social-links .btn {
        font-size: 0.85rem;
        padding: 0.4rem 0.8rem;
    }
}

/* Çok küçük mobil cihazlar */
@media (max-width: 480px) {
    .welcome-section h1 {
        font-size: 2rem;
    }
    
    /* Profil fotoğrafı daha da küçült */
    .profile-card .d-flex > div {
        width: 180px !important;
        height: 180px !important;
    }
    
    .profile-image {
        max-height: 180px;
    }
    
    /* Profil kartı padding'i azalt */
    .profile-card .card-body {
        padding: 1rem !important;
    }
    
    /* İsim ve unvan font boyutları */
    .profile-card .card-title {
        font-size: 1.5rem !important;
    }
    
    .profile-card .text-white {
        font-size: 0.95rem !important;
    }
    
    /* İletişim bilgileri */
    .profile-card p {
        font-size: 0.9rem;
    }
    
    /* Sosyal medya butonları tek sütun */
    .social-links {
        flex-direction: column !important;
        gap: 0.5rem !important;
    }
    
    .social-links .btn {
        width: 100%;
    }
}