/* ═══════════════════════════════════════════════════════════════
   AUTH PAGES - Terminal Theme
   ═══════════════════════════════════════════════════════════════ */

/* Login Prompt Component */
.login-prompt {
    background: rgba(0, 0, 0, 0.5) !important;
    border-bottom: 1px solid rgba(0, 255, 65, 0.3) !important;
}

.login-text {
    color: var(--phosphor-green);
    font-family: var(--font-mono);
    font-size: var(--font-size-sm);
    font-weight: bold;
    text-shadow: 0 0 8px rgba(0, 255, 65, 0.3);
}

.login-cursor {
    color: var(--phosphor-green);
    font-family: var(--font-mono);
    font-size: var(--font-size-sm);
    font-weight: bold;
    text-shadow: 0 0 10px rgba(0, 255, 65, 0.5);
    animation: cursor-blink 1s steps(2, start) infinite;
}

@keyframes cursor-blink {

    0%,
    49%,
    100% {
        opacity: 1;
    }

    50%,
    99% {
        opacity: 0;
    }
}

/* ═══════════════════════════════════════════════════════════════
   AUTH PAGE CENTERING
   ═══════════════════════════════════════════════════════════════ */

/* Remove flex centering from terminal-content for auth pages */
.terminal-content:has(.auth-page-centered) {
    display: block;
}

.auth-page-centered {
    display: flex;
    justify-content: center;
    width: 100%;
    padding-top: 0;
}

.auth-page-centered .row {
    width: 100%;
    max-width: 700px;
    margin: 0;
}

.auth-page-centered .panel {
    min-width: 450px;
    width: 100%;
}

/* Ensure form fields have good spacing in auth forms */
.auth-page-centered .form-field {
    margin-bottom: 1.25rem;
}

.auth-page-centered .panel-body {
    padding: 2rem;
}

/* Center form labels and inputs horizontally */
.auth-page-centered .form-label {
    text-align: center;
    display: block;
    width: 100%;
}

.auth-page-centered .form-control {
    display: block;
    margin: 0 auto;
    text-align: center;
}

.auth-page-centered .btn {
    display: block;
    margin: 1rem auto 0;
}

/* Override centering for specific elements */
.auth-page-centered .text-left,
.auth-page-centered .text-left * {
    text-align: left !important;
}

/* ═══════════════════════════════════════════════════════════════
   FORM CONTAINER CENTERING (for .container-based layouts)
   ═══════════════════════════════════════════════════════════════ */

.form-container-centered {
    max-width: 400px;
    margin: 0 auto;
}

.form-container-centered-wide {
    max-width: 600px;
    margin: 0 auto;
}

.form-container-centered .form-label,
.form-container-centered-wide .form-label {
    text-align: center;
    display: block;
    width: 100%;
}

.form-container-centered .form-control,
.form-container-centered-wide .form-control,
.form-container-centered input[type="text"],
.form-container-centered input[type="email"],
.form-container-centered input[type="password"],
.form-container-centered-wide input[type="text"],
.form-container-centered-wide input[type="email"],
.form-container-centered-wide input[type="password"] {
    display: block;
    margin: 0 auto;
    text-align: center;
    width: 60%;
    max-width: 350px;
}

.form-container-centered .btn,
.form-container-centered-wide .btn {
    display: block;
    margin: 1rem auto 0;
}

/* ═══════════════════════════════════════════════════════════════
   FORM ROW LAYOUTS
   ═══════════════════════════════════════════════════════════════ */

/* Two-column form row for side-by-side fields */
.form-row-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1rem;
}

@media (max-width: 576px) {
    .form-row-2col {
        grid-template-columns: 1fr;
    }
}

/* ═══════════════════════════════════════════════════════════════
   INFO LIST
   Used for bulleted lists inside message/info-card panels.
   Provides consistent indentation and readable line-height.
   ═══════════════════════════════════════════════════════════════ */

.info-list {
    padding-left: var(--spacing-lg); /* 1.5rem — room for bullet markers */
    line-height: 1.8;
}

/* ═══════════════════════════════════════════════════════════════
   FORM HELP TEXT
   ═══════════════════════════════════════════════════════════════ */

.form-help-text {
    text-align: center;
    color: var(--text-dim);
    margin-bottom: 1.5rem;
}