/* ============================================================================
   course-widgets/reported-doses.css -- read-only "reported doses" table.

   a table of attributed facts: what a published source administered, with a PMID
   link. reported, never recommended. animal rows are visually distinct (a warm
   dashed accent + a not-human-equivalent note). a mandatory disclaimer sits below.
   theme-token styled throughout; the table scrolls inside its own overflow-x box
   so it never widens the page, and collapses to stacked cards on narrow screens.
   ============================================================================ */

.cw-rd { color: var(--cw-text); }

/* the table scrolls inside its own box on wide/among-columns content, never the page */
.cw-rd-scroll {
    overflow-x: auto;
    border: 1px solid var(--cw-border);
    border-radius: var(--cw-radius);
    background: var(--cw-surface);
}

.cw-rd-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9rem;
    line-height: 1.5;
}

.cw-rd-table thead th {
    text-align: left;
    font-size: 0.72rem;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--cw-muted);
    padding: 11px 14px;
    border-bottom: 1px solid var(--cw-border);
    white-space: nowrap;
    background: color-mix(in srgb, var(--cw-accent) 5%, var(--cw-surface));
}

.cw-rd-cell {
    padding: 12px 14px;
    vertical-align: top;
    border-bottom: 1px solid var(--cw-border);
}
.cw-rd-row:last-child .cw-rd-cell { border-bottom: 0; }

/* tier chips: literature = accent (meadow), animal = amber (the allowed semantic
   exception, mirroring regulatory-map's status pills). */
/* the source label reads as plain accent-colored text, matching the citation
   (PMID) column's treatment -- no pill, no forced uppercase. sentence case. */
.cw-rd-tier {
    display: inline-block;
    font-weight: 600;
    line-height: 1.3;
    white-space: nowrap;
}
.cw-rd-tier--literature {
    color: var(--cw-accent);
}
.cw-rd-tier--animal {
    color: #fbbf24;
}
[data-theme="light"] .cw-rd-tier--animal { color: #b45309; }

.cw-rd-species {
    display: block;
    margin-top: 5px;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--cw-text);
    text-transform: capitalize;
}

.cw-rd-value {
    display: block;
    font-weight: 700;
    color: var(--cw-text);
    font-family: 'JetBrains Mono', ui-monospace, monospace;
}
.cw-rd-freq {
    display: block;
    margin-top: 3px;
    font-size: 0.8rem;
    color: var(--cw-muted);
}

.cw-rd-muted { color: var(--cw-muted); font-style: italic; }

.cw-rd-pmid {
    color: var(--cw-accent);
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
    border-bottom: 1px solid color-mix(in srgb, var(--cw-accent) 45%, transparent);
}
.cw-rd-pmid:hover { border-bottom-color: var(--cw-accent); }
.cw-rd-pmid:focus-visible { outline: 2px solid var(--cw-accent); outline-offset: 2px; }

/* animal rows: a warm tint + tinted note so they never read as human data.
   no per-cell left stripe -- it drew an amber vertical line at every cell edge,
   which read as clutter. the tint, the "Animal study" label, and the note carry
   the distinction. */
.cw-rd-row--animal .cw-rd-cell {
    background: rgba(245, 158, 11, 0.06);
}
.cw-rd-note {
    padding: 0 14px 12px;
    font-size: 0.8rem;
    color: var(--cw-muted);
    border-bottom: 1px solid var(--cw-border);
}
.cw-rd-noterow.cw-rd-row--animal .cw-rd-note {
    color: #b45309;
    background: rgba(245, 158, 11, 0.06);
    font-weight: 600;
}
[data-theme="dark"] .cw-rd-noterow.cw-rd-row--animal .cw-rd-note { color: #fbbf24; }

.cw-rd-footnote {
    margin: 10px 2px 0;
    font-size: 0.8rem;
    color: var(--cw-muted);
}

/* the mandatory, non-removable disclaimer */
.cw-rd-disclaimer {
    margin: 14px 0 0;
    padding: 12px 14px;
    border-radius: var(--cw-radius);
    border: 1px solid var(--cw-border);
    border-left: 3px solid var(--cw-accent);
    background: var(--cw-accent-soft);
    font-size: 0.84rem;
    line-height: 1.6;
    color: var(--cw-text);
}
.cw-rd-disclaimer-label {
    font-weight: 700;
    margin-right: 4px;
}

/* narrow screens: collapse the table into stacked cards (label via data-label).
   keeps everything readable without a horizontal scroll on phones. */
@media (max-width: 560px) {
    .cw-rd-scroll { overflow-x: visible; }
    .cw-rd-table thead { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); }
    .cw-rd-table, .cw-rd-table tbody, .cw-rd-row, .cw-rd-noterow, .cw-rd-cell { display: block; width: 100%; }
    .cw-rd-row {
        border-bottom: 1px solid var(--cw-border);
        padding: 6px 0;
    }
    .cw-rd-row:last-child { border-bottom: 0; }
    .cw-rd-cell {
        display: flex;
        justify-content: space-between;
        gap: 14px;
        border-bottom: 0;
        padding: 5px 14px;
    }
    .cw-rd-cell::before {
        content: attr(data-label);
        font-size: 0.66rem;
        font-weight: 700;
        text-transform: uppercase;
        letter-spacing: 0.05em;
        color: var(--cw-muted);
        flex-shrink: 0;
    }
    .cw-rd-cell--source { flex-wrap: wrap; }
    .cw-rd-value, .cw-rd-species { text-align: right; }
    .cw-rd-row--animal .cw-rd-cell { box-shadow: none; }
    .cw-rd-row--animal { background: rgba(245, 158, 11, 0.06); }
    .cw-rd-note { padding: 4px 14px 8px; }
}