/* @docs tables.css - data tables: research-tab .db-card + .db-card-table (header bar, meta row, six clean columns, status dots, winner lead/tally, FC col), .db-card-table-compact variant, ISTP plain technology table .istp-tech-simple-table + .istp-tech-visual + freq pills, wide breakout .facility-table-wide (sticky head, scroll), risk-allocation table .risk-table. */

        /* ========= Compact research-tab table (db-card) =========
           Magazine-style data table: dark warm-brown header bar, meta row
           with project count, then six clean columns. The full 28-column
           schema lives in the JSON; the Excel download exports all of it.
           Used on the ISTP Research tab and reusable for other industries. */
        .db-card {
            background: #fff;
            border: 1px solid var(--border-soft);
            border-radius: 10px;
            overflow: hidden;
            margin: 0 0 1.5rem;
            box-shadow: 0 1px 3px rgba(0,0,0,0.03);
        }
        .db-card-header {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.75rem;
            padding: 0.85rem 1.1rem;
            background: var(--bg-warm-dark);
            color: #fff;
        }
        .db-card-title { display: flex; align-items: baseline; gap: 0.7rem; flex-wrap: wrap; }
        .db-card-brand {
            font-size: 14px;
            font-weight: 700;
            letter-spacing: 0.04em;
        }
        .db-card-name {
            font-size: 13px;
            color: rgba(255,255,255,0.85);
        }
        .db-card-meta {
            display: flex;
            align-items: center;
            justify-content: space-between;
            gap: 0.5rem;
            padding: 0.55rem 1.1rem;
            background: var(--bg-sidebar);
            border-bottom: 1px solid var(--border-soft);
            font-size: 12.5px;
            color: var(--text-dark-secondary);
        }
        .db-card-table-wrap {
            overflow-x: auto;
            -webkit-overflow-scrolling: touch;
        }
        .db-card-table {
            width: 100%;
            border-collapse: collapse;
            font-size: 13px;
            min-width: 720px;
        }
        .db-card-table thead th {
            padding: 0.7rem 1rem;
            text-align: left;
            font-size: 10.5px;
            font-weight: 600;
            letter-spacing: 0.1em;
            text-transform: uppercase;
            color: var(--text-dark-tertiary);
            background: #fff;
            border-bottom: 1px solid var(--border-soft);
            white-space: nowrap;
        }
        .db-card-table thead th.num { text-align: right; }
        .db-card-table tbody td {
            padding: 0.85rem 1rem;
            border-bottom: 1px solid var(--border-soft);
            vertical-align: top;
            color: var(--text-dark);
            line-height: 1.4;
        }
        .db-card-table tbody tr:last-child td { border-bottom: none; }
        .db-card-table tbody tr:hover { background: var(--bg-sidebar); }
        .db-card-table tbody td.num { text-align: right; white-space: nowrap; }

        /* Compact variant - shorter rows, smaller font. Used by the combined
           Waste Management table where the project cell is name-only. */
        .db-card-table-compact { font-size: 12.5px; }
        .db-card-table-compact thead th { padding: 0.5rem 0.7rem; font-size: 10px; }
        .db-card-table-compact tbody td { padding: 0.5rem 0.7rem; vertical-align: middle; line-height: 1.3; }

        .db-project-head {
            display: flex;
            align-items: center;
            gap: 0.5rem;
            margin-bottom: 0.15rem;
        }
        .db-project-name { font-weight: 600; font-size: 13.5px; color: var(--text-dark); }
        .db-project-loc  { font-size: 11.5px; color: var(--text-dark-tertiary); padding-left: 1.05rem; }
        .db-status-dot {
            display: inline-block;
            width: 8px; height: 8px;
            border-radius: 50%;
            flex-shrink: 0;
        }
        .db-status-dot.is-green { background: #6a8156; }
        .db-status-dot.is-amber { background: #b08b3c; }
        .db-status-dot.is-blue  { background: #6479a0; }
        .db-status-dot.is-grey  { background: #b5afa6; }

        .db-num-val { font-weight: 600; color: var(--text-dark); font-feature-settings: "tnum"; }
        .db-num-unit { font-size: 11px; color: var(--text-dark-tertiary); margin-left: 0.2rem; }
        .db-empty { color: var(--text-dark-tertiary); }

        .db-winner-lead { font-weight: 500; color: var(--text-dark); }
        .db-winner-tally {
            display: inline-block;
            margin-left: 0.4rem;
            padding: 0 0.4rem;
            border-radius: 999px;
            background: var(--bg-sidebar);
            border: 1px solid var(--border-soft);
            font-size: 11px;
            color: var(--text-dark-secondary);
            font-weight: 500;
        }

        .db-col-fc { white-space: nowrap; color: var(--text-dark-secondary); font-size: 12.5px; }


        @media (max-width: 760px) {
            .db-card-name { display: none; }
            .db-card-table { font-size: 12.5px; }
        }

        /* ========= ISTP: 'What different technologies are used' simple table ===
           Three columns: technology name + abbreviation, plain-language
           description, and a how-often-used pill. */
        .istp-tech-simple-table {
            width: 100%;
            border-collapse: collapse;
            margin: 1rem 0 1.5rem;
            font-size: 13.5px;
            background: #fff;
            border: 1px solid var(--border-soft);
            border-radius: 8px;
            overflow: hidden;
        }
        .istp-tech-simple-table thead th {
            background: var(--bg-sidebar);
            text-align: left;
            font-size: 11px;
            font-weight: 600;
            letter-spacing: 0.08em;
            text-transform: uppercase;
            color: var(--text-dark-tertiary);
            padding: 0.7rem 1rem;
            border-bottom: 1px solid var(--border-soft);
        }
        .istp-tech-simple-table tbody td {
            padding: 0.85rem 1rem;
            border-bottom: 1px solid var(--border-soft);
            vertical-align: top;
            line-height: 1.55;
            color: var(--text-dark);
        }
        .istp-tech-simple-table tbody tr:last-child td { border-bottom: none; }
        .istp-tech-simple-table td:first-child { min-width: 180px; white-space: nowrap; }
        .istp-tech-simple-table td:nth-child(3) { white-space: nowrap; }
        /* Visual variant: a narrow icon column comes first, so the Technology cell is now :nth-child(2). */
        .istp-tech-simple-table.istp-tech-visual td:first-child { min-width: 64px; width: 64px; padding: 0.85rem 0.4rem 0.85rem 0.85rem; white-space: normal; }
        .istp-tech-simple-table.istp-tech-visual td:nth-child(2) { min-width: 180px; white-space: nowrap; }
        .istp-tech-simple-table.istp-tech-visual td:nth-child(3) { white-space: normal; }
        .istp-tech-simple-table.istp-tech-visual td:nth-child(4) { white-space: nowrap; }
        .istp-tech-icon-cell { vertical-align: middle; text-align: center; }
        .istp-tech-abbr {
            font-size: 11px;
            font-weight: 500;
            color: var(--text-dark-tertiary);
            letter-spacing: 0.05em;
            margin-top: 0.15rem;
        }
        .istp-tech-freq {
            display: inline-block;
            padding: 0.22rem 0.65rem;
            border-radius: 999px;
            font-size: 12px;
            font-weight: 500;
            white-space: nowrap;
        }
        .istp-tech-freq.freq-most      { background: #d0e4d6; color: #2f5a3d; }
        .istp-tech-freq.freq-often     { background: #d6e1f0; color: #2c4a72; }
        .istp-tech-freq.freq-sometimes { background: #efe1c8; color: #6e571f; }
        .istp-tech-freq.freq-rare      { background: #ebe1e1; color: #6b4848; }
        @media (max-width: 760px) {
            .istp-tech-simple-table td:first-child { white-space: normal; min-width: 0; }
            .istp-tech-simple-table td:nth-child(3) { white-space: normal; }
        }

        /* ========= WIDE TABLE BREAKOUT ========= */
        .facility-table-wide {
            margin: 0 0 1.5rem;
            width: 100%;
            max-width: 100%;
            overflow-x: auto;
        }
        .facility-table-wide table {
            width: 100%;
            min-width: 1100px;
            border-collapse: separate;
            border-spacing: 0;
        }
        .facility-table-wide thead th {
            background: #fff;
            color: var(--text-dark-secondary);
            font-size: 11px;
            font-weight: 500;
            letter-spacing: 0.05em;
            text-transform: uppercase;
            text-align: left;
            padding: 14px 14px 12px;
            border-bottom: 1px solid var(--border-mid);
            position: sticky;
            top: 0;
            z-index: 1;
        }
        .facility-table-wide tbody td {
            white-space: nowrap;
            font-size: 13px;
            padding: 14px;
            vertical-align: top;
            border-bottom: 1px solid var(--border-soft);
        }
        .facility-table-wide tbody tr:last-child td { border-bottom: none; }
        .facility-table-wide tbody tr:hover td { background: rgba(0,0,0,0.015); }
        .facility-table-wide td.cell-wrap { white-space: normal; min-width: 180px; }
        .facility-table-wide td.cell-num { text-align: right; font-variant-numeric: tabular-nums; }
        .facility-table-wide td.cell-empty { color: var(--text-dark-tertiary); text-align: center; }
        @media (max-width: 900px) {
            .facility-table-wide {
                margin-left: 0;
                width: 100%;
            }
            .facility-table-wide table { min-width: 900px; }
        }

/* ===== Article body: risk-allocation tables (inline in article body, rendered by the article detail body renderer) ===== */
.risk-table { width: 100%; border-collapse: collapse; font-size: 13px; background: #fff; border: 1px solid var(--border-soft); border-radius: 8px; overflow: hidden; }
.risk-table caption { caption-side: top; text-align: left; font-weight: 600; font-size: 13.5px; color: var(--text-dark); margin: 0 0 0.55rem; }
.risk-table thead th { text-align: left; padding: 0.65rem 0.85rem; font-weight: 600; color: var(--text-dark); border-bottom: 1.5px solid var(--text-dark); white-space: nowrap; background: var(--bg-sidebar); }
.risk-table tbody td { padding: 0.55rem 0.85rem; border-bottom: 1px solid var(--border-soft); vertical-align: top; color: var(--text-dark); }
.risk-table tbody tr:last-child td { border-bottom: 0; }
.risk-table tbody td:nth-child(2) { color: var(--text-dark-secondary); white-space: nowrap; }
.risk-table tbody td:first-child { font-weight: 500; white-space: nowrap; }

