/* Styles pour le poulet et les éléments associés */

.chicken-container {
    position: relative;
    width: 300px;
    height: 300px;
    margin: 2rem 0;
    display: flex;
    justify-content: center;
    align-items: center;
}

.chicken {
    width: 200px;
    height: 250px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 130"><path d="M50,10 C60,10 70,20 70,35 C70,45 65,55 50,65 C35,55 30,45 30,35 C30,20 40,10 50,10 Z" fill="%23FFCC00"/><path d="M30,35 C30,35 20,45 20,65 C20,85 35,95 50,95 C65,95 80,85 80,65 C80,45 70,35 70,35" fill="%23FFCC00"/><path d="M35,95 C35,95 30,100 30,110 C30,120 25,125 20,125" fill="%23FFCC00"/><path d="M65,95 C65,95 70,100 70,110 C70,120 75,125 80,125" fill="%23FFCC00"/><circle cx="45" cy="25" r="3" fill="%23000"/><circle cx="55" cy="25" r="3" fill="%23000"/><path d="M50,30 C53,32 55,34 55,36 C55,38 53,40 50,40 C47,40 45,38 45,36 C45,34 47,32 50,30 Z" fill="%23FF3300"/><path d="M50,5 L50,15" stroke="%23FF0000" stroke-width="3"/><path d="M50,0 C54,0 54,5 50,5 C46,5 46,0 50,0 Z" fill="%23FF0000"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    cursor: pointer;
    transition: transform 0.1s ease;
}

.chicken:hover {
    transform: scale(1.05);
}

.chicken:active {
    transform: scale(0.95);
}

.chicken.critical-hit {
    filter: brightness(1.5) drop-shadow(0 0 10px gold);
}

.chicken.golden-chicken {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 130"><path d="M50,10 C60,10 70,20 70,35 C70,45 65,55 50,65 C35,55 30,45 30,35 C30,20 40,10 50,10 Z" fill="%23FFD700"/><path d="M30,35 C30,35 20,45 20,65 C20,85 35,95 50,95 C65,95 80,85 80,65 C80,45 70,35 70,35" fill="%23FFD700"/><path d="M35,95 C35,95 30,100 30,110 C30,120 25,125 20,125" fill="%23FFD700"/><path d="M65,95 C65,95 70,100 70,110 C70,120 75,125 80,125" fill="%23FFD700"/><circle cx="45" cy="25" r="3" fill="%23000"/><circle cx="55" cy="25" r="3" fill="%23000"/><path d="M50,30 C53,32 55,34 55,36 C55,38 53,40 50,40 C47,40 45,38 45,36 C45,34 47,32 50,30 Z" fill="%23FF3300"/><path d="M50,5 L50,15" stroke="%23FF0000" stroke-width="3"/><path d="M50,0 C54,0 54,5 50,5 C46,5 46,0 50,0 Z" fill="%23FF0000"/></svg>');
    filter: drop-shadow(0 0 15px gold);
    animation: golden-pulse 1.5s infinite;
}

.chicken.golden-click {
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 130"><path d="M50,10 C60,10 70,20 70,35 C70,45 65,55 50,65 C35,55 30,45 30,35 C30,20 40,10 50,10 Z" fill="%23FFD700"/><path d="M30,35 C30,35 20,45 20,65 C20,85 35,95 50,95 C65,95 80,85 80,65 C80,45 70,35 70,35" fill="%23FFD700"/><path d="M35,95 C35,95 30,100 30,110 C30,120 25,125 20,125" fill="%23FFD700"/><path d="M65,95 C65,95 70,100 70,110 C70,120 75,125 80,125" fill="%23FFD700"/><circle cx="45" cy="25" r="3" fill="%23000"/><circle cx="55" cy="25" r="3" fill="%23000"/><path d="M50,30 C53,32 55,34 55,36 C55,38 53,40 50,40 C47,40 45,38 45,36 C45,34 47,32 50,30 Z" fill="%23FF3300"/><path d="M50,5 L50,15" stroke="%23FF0000" stroke-width="3"/><path d="M50,0 C54,0 54,5 50,5 C46,5 46,0 50,0 Z" fill="%23FF0000"/></svg>');
    filter: brightness(2) drop-shadow(0 0 20px gold);
    animation: golden-explosion 0.5s;
}

.click-text {
    position: absolute;
    font-size: 1.5rem;
    font-weight: bold;
    color: white;
    text-shadow: 0 0 5px black;
    pointer-events: none;
    opacity: 0;
    transition: all 0.5s ease;
}

/* Particules de poulet dans le fond */
.chicken-particle {
    position: fixed;
    width: 30px;
    height: 30px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 100"><path d="M50,10 C60,10 70,20 70,35 C70,45 65,55 50,65 C35,55 30,45 30,35 C30,20 40,10 50,10 Z" fill="%23FFCC00"/><path d="M30,35 C30,35 20,45 20,65 C20,85 35,95 50,95 C65,95 80,85 80,65 C80,45 70,35 70,35" fill="%23FFCC00"/><circle cx="45" cy="25" r="3" fill="%23000"/><circle cx="55" cy="25" r="3" fill="%23000"/><path d="M50,30 C53,32 55,34 55,36 C55,38 53,40 50,40 C47,40 45,38 45,36 C45,34 47,32 50,30 Z" fill="%23FF3300"/></svg>');
    background-size: contain;
    background-repeat: no-repeat;
    background-position: center;
    opacity: 0.3;
    z-index: -1;
    pointer-events: none;
    animation: float-random 20s linear infinite;
}

/* Élements de décoration dynamiques */
.decoration {
    position: fixed;
    z-index: -1;
    opacity: 0;
    transition: opacity 1s ease;
    pointer-events: none;
}

.farm {
    bottom: 0;
    left: 0;
    width: 200px;
    height: 100px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 200 100"><path d="M20,70 L20,100 L80,100 L80,70 Z" fill="%23CD853F"/><path d="M10,70 L90,70 L50,40 Z" fill="%238B4513"/><rect x="40" y="85" width="20" height="15" fill="%23A0522D"/></svg>');
    background-repeat: no-repeat;
}

.factory {
    bottom: 0;
    right: 0;
    width: 150px;
    height: 120px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 150 120"><path d="M10,50 L10,120 L140,120 L140,50 Z" fill="%23555"/><path d="M50,30 L50,50 L100,50 L100,30 Z" fill="%23777"/><rect x="60" y="80" width="30" height="40" fill="%23333"/><path d="M40,20 L40,40 L60,40 L60,20 Z" fill="%23999"/><path d="M70,10 L80,0 L90,10 Z" fill="%23999"/></svg>');
    background-repeat: no-repeat;
}

.cyber-tower {
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    width: 100px;
    height: 200px;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 100 200"><path d="M30,40 L30,200 L70,200 L70,40 Z" fill="%23333"/><path d="M20,30 L80,30 L50,0 Z" fill="%2300BFFF"/><rect x="35" y="60" width="30" height="10" fill="%2300FFFF"/><rect x="35" y="80" width="30" height="10" fill="%2300FFFF"/><rect x="35" y="100" width="30" height="10" fill="%2300FFFF"/><rect x="35" y="120" width="30" height="10" fill="%2300FFFF"/></svg>');
    background-repeat: no-repeat;
}

.cosmos {
    top: 0;
    width: 100%;
    height: 100%;
    background-image: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="400" height="400" viewBox="0 0 400 400"><circle cx="100" cy="100" r="1" fill="%23FFF"/><circle cx="150" cy="50" r="1" fill="%23FFF"/><circle cx="200" cy="150" r="2" fill="%23FFF"/><circle cx="250" cy="200" r="1" fill="%23FFF"/><circle cx="300" cy="250" r="2" fill="%23FFF"/><circle cx="350" cy="300" r="1" fill="%23FFF"/><circle cx="50" cy="350" r="1" fill="%23FFF"/><circle cx="125" cy="225" r="2" fill="%23FFF"/><circle cx="175" cy="275" r="1" fill="%23FFF"/><circle cx="225" cy="325" r="1" fill="%23FFF"/><circle cx="275" cy="375" r="2" fill="%23FFF"/><circle cx="325" cy="25" r="1" fill="%23FFF"/><circle cx="375" cy="75" r="1" fill="%23FFF"/></svg>');
    background-repeat: repeat;
}

/* Animations pour le poulet */
@keyframes shake {
    0% { transform: rotate(0deg); }
    25% { transform: rotate(5deg); }
    50% { transform: rotate(0deg); }
    75% { transform: rotate(-5deg); }
    100% { transform: rotate(0deg); }
}

@keyframes critical-shake {
    0% { transform: rotate(0deg) scale(1); }
    25% { transform: rotate(10deg) scale(1.2); }
    50% { transform: rotate(0deg) scale(1.4); }
    75% { transform: rotate(-10deg) scale(1.2); }
    100% { transform: rotate(0deg) scale(1); }
}

@keyframes golden-pulse {
    0% { filter: drop-shadow(0 0 5px gold); }
    50% { filter: drop-shadow(0 0 20px gold); }
    100% { filter: drop-shadow(0 0 5px gold); }
}

@keyframes golden-explosion {
    0% { transform: scale(1); filter: brightness(1) drop-shadow(0 0 0px gold); }
    50% { transform: scale(1.5); filter: brightness(2) drop-shadow(0 0 30px gold); }
    100% { transform: scale(1); filter: brightness(1) drop-shadow(0 0 0px gold); }
}

@keyframes float-random {
    0% { transform: translate(0, 0) rotate(0deg); opacity: 0.3; }
    25% { opacity: 0.4; }
    50% { transform: translate(var(--tx), var(--ty)) rotate(var(--tr)); opacity: 0.5; }
    75% { opacity: 0.4; }
    100% { transform: translate(0, 0) rotate(0deg); opacity: 0.3; }
}

@keyframes floatUp {
    0% { transform: translateY(0); opacity: 1; }
    100% { transform: translateY(-50px); opacity: 0; }
}

@media (max-width: 768px) {
    .chicken-container {
        width: 250px;
        height: 250px;
    }
    
    .chicken {
        width: 150px;
        height: 200px;
    }
}