/* Robot WAF — detection status row & state toggling */

.card-loading {
    display: flex;
    align-items: center;
    justify-content: center;   /* center the tick + text as one group (matches 445) */
    margin-top: 30px;
    padding: 0 2px;
}

.card-loading .icon {
    width: 22px;
    height: 22px;
    flex: 0 0 auto;
}

.card-loading .status-text {
    margin-left: 10px;
    font-size: 15px;
    line-height: 1.5;
    color: #1f1f22;
}

/* Spinner keeps rotating while checking */
.loading-spinner {
    animation: waf-spin 1s linear infinite;
    transform-origin: 50% 50%;
}

/*
 * State machine:
 *  - default (no .state-done): show [data-state="checking"], hide [data-state="done"]
 *  - #challenge-stage.state-done: hide checking, reveal done + button
 */
#challenge-stage:not(.state-done) [data-state="done"] {
    display: none !important;
}

#challenge-stage.state-done [data-state="checking"] {
    display: none !important;
}

/* Fade the completed state in */
#challenge-stage.state-done .card-loading [data-state="done"] {
    animation: waf-fade-in 0.35s ease both;
}

#challenge-stage.state-done #access {
    animation: waf-fade-in 0.35s ease both, waf-glow 2s ease-in-out infinite 0.4s;
}