/* ============================================
   KUKA 2D Articulated Robot Arm Styles
   Synced with slider transitions
   ============================================ */

.kuka-robot-container {
    position: absolute;
    bottom: 10px;
    left: 50%;
    transform: translateX(-50%);
    width: 300px;
    height: 180px;
    z-index: 100;
    pointer-events: none;
}

.kuka-robot-svg {
    width: 100%;
    height: 100%;
    overflow: visible;
    filter: drop-shadow(0 4px 12px rgba(0,0,0,0.5));
}

/* ============================================
   Base State - Robot at rest (center)
   ============================================ */

.kuka-lower-arm {
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transform: rotate(0deg);
}

.kuka-upper-arm {
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transform: rotate(0deg);
}

.kuka-wrist {
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transform: rotate(0deg);
}

.kuka-gripper {
    transition: transform 0.4s ease;
    transform: rotate(0deg);
}

.kuka-rotation-base {
    transition: transform 0.6s cubic-bezier(0.4, 0, 0.2, 1);
    transform: rotate(0deg);
}

/* ============================================
   Push Right State - Pushing slide to LEFT (slide moves left)
   ============================================ */

.kuka-robot-container.pushing-right .kuka-lower-arm {
    transform: rotate(-40deg);
}

.kuka-robot-container.pushing-right .kuka-upper-arm {
    transform: rotate(55deg);
}

.kuka-robot-container.pushing-right .kuka-wrist {
    transform: rotate(-20deg);
}

.kuka-robot-container.pushing-right .kuka-rotation-base {
    transform: rotate(-5deg);
}

/* ============================================
   Wind Up State - Preparing to push LEFT (arm pulls right)
   ============================================ */

.kuka-robot-container.winding-up .kuka-lower-arm {
    transform: rotate(35deg);
}

.kuka-robot-container.winding-up .kuka-upper-arm {
    transform: rotate(-50deg);
}

.kuka-robot-container.winding-up .kuka-wrist {
    transform: rotate(15deg);
}

.kuka-robot-container.winding-up .kuka-rotation-base {
    transform: rotate(5deg);
}

/* ============================================
   Push Left State - Pushing slide to RIGHT (slide moves right)
   ============================================ */

.kuka-robot-container.pushing-left .kuka-lower-arm {
    transform: rotate(35deg);
}

.kuka-robot-container.pushing-left .kuka-upper-arm {
    transform: rotate(-50deg);
}

.kuka-robot-container.pushing-left .kuka-wrist {
    transform: rotate(15deg);
}

.kuka-robot-container.pushing-left .kuka-rotation-base {
    transform: rotate(5deg);
}

/* ============================================
   Wind Up Left State - Preparing to push RIGHT (arm pulls left)
   ============================================ */

.kuka-robot-container.winding-up-left .kuka-lower-arm {
    transform: rotate(-40deg);
}

.kuka-robot-container.winding-up-left .kuka-upper-arm {
    transform: rotate(55deg);
}

.kuka-robot-container.winding-up-left .kuka-wrist {
    transform: rotate(-20deg);
}

.kuka-robot-container.winding-up-left .kuka-rotation-base {
    transform: rotate(-5deg);
}

/* ============================================
   Idle Animation - Subtle breathing motion
   ============================================ */

.kuka-robot-container.idle .kuka-lower-arm {
    animation: kuka-idle-lower 2s ease-in-out infinite;
}

.kuka-robot-container.idle .kuka-upper-arm {
    animation: kuka-idle-upper 2s ease-in-out infinite;
}

.kuka-robot-container.idle .kuka-wrist {
    animation: kuka-idle-wrist 2s ease-in-out infinite;
}

@keyframes kuka-idle-lower {
    0%, 100% { transform: rotate(-5deg); }
    50% { transform: rotate(5deg); }
}

@keyframes kuka-idle-upper {
    0%, 100% { transform: rotate(8deg); }
    50% { transform: rotate(-8deg); }
}

@keyframes kuka-idle-wrist {
    0%, 100% { transform: rotate(-3deg); }
    50% { transform: rotate(3deg); }
}

/* ============================================
   LED Animations
   ============================================ */

.kuka-gripper-light {
    animation: kuka-light-pulse 0.5s ease-in-out infinite;
}

@keyframes kuka-light-pulse {
    0%, 100% {
        opacity: 1;
        filter: drop-shadow(0 0 6px #00FFFF);
    }
    50% {
        opacity: 0.5;
        filter: drop-shadow(0 0 12px #00FFFF);
    }
}

.kuka-status-led {
    animation: kuka-status-blink 1s ease-in-out infinite;
}

@keyframes kuka-status-blink {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.3; }
}

.kuka-status-led-2 {
    animation: kuka-status-blink-2 0.7s ease-in-out infinite;
}

@keyframes kuka-status-blink-2 {
    0%, 100% {
        opacity: 0.4;
        filter: drop-shadow(0 0 3px #00FFFF);
    }
    50% {
        opacity: 1;
        filter: drop-shadow(0 0 8px #00FFFF);
    }
}

/* Active pushing - LEDs go bright */
.kuka-robot-container.pushing-right .kuka-gripper-light,
.kuka-robot-container.pushing-left .kuka-gripper-light,
.kuka-robot-container.winding-up .kuka-gripper-light,
.kuka-robot-container.winding-up-left .kuka-gripper-light {
    animation: kuka-light-active 0.2s ease-in-out infinite;
}

@keyframes kuka-light-active {
    0%, 100% {
        opacity: 1;
        filter: drop-shadow(0 0 10px #00FFFF) drop-shadow(0 0 20px #00FFFF);
    }
    50% {
        opacity: 0.8;
        filter: drop-shadow(0 0 15px #00FFFF) drop-shadow(0 0 30px #00FFFF);
    }
}

/* ============================================
   Responsive Adjustments
   ============================================ */

@media (max-width: 1024px) {
    .kuka-robot-container {
        width: 280px;
        height: 170px;
        bottom: 5px;
    }
}

@media (max-width: 768px) {
    .kuka-robot-container {
        width: 260px;
        height: 155px;
        bottom: 0;
    }
}

@media (max-width: 480px) {
    .kuka-robot-container {
        width: 220px;
        height: 130px;
        bottom: -5px;
    }
}

/* ============================================
   Slider Section Adjustments
   ============================================ */

.engenharia-slider {
    position: relative;
    overflow: visible !important;
}

.engenharia-slider-container {
    overflow: hidden;
}