/* =============================== */
/*   STYLE CARTE VERROUILLÉE      */
/* =============================== */

.culture-card.locked {
    position: relative;
    opacity: 0.7;
    pointer-events: none;
    cursor: not-allowed;
    filter: grayscale(50%);
}

/* Overlay sombre sur la carte */
.culture-card.locked::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    background: linear-gradient(135deg, rgba(0, 0, 0, 0.4), rgba(0, 0, 0, 0.6));
    z-index: 5;
    border-radius: 12px;
}

/* Icône cadenas au centre */
.culture-card.locked::after {
    content: "🔒";
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    font-size: 4rem;
    z-index: 10;
    text-shadow: 0 2px 8px rgba(0, 0, 0, 0.5);
    animation: lockPulse 2s ease-in-out infinite;
}

/* Badge "Bientôt disponible" */
.culture-card.locked .culture-card-content::before {
    content: "Bientôt disponible";
    position: absolute;
    top: 12px;
    right: 12px;
    background: rgba(255, 255, 255, 0.9);
    color: #555;
    padding: 4px 12px;
    border-radius: 20px;
    font-size: 0.75rem;
    font-weight: 600;
    z-index: 15;
    box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
}

/* Animation du cadenas */
@keyframes lockPulse {
    0%, 100% {
        transform: translate(-50%, -50%) scale(1);
        opacity: 0.9;
    }
    50% {
        transform: translate(-50%, -50%) scale(1.1);
        opacity: 1;
    }
}

/* Désactiver le hover sur les cartes verrouillées */
.culture-card.locked:hover {
    transform: none;
    box-shadow: 0 4px 12px rgba(0,0,0,0.1);
}

/* Style alternatif avec bordure */
.culture-card.locked {
    border: 2px solid rgba(200, 200, 200, 0.5);
}

/* Ajustement de l'image */
.culture-card.locked img {
    filter: blur(2px) grayscale(60%);
}

/* Responsive - ajuster taille cadenas sur mobile */
@media screen and (max-width: 700px) {
    .culture-card.locked::after {
        font-size: 3rem;
    }
    
    .culture-card.locked .culture-card-content::before {
        font-size: 0.7rem;
        padding: 3px 10px;
    }
}
