/* ==========================================================================
   Celestial Mechanics & Orbit Simulator (OrbitSim) Styles
   ========================================================================== */

.tool-orbitsim-wrapper {
    user-select: none;
}

/* Canvas Space Wrapper */
.orb-canvas-wrapper {
    position: relative;
    width: 100%;
    min-height: 480px;
    background-color: #030712;
    background-image: 
        radial-gradient(1px 1px at 25px 35px, rgba(255, 255, 255, 0.45), transparent),
        radial-gradient(1px 1px at 85px 120px, rgba(255, 255, 255, 0.35), transparent),
        radial-gradient(1.5px 1.5px at 190px 70px, rgba(255, 255, 255, 0.6), transparent),
        radial-gradient(1px 1px at 310px 240px, rgba(255, 255, 255, 0.3), transparent),
        radial-gradient(1px 1px at 450px 160px, rgba(255, 255, 255, 0.4), transparent),
        radial-gradient(1.5px 1.5px at 600px 80px, rgba(255, 255, 255, 0.5), transparent),
        radial-gradient(1px 1px at 750px 290px, rgba(255, 255, 255, 0.35), transparent),
        radial-gradient(1px 1px at 880px 180px, rgba(255, 255, 255, 0.45), transparent);
    background-size: 500px 350px;
    border-radius: 0.5rem;
    overflow: hidden;
    cursor: crosshair;
}

#orb-canvas {
    display: block;
    width: 100%;
    height: auto;
    max-width: 100%;
    touch-action: none;
}

/* Floating HUD Overlay */
.orb-hud-overlay {
    position: absolute;
    top: 10px;
    left: 12px;
    display: flex;
    gap: 6px;
    z-index: 5;
    pointer-events: none;
}

/* Instructions Banner */
.orb-canvas-instructions {
    position: absolute;
    bottom: 8px;
    left: 50%;
    transform: translateX(-50%);
    background: rgba(3, 7, 18, 0.8);
    color: #9ca3af;
    padding: 3px 12px;
    border-radius: 12px;
    font-size: 0.72rem;
    border: 1px solid rgba(255, 255, 255, 0.1);
    pointer-events: none;
    white-space: nowrap;
}

/* Active Bodies List */
.orb-body-item {
    transition: all 0.15s ease-in-out;
    cursor: pointer;
    border-left: 3px solid transparent;
}

.orb-body-item:hover {
    background-color: var(--bs-tertiary-bg);
}

.orb-body-item.active {
    background-color: var(--bs-primary-bg-subtle, rgba(13, 110, 253, 0.15)) !important;
    border-left: 3px solid var(--bs-info) !important;
    color: var(--bs-body-color) !important;
}

.orb-body-item .btn-remove-body {
    opacity: 0.6;
    transition: opacity 0.15s ease;
}

.orb-body-item:hover .btn-remove-body,
.orb-body-item.active .btn-remove-body {
    opacity: 1;
}

/* Astrodynamics Tabs */
#orb-theory-tabs .nav-link {
    color: var(--bs-secondary-color);
    font-size: 0.85rem;
}

#orb-theory-tabs .nav-link.active {
    color: var(--bs-info);
    border-bottom: 2px solid var(--bs-info);
}

/* Subtle glowing animations */
@keyframes orbPulse {
    0%, 100% { opacity: 0.85; }
    50% { opacity: 1.0; }
}

.orb-glow-star {
    animation: orbPulse 3s infinite ease-in-out;
}