/**
 * Module: article_table
 */

/* ============================================
   TABLE MODULE
   ============================================ */

/* Figure wraps the table and acts as horizontal scroll container
   for narrow viewports. No orphan div. */
.t1-table {
    margin: 2rem 0;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

.t1-table__inner {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.9375rem;
    line-height: 1.5;
    color: var(--ink);
}

.t1-table__caption {
    caption-side: top;
    text-align: left;
    font-size: 0.8125rem;
    font-weight: 600;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: var(--jade);
    padding: 0 0 0.75rem;
}

/* ============================================
   HEADER ROW
   ============================================ */

.t1-table__inner thead th {
    text-align: left;
    font-weight: 600;
    color: var(--jade-dark);
    background: var(--jade-light);
    padding: 0.75rem 1rem;
    border-bottom: 2px solid var(--jade);
    vertical-align: bottom;
}

/* ============================================
   BODY CELLS — BASE
   ============================================ */

.t1-table__inner tbody th,
.t1-table__inner tbody td {
    padding: 0.75rem 1rem;
    vertical-align: top;
    text-align: left;
}

.t1-table__inner tbody th {
    font-weight: 600;
    color: var(--ink);
}

.t1-table__inner tbody td {
    color: var(--charcoal);
}

/* Inline links inside cells inherit article text-link styling */
.t1-table__inner a {
    color: var(--jade);
    text-decoration: underline;
    text-underline-offset: 2px;
}

.t1-table__inner a:hover {
    color: var(--jade-dark);
}

/* ============================================
   ROW STYLE: STRIPED
   ============================================ */

.t1-table__inner--striped tbody tr:nth-child(even) {
    background: var(--pearl);
}

/* ============================================
   ROW STYLE: BORDERED
   ============================================ */

.t1-table__inner--bordered tbody tr {
    border-bottom: 1px solid var(--pearl);
}

.t1-table__inner--bordered tbody tr:last-child {
    border-bottom: none;
}

.t1-table__inner--bordered tbody th,
.t1-table__inner--bordered tbody td {
    border-right: 1px solid var(--pearl);
}

.t1-table__inner--bordered tbody th:last-child,
.t1-table__inner--bordered tbody td:last-child {
    border-right: none;
}

/* ============================================
   ROW STYLE: NONE — header underline already
   provides separation; nothing extra needed.
   ============================================ */

/* ============================================
   FIRST-COLUMN-AS-ROW-HEADER VARIANT
   Subtle tint on the leading column so it reads
   as a label rail without competing with the
   header row. Layered above striped/bordered
   row backgrounds.
   ============================================ */

.t1-table__inner--row-header tbody th:first-child {
    background: var(--cream);
    border-right: 1px solid var(--pearl);
}

.t1-table__inner--row-header.t1-table__inner--striped tbody tr:nth-child(even) th:first-child {
    background: var(--pearl);
}

/* ============================================
   RESPONSIVE
   ============================================ */

@media (max-width: 640px) {
    .t1-table__inner {
        font-size: 0.875rem;
    }

    .t1-table__inner thead th,
    .t1-table__inner tbody th,
    .t1-table__inner tbody td {
        padding: 0.625rem 0.75rem;
    }
}