/**
 * GlobalCSS — Tables
 * Ref: design-style-guide.md §6 Tablas
 */

.gs-table {
    width: 100%;
    border-collapse: collapse;
    font-size: var(--gs-font-body);
}

.gs-table thead th {
    padding: var(--space-md) var(--space-md);
    text-align: left;
    font-size: var(--gs-font-caption);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.04em;
    color: var(--color-text-secondary, #6e6e73);
    border-bottom: 1.5px solid var(--color-border-light, #e5e5ea);
    white-space: nowrap;
}

.gs-table thead th.gs-th-right,
.gs-table thead th:last-child {
    text-align: right;
}

.gs-table tbody td {
    padding: var(--space-md) var(--space-md);
    color: var(--color-text, #1d1d1f);
    border-bottom: 1px solid var(--color-border-light, #f0f0f0);
    vertical-align: top;
}

.gs-table tbody tr:last-child td {
    border-bottom: none;
}

.gs-table tbody tr {
    transition: background-color 0.15s ease;
}

.gs-table tbody tr:hover td {
    background: color-mix(in srgb, var(--color-primary, #007aff) 3%, transparent);
}

/* Celda link */
.gs-td-link {
    color: var(--color-primary, #007aff);
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    cursor: pointer;
    transition: color 0.15s ease, opacity 0.15s ease;
}

.gs-td-link:hover {
    opacity: 0.7;
    text-decoration: underline;
}

/* Celda numérica alineada derecha */
.gs-td-number {
    text-align: right;
    font-weight: 600;
    font-variant-numeric: tabular-nums;
    white-space: nowrap;
}

/* Celda truncada */
.gs-td-truncate {
    font-weight: 500;
    white-space: nowrap;
    max-width: 200px;
    overflow: hidden;
    text-overflow: ellipsis;
}

/* Celda descripción expandible */
.gs-td-desc {
    color: var(--color-text-secondary, #6e6e73);
    line-height: 1.45;
    max-width: 400px;
}

.gs-td-desc--clickable {
    cursor: pointer;
    transition: color 0.15s ease;
}

.gs-td-desc--clickable:hover {
    color: var(--color-primary, #007aff);
}

.gs-td-desc--clickable::after {
    content: ' ver más';
    font-size: var(--gs-font-small);
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    color: var(--color-primary, #007aff);
    opacity: 0.7;
}

.gs-td-desc--clickable.gs-td-desc--expanded::after {
    content: ' ver menos';
}

/* Table responsive wrap */
@media (max-width: 768px) {
    .gs-table-wrap {
        overflow-x: auto;
        -webkit-overflow-scrolling: touch;
    }
    .gs-td-desc {
        max-width: 220px;
    }
}

/* Row entrance animation */
@keyframes gs-row-in {
    to { opacity: 1; transform: none; }
}