/* 235App custom.css
 *
 * Extracted from the inline tags$style() blocks in the legacy app.R.
 * The styles here cover:
 *   - the take-assignment sidebar and "try another" / "refresh" buttons
 *   - the numeric-input width override used in question rendering
 *   - the Course-grade two-column num-grid for the estimator
 *   - the pvalue helper text introduced by format_questions
 *
 * Step 8 of the Phase 2 work order will continue extracting any remaining
 * inline styles; what's here is the set referenced by the v2 modules.
 */

/* ---- numeric inputs in question UI: width override (legacy parity) ---- */
input[type="number"] {
    width: 200px;
}

/* ---- buttons --------------------------------------------------------- */
.btn-refresh {
    color: white;
    background-color: #004400;
}

.btn-try-another {
    color: white;
    background-color: #004400;
}

.btn-recalc {
    background-color: #004400;
    color: white;
}

/* ---- take-assignment sidebar ---------------------------------------- */
.take-sidebar {
    height: 100vh;
    background-color: #ebf5fb;
    border-width: 0px;
    border-radius: 0px;
}

/* labels inside the take-assignment sidebar should stay black */
.take-sidebar label {
    color: black;
}

/* ---- pvalue helper text under the question -------------------------- */
.pvalue-helper {
    color: #555;
    font-size: 0.85em;
    margin: 4px 0 8px 0;
}

/* ---- Course Grade tab: estimator grid (legacy parity) -------------- */
#autoFinalHeader, [id$="-autoFinalHeader"] {
    color: #000044;
}

.num-grid {
    display: grid;
    grid-template-columns: 180px auto;
    column-gap: 12px;
    row-gap: 8px;
    align-items: center;
}

.num-grid-label {
    font-weight: 600;
    color: #222;
}

.num-grid .form-group {
    margin-bottom: 0;
}

.num-grid .shiny-input-container input[type="number"] {
    width: 120px;
}

.num-grid-block {
    padding-top: 6px;
    border-top: 1px solid #e0e0e0;
    margin-top: 10px;
}

/* ---- login error message -------------------------------------------- */
.login-message {
    color: #a30000;
    font-weight: 600;
}