/* Generic multi-step tool styling (framework-level, non tool-specific) */

.aichat-multistep-tool {
    position: relative;
}

/* Inner container rendered by MultiStepToolBase::get_step_interface_html */
.multi-step-tool-container {
    border-radius: 6px;
    border: 1px solid rgba(0, 0, 0, 0.06);
    padding: 16px;
    background-color: #ffffff;
}

/* Progress bar wrapper */
.multi-step-tool-container .progress-bar-container {
    position: relative;
    width: 100%;
    height: 6px;
    border-radius: 999px;
    background-color: rgba(0, 0, 0, 0.06);
    overflow: hidden;
    margin-bottom: 12px;
}

/* Progress fill */
.multi-step-tool-container .progress-bar {
    height: 100%;
    border-radius: 999px;
    background: linear-gradient(90deg, #4f46e5, #06b6d4);
    transition: width 200ms ease-out;
}

/* Step title and description */
.multi-step-tool-container h3 {
    margin-top: 8px;
    margin-bottom: 4px;
    font-size: 1rem;
    font-weight: 600;
}

.multi-step-tool-container .step-description {
    margin: 0 0 12px 0;
    font-size: 0.875rem;
    color: #4b5563;
}

/* Generic layout for buttons inside multi-step forms */
.aichat-multistep-tool .aichat-tool-form-wrapper form .aichat-step-actions,
.multi-step-tool-container .aichat-step-actions {
    display: flex;
    gap: 8px;
    margin-top: 12px;
    flex-wrap: wrap;
}

.aichat-multistep-tool .aichat-step-actions button {
    border-radius: 4px;
    font-size: 0.875rem;
}

/* Primary next/submit button (reuses existing utility classes when present) */
.aichat-multistep-tool .aichat-step-actions .aichat-step-next,
.aichat-multistep-tool .aichat-step-actions .aichat-step-submit {
    padding: 6px 14px;
    background-color: #4f46e5;
    color: #ffffff;
    border: none;
}

/* Secondary actions (back/skip) */
.aichat-multistep-tool .aichat-step-actions .aichat-step-back,
.aichat-multistep-tool .aichat-step-actions .aichat-step-skip {
    padding: 6px 10px;
    background-color: #f3f4f6;
    color: #374151;
    border: 1px solid #e5e7eb;
}

/* Disabled state harmony with existing tool styles */
.aichat-multistep-tool .aichat-disabled,
.aichat-multistep-tool .aichat-disabled-permanent {
    opacity: 0.6;
    cursor: not-allowed;
}
