/*
 * The abstract, read as a structured document — at /app (the author's own), at
 * /admin (staff), and in a reviewer's queue. One layout, every audience: nobody
 * embeds the generated PDF file inline in a page (see App\Filament\Schemas\AbstractDocument);
 * it is reached instead via the Download PDF / Open PDF actions, in its own tab.
 *
 * Registered as a Filament asset (AppServiceProvider), NOT compiled by Vite: the
 * panels have no custom Tailwind theme, so utility classes written in a Blade view
 * are not compiled and do nothing — which is why this page used to render as plain
 * unstyled text. Everything below is therefore real CSS, written against Filament's
 * own design tokens so it follows the panel's theme instead of inventing one.
 *
 * The layout deliberately mirrors the generated PDF's — authors carrying the
 * superscripts of their numbered institutions, presenting author starred, emails
 * under the institution they share — so the two can be compared rather than
 * reconciled.
 */

.abstract-view__title {
    font-size: var(--text-xl);
    line-height: 1.4;
    font-weight: var(--font-weight-semibold);
    color: var(--color-gray-950);
    text-wrap: balance;
}

.abstract-view__authors {
    margin-top: calc(var(--spacing) * 4);
    font-size: var(--text-sm);
    line-height: 1.7;
    color: var(--color-gray-700);
}

.abstract-view__authors sup {
    font-size: 0.7em;
    vertical-align: super;
    line-height: 0;
}

/* The numbered institutions the superscripts point at. */
.abstract-view__affiliations {
    margin-top: calc(var(--spacing) * 4);
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 2.5);
    font-size: var(--text-xs);
    line-height: 1.6;
    color: var(--color-gray-500);
}

.abstract-view__affiliation {
    display: flex;
    gap: calc(var(--spacing) * 1.5);
}

.abstract-view__affiliation-number {
    flex: none;
    min-width: calc(var(--spacing) * 3);
    font-weight: var(--font-weight-semibold);
    color: var(--color-gray-700);
}

.abstract-view__institution {
    color: var(--color-gray-700);
}

.abstract-view__emails {
    word-break: break-word;
}

.abstract-view__note {
    margin-top: calc(var(--spacing) * 4);
    font-size: var(--text-xs);
    color: var(--color-gray-500);
}

.abstract-view__note--missing {
    color: var(--color-gray-700);
    font-weight: var(--font-weight-semibold);
}

/* The figure: contained, never full-bleed, with its caption beneath it. */
.abstract-view__figure {
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: calc(var(--spacing) * 3);
}

.abstract-view__figure-image {
    max-width: 100%;
    max-height: 28rem;
    width: auto;
    height: auto;
    border-radius: var(--radius-lg);
    box-shadow: 0 0 0 1px color-mix(in oklab, var(--color-gray-950) 5%, transparent);
}

.abstract-view__figure-caption {
    font-size: var(--text-xs);
    font-style: italic;
    line-height: 1.6;
    text-align: center;
    color: var(--color-gray-500);
    max-width: 42rem;
}

/* Numbered, in the order the author gave them — a citation list. */
.abstract-view__references {
    margin: 0;
    padding-inline-start: calc(var(--spacing) * 5);
    list-style: decimal;
    display: flex;
    flex-direction: column;
    gap: calc(var(--spacing) * 2);
    font-size: var(--text-sm);
    line-height: 1.6;
    color: var(--color-gray-700);
}

.abstract-view__references li::marker {
    color: var(--color-gray-500);
}

/* Rich text from the editor arrives wrapped in <p>; inside a list item that margin
   would break the numbering's alignment. */
.abstract-view__references p {
    margin: 0;
}

.dark .abstract-view__title {
    color: var(--color-white);
}

.dark .abstract-view__authors,
.dark .abstract-view__affiliation-number,
.dark .abstract-view__institution,
.dark .abstract-view__references,
.dark .abstract-view__note--missing {
    color: var(--color-gray-300);
}

.dark .abstract-view__affiliations,
.dark .abstract-view__figure-caption,
.dark .abstract-view__note,
.dark .abstract-view__references li::marker {
    color: var(--color-gray-400);
}

.dark .abstract-view__figure-image {
    box-shadow: 0 0 0 1px color-mix(in oklab, var(--color-white) 10%, transparent);
}