/* compute_crea.css — CREA CU: live creation log (ensure-stack).
   Presentation only: the panel renders the steps the BACKEND returns. */

.crea-ensure {
    margin: 0 0 14px;
    border: 1px solid #2f3a4a;
    border-radius: 10px;
    background: #151b24;
    overflow: hidden;
}

.crea-ensure-head {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 10px 12px;
    border-bottom: 1px solid #232c39;
    background: #1a2230;
}

.crea-ensure-title {
    font-size: 13px;
    font-weight: 600;
    color: #e6edf6;
}

.crea-ensure-live {
    width: 9px;
    height: 9px;
    border-radius: 50%;
    background: #ff9f43;
    animation: crea-ensure-pulse 1.1s ease-in-out infinite;
}

@keyframes crea-ensure-pulse {
    0%, 100% { opacity: 1; }
    50% { opacity: .25; }
}

.crea-ensure-close {
    margin-left: auto;
    border: 0;
    background: transparent;
    color: #8b98a8;
    font-size: 18px;
    line-height: 1;
    padding: 2px 6px;
    cursor: pointer;
    border-radius: 6px;
}

.crea-ensure-close:hover {
    background: #232c39;
    color: #e6edf6;
}

.crea-ensure-steps {
    list-style: none;
    margin: 0;
    padding: 10px 12px;
}

.crea-ensure-step {
    display: flex;
    align-items: flex-start;
    gap: 9px;
    padding: 5px 0;
    font-size: 13px;
    color: #8b98a8;
}

.crea-ensure-dot {
    flex: 0 0 auto;
    width: 9px;
    height: 9px;
    margin-top: 5px;
    border-radius: 50%;
    background: #303a48;
}

.crea-ensure-label {
    color: inherit;
}

.crea-ensure-detail {
    color: #7d8a9a;
    font-size: 12px;
}

.crea-ensure-step.is-running {
    color: #e6edf6;
}

.crea-ensure-step.is-running .crea-ensure-dot {
    background: #ff9f43;
    animation: crea-ensure-pulse 1.1s ease-in-out infinite;
}

.crea-ensure-step.is-ok {
    color: #4ec9a0;
}

.crea-ensure-step.is-ok .crea-ensure-dot {
    background: #4ec9a0;
}

.crea-ensure-step.is-skipped {
    color: #6f7c8c;
}

.crea-ensure-step.is-skipped .crea-ensure-dot {
    background: transparent;
    border: 1px solid #3c4757;
    width: 7px;
    height: 7px;
}

.crea-ensure-step.is-error {
    color: #ff6b6b;
}

.crea-ensure-step.is-error .crea-ensure-dot {
    background: #ff6b6b;
}

.crea-ensure-banner {
    padding: 9px 12px;
    border-top: 1px solid #232c39;
    font-size: 13px;
}

.crea-ensure-banner.is-ok {
    color: #4ec9a0;
    background: rgba(78, 201, 160, .08);
}

.crea-ensure-banner.is-fail {
    color: #ff6b6b;
    background: rgba(255, 107, 107, .08);
}