/* ── Frontend Table Output Styles ─────────────────────────────────────── */

/*
 * Stripe tokens — override in your theme:
 *   --ta-row-stripe:  background for the header row and odd body rows
 *   --ta-row-neutral: background for even body rows
 *   --ta-header-color: header text colour
 *   --ta-border:      cell border colour
 */

.ta-table-output table {
    width: 100%;
    border-collapse: collapse;
    margin: 0;
}

.ta-table-output th,
.ta-table-output td {
    padding: 12px 16px;
    text-align: left;
}

.ta-table-output thead tr {
    /* background: var(--ta-row-stripe, #f0f0f1); */
}

.ta-table-output th {
    font-weight: 600;
    color: var(--ta-header-color, #111827);
}

.ta-table-output tbody tr:nth-child(odd) {
    /* background: var(--ta-row-neutral, #ffffff); */
}

.ta-table-output tbody tr:nth-child(even) {
    /* background: var(--ta-row-stripe, #f0f0f1); */
}

/* Per-row colour overrides (inline style) take precedence automatically */

/* Column alignment */
.ta-table-output .ta-align-center { text-align: center; }
.ta-table-output .ta-align-right  { text-align: right; }

/* Tags */
.ta-tag {
    border-radius: 12px;
    padding: 2px 8px;
    font-size: 12px;
    display: inline-block;
}

/* Responsive */
@media (max-width: 768px) {
    .ta-table-output {
        overflow-x: auto;
        display: block;
    }

    .ta-table-output th,
    .ta-table-output td {
        padding: 8px 12px;
        font-size: 14px;
    }
}
