﻿/* Onboarding Stilleri */
.onboarding-progress .progress {
    border-radius: 10px;
    overflow: hidden;
}

.onboarding-progress .progress-bar {
    transition: width 0.6s ease;
}

/* Badge animasyonu */
.badge-item {
    transition: transform 0.2s ease;
}

    .badge-item:hover {
        transform: scale(1.1);
    }

/* Feature Card */
.feature-card {
    cursor: pointer;
}

    .feature-card .card-body {
        display: flex;
        flex-direction: column;
        height: 100%;
    }

    .feature-card .btn {
        margin-top: auto;
    }

/* Mini Onboarding Reminder */
.mini-onboarding-reminder .progress {
    background-color: rgba(255, 193, 7, 0.2);
}

/* KPI Card Hover */
.card-animate:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
}

/* Welcome Card Gradient */
.welcome-card {
    background: linear-gradient(135deg, var(--vz-primary) 0%, #364574 100%);
}

/* Responsive adjustments */
@media (max-width: 768px) {
    .feature-card {
        margin-bottom: 1rem;
    }

    .onboarding-checklist .nav-link {
        padding: 0.5rem;
        font-size: 12px;
    }

    .onboarding-checklist .number {
        width: 28px;
        height: 28px;
        font-size: 12px;
    }
}

/* Gamification Level Colors */
.level-beginner {
    color: #3577f1;
}

.level-explorer {
    color: #0ab39c;
}

.level-expert {
    color: #f7b84b;
}

/* Coming Soon Card */
.feature-card.coming-soon::before {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: repeating-linear-gradient( 45deg, transparent, transparent 10px, rgba(0,0,0,0.02) 10px, rgba(0,0,0,0.02) 20px );
    pointer-events: none;
    border-radius: inherit;
}
