/* ==========================================
   LIVE SIMULATOR STYLES
========================================== */

/* The green pulsing dot for "LIVE" indication */
@keyframes ce-pulse-green { 
    0% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0.7); } 
    70% { box-shadow: 0 0 0 10px rgba(16, 185, 129, 0); } 
    100% { box-shadow: 0 0 0 0 rgba(16, 185, 129, 0); } 
}
.ce-pulse-dot { 
    width: 12px; 
    height: 12px; 
    background: #10b981; 
    border-radius: 50%; 
    box-shadow: 0 0 10px #10b981; 
    animation: ce-pulse-green 1.5s infinite; 
}

/* Dashboard Cards */
.ce-sim-card { 
    border: 1px solid #10b981 !important; 
    box-shadow: 0 4px 15px rgba(16, 185, 129, 0.1);
    transition: transform 0.2s, box-shadow 0.2s;
}
.ce-sim-card:hover {
    transform: translateY(-2px);
    box-shadow: 0 6px 20px rgba(16, 185, 129, 0.2);
}
.ce-sim-card .ce-card-header { 
    background: rgba(16, 185, 129, 0.1) !important; 
    border-bottom: 1px solid #10b981; 
}

/* Loading State inside Canvas Wrapper */
.sim-loading {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    color: #10b981;
    font-size: 11px;
    font-weight: bold;
    letter-spacing: 1px;
    animation: ce-pulse-text 1.5s infinite;
}

@keyframes ce-pulse-text {
    0% { opacity: 0.5; }
    50% { opacity: 1; }
    100% { opacity: 0.5; }
}

/* Buttons */
.ce-retro-sim-icon-btn:hover {
    filter: drop-shadow(0 0 5px #10b981);
    transform: scale(1.2);
}

/* Ephemeral Context Menu */
.ce-sim-drawing-ctx-menu {
    border-radius: 4px;
}
.ce-sim-ctx-color {
    width: 32px; 
    height: 32px; 
    padding: 0; 
    border: none; 
    cursor: pointer; 
    background: transparent; 
}
.ce-sim-ctx-select {
    background: #0f172a; 
    color: #fff; 
    border: 1px solid #334155; 
    font-size: 11px; 
    padding: 2px; 
    outline: none; 
}

/* Custom Scrollbar for Lightbox */
#ce-sim-lightbox::-webkit-scrollbar {
    width: 8px;
}
#ce-sim-lightbox::-webkit-scrollbar-track {
    background: rgba(0,0,0,0.5);
}
#ce-sim-lightbox::-webkit-scrollbar-thumb {
    background: #10b981;
    border-radius: 4px;
}