/**
 * Prompt Command Styles - Terminal-style sequential prompts
 * Designed to look like native terminal prompts (SSH, MySQL, npm init, etc.)
 */

/* Title and Description (shown as terminal output) */
.prompt-title {
    color: #00ff00;
    font-weight: bold;
    margin: 0.5rem 0;
}

.prompt-description {
    color: #888;
    margin: 0.25rem 0 0.5rem 0;
}

/* Terminal Prompt Line (inline prompt like "Email: _____") */
.terminal-prompt-line {
    display: flex;
    align-items: baseline;
    margin: 0.25rem 0;
    line-height: 1.5;
}

.terminal-prompt-text {
    color: #aaa;
    white-space: nowrap;
    margin-right: 0;
}

/* Inline Input (looks like typing in terminal) */
.terminal-inline-input {
    flex: 1;
    background: transparent;
    border: none;
    outline: none;
    color: #00ff00;
    font-family: 'Courier New', monospace;
    font-size: 1rem;
    padding: 0;
    margin: 0;
    caret-color: #00ff00;
}

/* Remove browser default styling */
.terminal-inline-input:focus {
    outline: none;
    box-shadow: none;
}

/* Password Input (show asterisks as user types) */
.terminal-password-input {
    letter-spacing: 0.2rem;
}

/* Checkbox Input (y/n style) */
.terminal-checkbox-input {
    width: 2ch;
    text-transform: lowercase;
}

/* Completed Value (shown after user presses Enter) */
.terminal-prompt-value {
    color: #00ff00;
}

/* Error Display (shown below prompt line) */
.terminal-error-line {
    color: #ff4444;
    margin: 0.25rem 0 0.25rem 2rem;
    font-size: 0.9rem;
}

.terminal-input-error {
    color: #ff4444 !important;
    animation: errorShake 0.3s;
}

@keyframes errorShake {
    0%, 100% { transform: translateX(0); }
    25% { transform: translateX(-4px); }
    75% { transform: translateX(4px); }
}

/* Loading State */
.prompt-loading {
    color: #ffaa00;
    animation: loadingPulse 1.5s ease-in-out infinite;
}

@keyframes loadingPulse {
    0%, 100% { opacity: 1; }
    50% { opacity: 0.5; }
}

/* Success/Error Output Classes */
.output.success {
    color: #00ff00;
}

.output.error {
    color: #ff4444;
}

.output.warning {
    color: #ffaa00;
}

/* Ensure monospace consistency */
.terminal-prompt-line,
.terminal-prompt-text,
.terminal-inline-input,
.terminal-prompt-value,
.terminal-error-line {
    font-family: 'Courier New', Courier, monospace;
}