/**
 * css-lms/credit_analysis_result.css - styles the markup js-lms/
 * credit_analysis_result.js emits, plus the small Analyze dialog form
 * pattern (.ext-field*) it is paired with on the tenant side
 * (js-lms/context_menus.js's Run Credit Analysis... popup).
 *
 * These are the same .ext-credit-*/.ext-facts/.ext-list/.ext-field rules
 * css-lms/external.css already defines for the brokerage workspace -
 * duplicated here, deliberately, rather than loading external.css itself
 * into the tenant SPA (index.html): external.css opens with an unscoped
 * `* {}`/`html, body {}` reset meant for its own standalone page, which
 * would be wrong to apply globally inside the tenant app. Every custom
 * property referenced below (--vantage-*, --lms-success-ink, --lms-
 * danger-ink, --lms-warning-ink) is the shared house palette, already
 * defined in css-lms/brand.css and loaded on every page, tenant and
 * external alike - this file supplies no colours of its own.
 *
 * Kept in step with external.css's own .ext-credit-*/.ext-facts/.ext-list
 * rules by hand; a change to the result shape changes both.
 */

.ext-facts {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 40px;
    margin: 18px 0 0;
}
.ext-facts div { min-width: 0; }
.ext-facts dt {
    font-size: 12.5px;
    color: var(--vantage-text-2);
    margin: 0 0 2px;
}
.ext-facts dd {
    margin: 0;
    font-size: 15px;
    font-weight: 500;
    overflow-wrap: anywhere;
}

.ext-list {
    list-style: none;
    margin: 0;
    padding: 0;
    border-radius: 14px;
    background: var(--vantage-fill);
    overflow: hidden;
}
.ext-row {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto auto;
    align-items: center;
    gap: 8px 20px;
    padding: 14px 18px;
}
.ext-row + .ext-row { box-shadow: inset 0 1px 0 var(--vantage-line-2); }
.ext-row-sub { font-size: 12.5px; color: var(--vantage-text-2); overflow-wrap: anywhere; }
.ext-list-empty {
    margin: 0;
    padding: 18px;
    border-radius: 14px;
    background: var(--vantage-fill);
    font-size: 14px;
    color: var(--vantage-text-2);
}
.ext-num { font-variant-numeric: tabular-nums; }
@media (max-width: 720px) { .ext-row { grid-template-columns: minmax(0, 1fr); } }

/* ── A small field-grid form (the Analyze dialog) ─────────────────────── */
.ext-field-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px 16px;
}
@media (max-width: 480px) { .ext-field-grid { grid-template-columns: minmax(0, 1fr); } }
.ext-field-grid .ext-field { flex: none; }
.ext-field-wide { grid-column: 1 / -1; }
.ext-field { flex: 1 1 220px; min-width: 0; }
.ext-field label {
    display: block;
    margin: 0 0 6px;
    font-size: 12.5px;
    font-weight: 500;
    color: var(--vantage-text);
}
.ext-field input,
.ext-field select {
    width: 100%;
    height: 40px;
    padding: 0 10px;
    border: 1px solid var(--vantage-line);
    border-radius: 8px;
    background: var(--vantage-surface);
    color: var(--vantage-text);
    font: inherit;
    font-size: 14px;
}
.ext-field input:focus-visible,
.ext-field select:focus-visible {
    outline: none;
    border-color: var(--vantage-accent);
    box-shadow: 0 0 0 3px color-mix(in srgb, var(--vantage-accent) 22%, transparent);
}
.ext-msg { margin: 12px 0 0; font-size: 13.5px; min-height: 1.2em; }
.ext-msg-error { color: var(--lms-danger-ink); }
.ext-credit-dialog-note { margin: 0 0 16px; font-size: 13.5px; color: var(--vantage-text-2); line-height: 1.5; }

/* ── A credit-analysis-service result (js-lms/credit_analysis_result.js) ─ */
.ext-credit-meta { margin: 18px 0 0; font-size: 12.5px; color: var(--vantage-text-2); }
.ext-credit-failed {
    padding: 14px 18px;
    border-radius: 14px;
    background: color-mix(in srgb, var(--lms-danger-ink) 8%, transparent);
    color: var(--lms-danger-ink);
    font-size: 14px;
}
.ext-credit-failed .ext-credit-meta { color: inherit; opacity: 0.75; }

.ext-credit-summary {
    padding: 18px;
    border-radius: 14px;
    background: var(--vantage-fill);
}
.ext-credit-outcome { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; }
.ext-credit-score {
    font-family: var(--vantage-font-heading);
    font-size: 24px;
    font-weight: 700;
    letter-spacing: -0.01em;
    font-variant-numeric: tabular-nums;
}
.ext-credit-score-max { font-size: 13px; font-weight: 500; color: var(--vantage-text-2); }
.ext-credit-band { font-size: 13px; color: var(--vantage-text-2); }
.ext-credit-rationale { margin: 10px 0 0; font-size: 14px; line-height: 1.5; }
.ext-credit-metrics { margin-top: 14px; gap: 6px 32px; }
.ext-credit-criteria-provenance { margin: 10px 0 0; font-size: 12.5px; color: var(--vantage-text-2); }

.ext-credit-degraded, .ext-credit-missing {
    margin: 14px 0 0;
    font-size: 12.5px;
    color: var(--lms-warning-ink);
}
.ext-credit-warnings {
    margin: 14px 0 0;
    padding-left: 18px;
    font-size: 13px;
    color: var(--lms-warning-ink);
}

.ext-credit-section { margin-top: 26px; }
.ext-credit-section-title {
    margin: 0 0 10px;
    font-family: var(--vantage-font-heading);
    font-size: 14px;
    font-weight: 700;
    letter-spacing: -0.01em;
}
.ext-credit-considerations + .ext-credit-section-title { margin-top: 18px; }
.ext-credit-gates { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ext-credit-gate { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 12px; }

.ext-credit-factors { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
@media (max-width: 560px) { .ext-credit-factors { grid-template-columns: minmax(0, 1fr); } }
.ext-credit-factor {
    padding: 14px;
    border-radius: 12px;
    background: var(--vantage-fill);
}
.ext-credit-factor-na { opacity: 0.6; }
.ext-credit-factor-head { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ext-credit-factor-name { font-size: 13.5px; font-weight: 600; }
.ext-credit-factor-bar {
    margin-top: 10px;
    height: 6px;
    border-radius: 3px;
    background: var(--vantage-fill-2);
    overflow: hidden;
}
.ext-credit-factor-bar-fill { height: 100%; background: var(--vantage-text); border-radius: 3px; }
.ext-credit-drivers { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-direction: column; gap: 4px; }
.ext-credit-driver { font-size: 12.5px; line-height: 1.4; padding-left: 14px; position: relative; }
.ext-credit-driver::before { content: ''; position: absolute; left: 0; top: 0.5em; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.ext-credit-driver-positive { color: var(--lms-success-ink); }
.ext-credit-driver-negative { color: var(--lms-danger-ink); }
.ext-credit-driver-neutral  { color: var(--vantage-text-2); }
.ext-credit-missing { margin-top: 10px; }

.ext-credit-additional { background: var(--vantage-fill); border-radius: 14px; padding: 16px 18px; }
.ext-credit-additional .ext-credit-section-title { margin-bottom: 4px; }
.ext-credit-additional > .ext-row-sub { margin: 0 0 12px; }

/* More than one property secures the loan: the pool in a result, and each further property in the Analyze dialog. */
.ext-credit-properties { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ext-credit-properties li { display: flex; flex-direction: column; gap: 2px; padding: 10px 14px; border-radius: 10px; background: var(--vantage-fill); }
.ext-credit-property-name { font-size: 13.5px; font-weight: 600; }
.ext-credit-property-facts { font-size: 12.5px; color: var(--vantage-text-2); font-variant-numeric: tabular-nums; }
.ext-credit-extra-property { margin: 14px 0 0; padding: 0; border: 0; min-width: 0; }
.ext-credit-extra-property legend { padding: 0; margin-bottom: 8px; font-size: 13px; font-weight: 600; }

.ext-credit-conditions { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 8px; }
.ext-credit-condition {
    display: flex;
    flex-wrap: wrap;
    align-items: baseline;
    justify-content: space-between;
    gap: 4px 14px;
    padding: 10px 14px;
    border-radius: 10px;
    background: var(--vantage-fill);
}
.ext-credit-condition-text { font-size: 13.5px; }
.ext-credit-condition-gain { font-size: 12.5px; color: var(--vantage-text-2); font-variant-numeric: tabular-nums; white-space: nowrap; }

.ext-credit-narrative p { margin: 0 0 10px; font-size: 14px; line-height: 1.55; }
.ext-credit-considerations, .ext-credit-next { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.ext-credit-next { list-style: decimal; padding-left: 20px; font-size: 13.5px; }
.ext-credit-next li { padding-left: 2px; }
.ext-credit-consider-supports, .ext-credit-consider-concerns, .ext-credit-consider-neutral {
    font-size: 13.5px;
    line-height: 1.45;
    padding-left: 16px;
    position: relative;
}
.ext-credit-consider-supports::before, .ext-credit-consider-concerns::before, .ext-credit-consider-neutral::before {
    content: ''; position: absolute; left: 0; top: 0.5em; width: 6px; height: 6px; border-radius: 50%; background: currentColor;
}
.ext-credit-consider-supports { color: var(--lms-success-ink); }
.ext-credit-consider-concerns { color: var(--lms-danger-ink); }
.ext-credit-consider-neutral  { color: var(--vantage-text-2); }

.ext-credit-history { margin-top: 26px; }
.ext-credit-history-row { padding: 0; display: block; }
.ext-credit-history-btn {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 8px 14px;
    width: 100%;
    padding: 12px 18px;
    border: 0;
    background: none;
    color: inherit;
    font: inherit;
    text-align: left;
    cursor: pointer;
}
.ext-credit-history-btn:hover { background: var(--vantage-fill-2); }
.ext-credit-history-btn:focus-visible { outline: 2px solid var(--vantage-accent); outline-offset: -2px; }
.ext-credit-history-active .ext-credit-history-btn { background: var(--vantage-fill-2); font-weight: 600; }