/* Shared sizing and typography for the liability workflow and asset scenario link. */
.liability-workspace,
.ls-link {
    --ls-ink: #203c30;
    --ls-muted: #586d62;
    --ls-green: #176b43;
    --ls-border: #ceddd4;
    --ls-control-height: 40px;
    --ls-control-radius: 6px;
    font-size: 15px;
    line-height: 1.5;
    color: var(--ls-ink);
}

#tab-liability.active {
    display: block;
    overflow: visible;
    min-width: 0;
    height: auto;
    padding: 14px 0 28px;
}

.ls-header {
    display: flex;
    justify-content: space-between;
    align-items: center;
    gap: 24px;
    margin-bottom: 24px;
}

.ls-header h2 {
    margin: 6px 0 10px;
    font-size: 32px;
    font-weight: 750;
    line-height: 1.3;
    letter-spacing: -.7px;
    text-align: left;
}

.ls-eyebrow {
    color: var(--ls-green);
    font-size: 11px;
    font-weight: 750;
    letter-spacing: 1.6px;
}

.ls-header p:not(.ls-eyebrow) {
    color: var(--ls-muted);
    font-size: 15px;
    line-height: 1.65;
}

.ls-toolbar,
.ls-actions,
.ls-pagination {
    display: flex;
    flex-wrap: wrap;
    gap: 12px;
    align-items: flex-end;
}

.ls-actions { flex-shrink: 0; }
.ls-toolbar { margin: 16px 0; }
.ls-toolbar h3 { align-self: center; margin: 0 auto 0 0; }

.ls-toolbar label,
.ls-link label {
    display: flex;
    flex-direction: column;
    gap: 7px;
    min-width: 0;
    color: var(--ls-muted);
    font-size: 14px;
    font-weight: 600;
}

.liability-workspace button,
.liability-workspace input,
.liability-workspace select,
#asset-liability-link button,
#asset-liability-link select {
    box-sizing: border-box;
    min-width: 0;
    max-width: 100%;
    height: var(--ls-control-height);
    margin: 0;
    border: 1px solid var(--ls-border);
    border-radius: var(--ls-control-radius);
    background: #fff;
    color: var(--ls-ink);
    font-family: inherit;
    font-size: 14px;
    line-height: 1.4;
}

.liability-workspace input,
.liability-workspace select,
#asset-liability-link select {
    padding: 8px 11px;
    font-weight: 500;
    font-variant-numeric: tabular-nums;
}

.liability-workspace select,
#asset-liability-link select { padding-right: 28px; }

.liability-workspace button,
#asset-liability-link button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 9px;
    padding: 0 16px;
    color: var(--ls-green);
    font-weight: 650;
    white-space: nowrap;
    cursor: pointer;
    transition: background-color .15s, border-color .15s;
}

.liability-workspace button:hover:not(:disabled),
#asset-liability-link button:hover:not(:disabled) {
    border-color: #8aaf99;
    background: #f0f6f2;
}

.liability-workspace :is(button, input, select):focus-visible,
#asset-liability-link :is(button, select):focus-visible {
    outline: 2px solid #328258;
    outline-offset: 2px;
}

.liability-workspace .ls-primary {
    border-color: var(--ls-green);
    background: var(--ls-green);
    color: #fff;
}

.liability-workspace .ls-primary:hover:not(:disabled) {
    border-color: #115435;
    background: #115435;
}

.liability-workspace button:disabled { opacity: .5; cursor: default; }
.ls-actions button { min-width: 112px; }

.ls-scenario-toolbar {
    display: grid;
    grid-template-columns: minmax(220px, 290px) minmax(300px, 420px) max-content 1fr;
    gap: 14px;
    margin: 0 0 20px;
    padding: 16px 18px;
    border: 1px solid #d8e3dc;
    border-radius: 9px;
    background: #fff;
}

.ls-scenario-toolbar input,
.ls-scenario-toolbar select { width: 100%; }

#ls-status {
    justify-self: start;
    align-self: end;
    display: flex;
    align-items: center;
    min-height: var(--ls-control-height);
    padding: 0 12px;
    border-radius: 5px;
    background: #f0f5f2;
    color: var(--ls-muted);
    font-size: 14px;
    overflow-wrap: anywhere;
}

#ls-status:empty { display: none; }
#ls-date, #ls-end { width: 172px; }
#ls-result-fund, #ls-frequency { min-width: 126px; }

.ls-steps {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin: 20px 0;
    padding: 7px;
    border: 1px solid #d8e3dc;
    border-radius: 9px;
    background: #eff5f1;
}

.ls-steps button {
    justify-content: flex-start;
    height: 54px;
    padding: 0 13px;
    border-color: transparent;
    background: transparent;
    color: #536b5e;
    font-size: 15px;
    text-align: left;
}

.ls-step-number {
    display: inline-flex;
    flex: 0 0 28px;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border: 1px solid #ceded3;
    border-radius: 50%;
    background: #f8fbf9;
    color: #647e6d;
    font-size: 12px;
    font-weight: 700;
}

.ls-steps button[aria-current="step"] {
    border-color: #b7d5c4;
    background: #fff;
    color: var(--ls-green);
    box-shadow: 0 1px 3px #213f2d08;
}

.ls-steps button[aria-current="step"] .ls-step-number {
    border-color: var(--ls-green);
    background: var(--ls-green);
    color: #fff;
}

.ls-card {
    padding: 22px;
    border: 1px solid #d8e3dc;
    border-radius: 9px;
    background: #fff;
}

.ls-card[hidden] { display: none; }
.ls-card h3 { margin: 0 0 14px; font-size: 19px; line-height: 1.4; text-align: left; }
.ls-card > .ls-toolbar:first-child { margin-top: 0; }
.ls-card .ls-toolbar h3 { margin: 0 auto 0 0; }

.ls-note,
#ls-source,
#ls-model-status,
#ls-result-state {
    color: var(--ls-muted);
    font-size: 14px;
    line-height: 1.7;
}

#ls-source { margin: 12px 0; font-variant-numeric: tabular-nums; }
.ls-note { margin: 14px 0; padding: 11px 14px; border-radius: 6px; background: #f5f8f6; }
.ls-note:empty { display: none; }

.ls-table {
    max-height: 55vh;
    overflow: auto;
    margin-top: 14px;
    border: 1px solid #dce5df;
    border-radius: 6px;
}

.ls-table table {
    width: 100%;
    table-layout: fixed;
    border-collapse: collapse;
    font-size: 14px;
    line-height: 1.4;
    font-variant-numeric: tabular-nums;
}

.ls-table th {
    position: sticky;
    top: 0;
    z-index: 1;
    padding: 10px 9px;
    background: #eff4f1;
    color: #365644;
    font-size: 14px;
    font-weight: 650;
    vertical-align: middle;
}

.ls-table td {
    height: 32px;
    padding: 5px 9px;
    border-bottom: 1px solid #e3eae6;
    text-align: right;
    vertical-align: middle;
}

.ls-table tbody tr:last-child td { border-bottom: 0; }
.ls-table tbody tr:hover td { background: #f0f6f2; }
.ls-table td:first-child { text-align: left; font-weight: 600; }
.ls-table input, .ls-table select { width: 100%; height: 32px; padding: 4px 7px; }
.ls-table select { padding-right: 22px; }
.ls-table input[type="number"] { text-align: right; }
.ls-table button { height: 32px; padding: 0 12px; font-size: 13px; }
.ls-model-table th:first-child { width: 94px; }
.ls-balance-table th:first-child { width: 130px; }
.ls-result-table th:first-child { width: 126px; }
.ls-result-table th:nth-child(2) { width: 90px; }

.ls-summary {
    display: grid;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 12px;
    margin-top: 14px;
}

.ls-summary div { padding: 16px; border: 1px solid #e4ece6; border-radius: 7px; background: #f5f8f6; }
.ls-summary span { display: block; color: var(--ls-muted); font-size: 14px; }
.ls-summary strong { display: block; margin-top: 8px; font-size: 23px; font-weight: 700; font-variant-numeric: tabular-nums; }
.ls-chart { height: 280px; margin: 20px 0; }
.ls-pagination { justify-content: flex-end; align-items: center; margin-top: 16px; font-size: 14px; }
.ls-error { padding: 14px; border: 1px solid #f1c9c3; border-radius: 6px; background: #fff0ee; color: #b42318; }

.ls-link {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: 14px;
    margin-bottom: 18px;
    padding: 16px;
    border: 1px solid #c6ddce;
    border-radius: 7px;
    background: #f0f6f2;
}

.ls-link label { flex: 0 1 390px; }
.ls-link span { flex: 1 1 280px; align-self: center; min-width: 0; color: var(--ls-muted); font-size: 14px; }
#subtab-liability[data-linked="true"] > :not(.ls-link) { display: none !important; }

@media (max-width: 1100px) {
    .ls-scenario-toolbar { grid-template-columns: minmax(180px, 1fr) minmax(230px, 1.4fr) max-content; }
    #ls-status { grid-column: 1 / -1; min-height: 32px; }
    .ls-steps button { gap: 7px; padding: 0 8px; font-size: 14px; }
    .ls-summary { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}

@media (max-width: 800px) {
    .ls-header { align-items: flex-start; flex-direction: column; gap: 16px; }
    .ls-header h2 { font-size: 28px; }
    .ls-scenario-toolbar { grid-template-columns: minmax(0, 1fr) max-content; padding: 16px; }
    .ls-scenario-toolbar label:first-child { grid-column: 1 / -1; }
    .ls-steps { grid-template-columns: repeat(3, minmax(0, 1fr)); }
    .ls-card { padding: 16px; }
    .ls-table table { min-width: 780px; }
}

@media (max-width: 520px) {
    .ls-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ls-summary { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .ls-actions { width: 100%; }
    .ls-actions button { flex: 1; }
    .ls-toolbar label { flex: 1 1 135px; }
    #ls-date, #ls-end { width: 100%; }
}

@media (prefers-reduced-motion: reduce) {
    .liability-workspace button, #asset-liability-link button { transition: none; }
}

/* Observed-data analysis: four views, consistent 40px filters and compact amounts. */
.ls-observed-badge { flex-shrink: 0; padding: 9px 15px; border: 1px solid #c5dace; border-radius: 20px; background: #ecf5ef; color: #176b43; font-weight: 650; }
.ls-analysis-toolbar { padding: 16px 18px; border: 1px solid #d8e3dc; border-radius: 9px; background: #fff; }
.ls-analysis-toolbar select { min-width: 180px; }
.ls-analysis-toolbar #ls-kind { min-width: 235px; }
.ls-analysis-toolbar #ls-status { margin-left: auto; }
.liability-workspace .ls-steps { grid-template-columns: repeat(5, minmax(0,1fr)); }
.ls-summary small { display: block; margin-top: 7px; color: var(--ls-muted); font-size: 12px; }
.ls-summary[hidden] { display: none; }
.ls-two-columns { display: grid; grid-template-columns: minmax(0, .85fr) minmax(0, 1.15fr); gap: 32px; }
.ls-two-columns > div { min-width: 0; }
.ls-caption { color: var(--ls-muted); font-size: 14px; margin: 8px 0; }
.ls-quality { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px; }
.ls-quality p { margin: 0; padding: 10px 12px; background: #f4f7f5; border-radius: 5px; font-size: 14px; }
.ls-quality .ls-attention { background: #fff6e6; color: #80581c; }
.ls-pagination label { display: flex; align-items: center; gap: 10px; }
.ls-detail-table th:first-child { width: 90px; }
.ls-detail-table th:nth-child(2), .ls-detail-table th:nth-child(3) { width: 118px; }
.ls-detail-table td { overflow-wrap: anywhere; }
#ls-detail-status { margin-right: auto; font-size: 14px; color: var(--ls-muted); }
.ls-link[hidden] { display: none; }
@media (max-width: 1100px) {
    .ls-analysis-toolbar #ls-status { margin-left: 0; }
    .ls-two-columns { gap: 20px; }
}
@media (max-width: 800px) {
    .liability-workspace .ls-steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .ls-two-columns { grid-template-columns: minmax(0,1fr); }
    .ls-quality { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

/* Cost scenario workspace. */
.ls-overview-action, .ls-forecast-heading, .lc-result-heading, .lc-path-heading, .lc-run {
    display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap;
}
.ls-overview-action { margin-bottom: 22px; padding-bottom: 18px; border-bottom: 1px solid var(--ls-border); }
.ls-overview-action p { margin: 0; font-weight: 650; }
.ls-forecast-heading h3 { margin: 8px 0; }
#lc-form { margin-top: 24px; }
.lc-input-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.lc-input-grid label { display: flex; flex-direction: column; gap: 8px; color: var(--ls-muted); font-size: 14px; font-weight: 600; }
.lc-input-grid input, .lc-input-grid select { width: 100%; min-width: 0; }
.lc-path-heading { margin-top: 24px; }
.liability-workspace h4 { margin: 0; color: var(--ls-ink); font-size: 16px; }
.lc-path-heading .ls-toolbar { margin: 0; }
.lc-path-heading input { width: 140px; }
.lc-rate-table { max-height: 430px; }
.lc-rate-table table { min-width: 1040px; }
.lc-rate-table th:nth-child(6), .lc-rate-table td:nth-child(6) { background: #f0f7f3; font-weight: 700; }
.lc-rate-table td:nth-child(4) { color: #477db6; }
.lc-rate-table td { padding: 7px 14px; }
.lc-run { margin-top: 18px; }
.lc-run p { max-width: 660px; margin: 0; color: var(--ls-muted); font-size: 14px; }
.lc-run .ls-primary { height: 46px; padding: 0 24px; }
#lc-status { color: var(--ls-muted); font-size: 14px; margin: 14px 0; }
.lc-empty { margin-top: 22px; padding: 36px 20px; border: 1px dashed #bed4c6; border-radius: 8px; background: #f7faf8; text-align: center; }
.lc-empty p { color: var(--ls-muted); font-size: 14px; }
#lc-results { margin-top: 32px; padding-top: 26px; border-top: 1px solid var(--ls-border); }
.lc-cards { display: grid; grid-template-columns: repeat(auto-fit,minmax(220px,1fr)); gap: 16px; margin: 18px 0 28px; }
.lc-scenario-card { padding: 22px; border: 1px solid var(--ls-border); border-top: 3px solid #477db6; border-radius: 8px; background: #f9fbfc; }
.lc-scenario-card.lc-base { border-color: #176b43; background: #f0f7f3; }
.lc-scenario-card.lc-up { border-top-color: #bd7431; background: #fdfaf6; }
.lc-scenario-card strong { display: block; margin: 8px 0 14px; font-size: clamp(20px,1.9vw,30px); letter-spacing: -.6px; font-variant-numeric: tabular-nums; }
.lc-scenario-card p { margin: 12px 0 0; font-size: 13px; color: var(--ls-muted); }
.lc-scenario-card span { display: inline-block; margin-top: 14px; font-size: 14px; font-weight: 650; }
.lc-charts { grid-template-columns: repeat(2,minmax(0,1fr)); }
.lc-charts .ls-chart { height: 260px; }
.lc-result-table table { min-width: 1120px; }
.lc-result-table th, .lc-result-table td { padding: 10px 8px; }
.lc-method { margin-top: 22px; color: var(--ls-muted); font-size: 14px; }
.lc-method summary { cursor: pointer; color: var(--ls-ink); font-weight: 650; }
.lc-method li { margin: 7px 0; }
.lc-annual-heading { margin-top: 32px; }
.lc-plan-toolbar input { width: 185px; }
.lc-rate-table .lc-extended { display: block; color: var(--ls-muted); font-size: 11px; }
#lc-rate-origin:empty { display: none; }
#lc-results[hidden], #lc-empty[hidden] { display: none; }
.liability-workspace#tab-liability .ls-steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
#base-view-liability-status .ls-steps { grid-template-columns: repeat(4,minmax(0,1fr)); }
#base-view-liability-status.active { display: block; padding: 16px 0 28px; }
.lv-current { display:flex; flex-wrap:wrap; align-items:center; gap:16px; padding:14px 18px; background:#f0f6f2; border:1px solid #d8e3dc; border-radius:8px; }
.lv-current span { color:var(--ls-muted); font-size:14px; }
.lv-current .lv-unsaved { color:#986323; }
.lv-version-grid { display:grid; grid-template-columns:minmax(0,1fr) minmax(0,1fr); gap:28px; margin:24px 0; }
.lv-version-grid .ls-toolbar { align-items:flex-end; }
.lv-version-grid label { flex:1 1 230px; }
.lv-version-grid input,.lv-version-grid select { width:100%; }
#lv-status { color:var(--ls-muted); font-size:14px; }
@media(max-width:1100px) { .lv-version-grid { grid-template-columns:1fr; gap:12px; } }
@media(max-width:800px) { #base-view-liability-status .ls-steps { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media (max-width: 1100px) {
    .lc-input-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .lc-scenario-card { padding: 16px; }
    .liability-workspace .ls-steps button { padding: 0 8px; font-size: 13px; }
}
@media (max-width: 800px) {
    .lc-cards, .lc-charts { grid-template-columns: minmax(0,1fr); }
    .lc-path-heading input { width: 100%; }
    .lc-run .ls-primary { width: 100%; }
    .ls-header { flex-wrap: wrap; }
}
