/* Page-specific additions for /mock-data-generator. */

.mock-page .output-meta {
    color: var(--u-muted);
    font-size: 0.78rem;
    font-weight: 800;
}

.mock-page .table-scroll {
    overflow-x: auto;
    border: 1px solid var(--u-line);
    border-radius: 13px;
}

.mock-page .preview-table {
    width: 100%;
    border-collapse: collapse;
    font-size: 0.8rem;
}

.mock-page .preview-table thead th {
    position: sticky;
    top: 0;
    padding: 11px 13px;
    background: #f6f6fd;
    border-bottom: 1px solid var(--u-line);
    color: var(--u-soft);
    font-size: 0.72rem;
    font-weight: 850;
    text-transform: uppercase;
    letter-spacing: 0.03em;
    text-align: left;
    white-space: nowrap;
}

.mock-page .preview-table tbody td {
    padding: 10px 13px;
    border-bottom: 1px solid #f2f2fa;
    color: var(--u-soft);
    white-space: nowrap;
    max-width: 240px;
    overflow: hidden;
    text-overflow: ellipsis;
}

.mock-page .preview-table tbody tr:last-child td { border-bottom: 0; }
.mock-page .preview-table tbody tr:nth-child(even) { background: #fcfcff; }

.mock-page .chip-row { max-height: 260px; overflow-y: auto; }

.mock-page .code-block { max-height: 480px; }

@media (max-width: 780px) {
    .mock-page .preview-table tbody td { max-width: 160px; }
}