/* The in-browser pathway analysis: step 3 of the pathway page and the results
   modal. Ported from the retired ECM webapp's stylesheet, keeping only its
   components -- panels, buttons and page chrome come from the site's own MUI
   and main.css -- and using the site's design tokens (main.css :root) instead
   of a palette of its own. Everything is scoped under .pathway-client so that
   these generic class names cannot collide with rules elsewhere on the site. */

.pathway-client code {
    background: var(--bg);
    border-radius: 3px;
    padding: 0 3px;
    font-size: 0.92em;
}

/* -- input ---------------------------------------------------------------- */

.pathway-client .drop-zone {
    border: 2px dashed var(--border);
    border-radius: var(--radius);
    padding: 1.25rem;
    text-align: center;
    transition: border-color var(--dur), background var(--dur);
}

.pathway-client .drop-zone-active {
    border-color: var(--accent);
    background: var(--accent-lt);
}

.pathway-client .drop-zone input[type="file"] {
    /* the <label> is the visible control */
    position: absolute;
    width: 1px;
    height: 1px;
    opacity: 0;
    overflow: hidden;
}

.pathway-client .drop-hint {
    color: var(--text-2);
    margin-left: 0.6rem;
}

.pathway-client .examples {
    margin-top: 0.9rem;
    color: var(--text-2);
    font-size: 0.92rem;
}

.pathway-client .link-button {
    background: none;
    border: none;
    padding: 0 0.35rem;
    font: inherit;
    color: var(--accent);
    text-decoration: underline;
    cursor: pointer;
}

.pathway-client .run-row {
    margin-top: 1rem;
    display: flex;
    align-items: center;
    gap: 0.75rem;
    flex-wrap: wrap;
}

.pathway-client .run-row .mui-btn {
    margin: 0;
}

.pathway-client .file-name {
    color: var(--text-2);
    font-size: 0.92rem;
}

.pathway-client .engine-status {
    margin: 1rem 0 0;
    color: var(--text-2);
    font-size: 0.9rem;
}

.pathway-client .engine-status-error {
    color: var(--err-bd);
}

.pathway-client .engine-info {
    color: var(--text-3);
    font-size: 0.8rem;
}

/* -- results (inside the modal) ------------------------------------------- */

.pathway-client.pathway-modal__body {
    flex: 1 1 auto;
    min-height: 0;
    overflow-y: auto;
    padding: 24px 28px 28px;
}

.pathway-client .results-section {
    margin-bottom: 1.5rem;
}

.pathway-client .results-section h2 {
    font-size: 1.1rem;
    margin: 0 0 0.6rem;
}

.pathway-client .error-panel {
    background: var(--err-bg);
    border: 1px solid var(--err-bd);
    border-radius: var(--radius);
    padding: 0.9rem 1.1rem;
}

.pathway-client .error-panel h2 {
    color: var(--err-bd);
    font-size: 1.1rem;
    margin: 0 0 0.4rem;
}

.pathway-client .error-panel p {
    margin: 0;
    white-space: pre-wrap;
}

.pathway-client .summary-table {
    width: 100%;
    border-collapse: collapse;
}

.pathway-client .summary-table th,
.pathway-client .summary-table td {
    text-align: left;
    vertical-align: top;
    padding: 0.35rem 0.5rem;
    border-bottom: 1px solid var(--border);
}

.pathway-client .summary-table th {
    width: 12rem;
    font-weight: 600;
    color: var(--text-2);
}

.pathway-client .notes {
    margin-top: 1rem;
    background: var(--warn-bg);
    border: 1px solid var(--warn-bd);
    border-radius: var(--radius);
    color: var(--warn-txt);
    padding: 0.6rem 0.8rem;
}

/* The model's standard Gibbs energies came from the Parameter table's
   equilibrium constants rather than a Thermodynamics table -- a fallback
   that can disagree with eQuilibrator's own prediction for the same model.
   Bolder than .notes (a thicker left accent, bold lead text), and placed
   above the summary table rather than folded in among routine notes, so it
   cannot be missed the way a line in that list could be. */
.pathway-client .thermodynamics-fallback-warning {
    margin-bottom: 1rem;
    background: var(--warn-bg);
    border: 1px solid var(--warn-bd);
    border-left: 4px solid var(--warn-bd);
    border-radius: var(--radius);
    color: var(--warn-txt);
    padding: 0.7rem 0.9rem;
}

.pathway-client .thermodynamics-fallback-warning strong {
    display: block;
    margin-bottom: 0.2rem;
}

.pathway-client .notes p {
    margin: 0.25rem 0;
}

.pathway-client .timing {
    color: var(--text-3);
    font-size: 0.85rem;
    margin-left: 0.75rem;
}

.pathway-client .chart-container {
    position: relative;
    width: 100%;
    height: 360px;
    margin-bottom: 1.25rem;
}

.pathway-client .table-scroll {
    overflow-x: auto;
}

.pathway-client .data-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.pathway-client .data-table th,
.pathway-client .data-table td {
    padding: 0.3rem 0.55rem;
    border-bottom: 1px solid var(--border);
    text-align: left;
    white-space: nowrap;
}

/* Reaction formulas run to over 1000px on a single line, so text cells and
   headers wrap (a formula breaks at its spaces) and the tables fit the report
   without scrolling sideways. Numbers stay on one line. */
.pathway-client .data-table th,
.pathway-client .data-table td:not(.numeric) {
    white-space: normal;
}

.pathway-client .data-table th {
    background: var(--bg);
    font-weight: 600;
    position: sticky;
    top: 0;
}

.pathway-client .data-table td.numeric {
    text-align: right;
    font-variant-numeric: tabular-nums;
}

.pathway-client .data-table tbody tr:hover {
    background: var(--accent-lt);
}
