/**
 * Small set of genuinely cross-page utility styles that don't belong to
 * any single approved page's own CSS (empty/no-results states, a
 * horizontal-scroll wrapper for wide tables). Page-specific component CSS
 * (cards, citation blocks, TOC layouts, etc.) lives in templates.css,
 * organized by the page it was copied from.
 *
 * @package PenScholar_Journals
 */

.notice { border: 1px solid var(--border); border-radius: var(--radius); padding: 1rem 1.25rem; margin-bottom: 1.5rem; font-size: 0.92rem; }
/* Success previously used --bg-tint, the same warm ground ordinary page
   bands use, so a success message was hard to tell apart from plain
   content; error and warning carried cool hardcoded values from before the
   palette existed. All three now use the shared status tokens. */
.notice--success { border-color: var(--status-green-text); background: var(--status-green-bg); color: var(--status-green-text); }
.notice--error { border-color: var(--status-red-text); background: var(--status-red-bg); color: var(--status-red-text); }
.notice--warning { border-color: var(--status-amber-text); background: var(--status-amber-bg); color: var(--status-amber-text); }

.empty-state { text-align: center; padding: 3.5rem 1.5rem; border: 1px dashed var(--border); border-radius: var(--radius); }
.empty-state h2, .empty-state h3 { font-size: 1.3rem; margin-bottom: 0.6rem; }
.empty-state p { color: var(--muted); max-width: 34rem; margin: 0 auto; }
.cta-row { display: flex; flex-wrap: wrap; gap: 1rem; margin-top: 2rem; }
.empty-state .cta-row { justify-content: center; margin-top: 1.5rem; }

.table-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
.table-scroll table { min-width: 100%; }