/* admin-shared.css
 *
 * Typography floor + touch-target compliance for /admin and /dashboard
 * (and other admin pages once linked in). Loads AFTER scanraise.css and
 * BEFORE the page-specific stylesheet, then wins specificity by chaining
 * the page wrapper class (.wrap or .dash-wrap).
 *
 * Why this exists: the original admin CSS files independently set table
 * cells to 13px, headers to 11px, stat labels to 12px, badges to 11px,
 * help text to 12px, and feature-card descriptions to 12px. Compound
 * with --text-muted=#9ca3af (now fixed in scanraise.css) and most copy
 * fell below WCAG 2.1 AA contrast AND was uncomfortably small. This file
 * sets a humane, designer's-eye floor without rewriting the page CSS.
 */

/* ============ Typography floor (admin pages) ============ */

.wrap th,
.dash-wrap th {
    font-size: 13px;
    color: var(--text-muted-strong);
    letter-spacing: 0.5px;
}
.wrap td,
.wrap a.org-link,
.dash-wrap td {
    font-size: 14px;
    line-height: 1.5;
}
.wrap .stat .label,
.dash-wrap .stat .label {
    font-size: 13px;
    color: var(--text-muted-strong);
}
.wrap .feature-card .desc {
    font-size: 14px;
    line-height: 1.5;
    color: var(--text-secondary);
}
.wrap .feature-card .open {
    font-size: 14px;
    margin-top: 12px;
}
.wrap .feature-card .title {
    font-size: 17px;
}
.wrap .badge,
.wrap .role-pill,
.dash-wrap .badge,
.dash-wrap .org-card .role-pill {
    font-size: 12px;
    padding: 3px 10px;
}
.wrap .sub,
.dash-wrap .sub,
.wrap p.sub {
    font-size: 16px;
}

/* Dashboard org-card meta (the "school" / "owner" line under the name) */
.dash-wrap .org-card .meta {
    font-size: 14px;
}

/* "What's new" panel new-tag */
.whats-new-tag {
    font-size: 11px !important;
    padding: 3px 8px !important;
}

/* ============ Touch targets (WCAG 2.5.5) ============ */

.wrap .btn,
.dash-wrap .btn,
.dash-wrap .dash-actions .btn,
.wrap .pagination button,
.wrap .toolbar button {
    min-height: 44px;
    padding: 12px 18px;
    font-size: 14px;
}

/* btn-sm in admin-payouts and similar pages was 25-28px tall, well below
   44x44. Force a compliant height. */
.wrap .btn-sm {
    min-height: 36px;
    padding: 8px 14px;
    font-size: 13px;
}

/* The "Retry unsent receipts" button on /admin was white-on-amber
   (~2.1:1, fails AA). Re-color it to the brand primary, which keeps it
   visually distinct from the data tables but readable. */
.wrap #retryReceipts {
    background: var(--accent) !important;
    color: white !important;
    min-height: 44px;
}
.wrap #retryReceipts:hover { opacity: 0.9; }
.wrap #retryReceipts:disabled { opacity: 0.5; cursor: not-allowed; }

/* ============ Sortable-header semantics ============ */

.wrap th[aria-sort] { cursor: pointer; user-select: none; }
.wrap th[aria-sort="ascending"]::after { content: " \25B2"; }
.wrap th[aria-sort="descending"]::after { content: " \25BC"; }

/* ============ Mobile (<=768px) ============ */

@media (max-width: 768px) {
    .wrap, .dash-wrap { padding: 20px 16px 60px; }
    .wrap .totals,
    .dash-wrap .totals { grid-template-columns: 1fr 1fr; gap: 10px; }
}
