/* Pipeline de déploiement — grille responsive + logs */

@keyframes pulseGlow {
    0% { box-shadow: 0 0 4px rgba(232, 121, 43, 0.2); }
    50% { box-shadow: 0 0 16px rgba(232, 121, 43, 0.53); }
    100% { box-shadow: 0 0 4px rgba(232, 121, 43, 0.2); }
}

.pipeline-node-running {
    animation: pulseGlow 1.5s ease-in-out infinite;
}

/* Grille du pipeline */
.pipeline-grid {
    background-color: #12122a;
    border-radius: 12px;
    border: 1px solid #2a2a4a;
    padding: 16px;
}

/* Rangée de nœuds : nœud → flèche → nœud → flèche → nœud */
.pipeline-row {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.pipeline-grid-node {
    flex: 1;
    max-width: 180px;
    min-width: 100px;
}

.pipeline-grid-arrow {
    flex: 0 0 28px;
    display: flex;
    align-items: center;
    justify-content: center;
}

/* Connecteur vertical entre rangées */
.pipeline-row-connector {
    display: flex;
    justify-content: center;
    padding: 4px 0;
}

/* Logs panel scrollbar */
.pipeline-logs-scroll::-webkit-scrollbar {
    width: 6px;
}

.pipeline-logs-scroll::-webkit-scrollbar-track {
    background: #0d0d1a;
    border-radius: 3px;
}

.pipeline-logs-scroll::-webkit-scrollbar-thumb {
    background: #3a3a5a;
    border-radius: 3px;
}

/* Dropdown dark theme (dcc.Dropdown) */
.dash-dropdown-dark .Select-control {
    background-color: #1e1e3a !important;
    border-color: #3a3a5a !important;
    color: #fff !important;
}
.dash-dropdown-dark .Select-menu-outer {
    background-color: #1e1e3a !important;
    border-color: #3a3a5a !important;
}
.dash-dropdown-dark .Select-option {
    background-color: #1e1e3a !important;
    color: #fff !important;
}
.dash-dropdown-dark .Select-option.is-focused {
    background-color: #2a2a5a !important;
}
.dash-dropdown-dark .Select-value-label {
    color: #fff !important;
}
.dash-dropdown-dark .Select-placeholder {
    color: #6c757d !important;
}
.dash-dropdown-dark .Select-multi-value-wrapper .Select-value {
    background-color: #e8792b !important;
    border-color: #e8792b !important;
    color: #fff !important;
    border-radius: 4px !important;
}
.dash-dropdown-dark .Select-value-icon {
    border-right-color: rgba(255,255,255,0.3) !important;
}
.dash-dropdown-dark .Select-value-icon:hover {
    background-color: rgba(255,255,255,0.1) !important;
    color: #fff !important;
}