/* =========================================================================
   utilities.css — small single-purpose helpers
   ========================================================================= */

/* Visibility */
.hidden { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }

/* Show/hide by breakpoint */
.desktop-only { display: none; }
@media (min-width: 900px) { .desktop-only { display: revert; } .mobile-only { display: none !important; } }

/* Text */
.text-muted { color: var(--muted); }
.text-sm { font-size: var(--font-size-sm); }
.text-xs { font-size: var(--font-size-xs); }
.text-right { text-align: right; }
.text-center { text-align: center; }
.text-inherit { color: inherit; }
.no-underline { text-decoration: none; }
.fw-700 { font-weight: 700; }
.fw-800 { font-weight: 800; }
.fw-900 { font-weight: 900; }
.truncate { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.break-all { word-break: break-all; }
.uppercase { text-transform: uppercase; letter-spacing: .05em; }

/* Flex / grid helpers */
.row { display: flex; align-items: center; gap: var(--space-3); }
.row-between { display: flex; align-items: center; justify-content: space-between; gap: var(--space-3); }
.row-wrap { flex-wrap: wrap; }
.col { display: flex; flex-direction: column; gap: var(--space-2); }
.stack { display: grid; gap: var(--space-4); align-content: start; }
.stack-sm { display: grid; gap: var(--space-2); align-content: start; }
.stack-lg { display: grid; gap: var(--space-5); align-content: start; }
.grow { flex: 1 1 auto; min-width: 0; }
.gap-2 { gap: var(--space-2); }
.gap-3 { gap: var(--space-3); }
.gap-4 { gap: var(--space-4); }

/* Spacing */
.mt-2 { margin-top: var(--space-2); }
.mt-3 { margin-top: var(--space-3); }
.mt-4 { margin-top: var(--space-4); }
.mt-auto { margin-top: auto; }
.mb-2 { margin-bottom: var(--space-2); }
.mb-3 { margin-bottom: var(--space-3); }
.mb-4 { margin-bottom: var(--space-4); }
.align-end { align-self: end; }
.max-w-18 { max-width: 18rem; }
.max-w-20 { max-width: 20rem; }
.max-w-22 { max-width: 22rem; }
.max-w-24 { max-width: 24rem; }
.max-w-40 { max-width: 40rem; }
.max-w-7 { max-width: 7rem; }
.max-w-8 { max-width: 8rem; }
.max-w-9 { max-width: 9rem; }
.max-w-10 { max-width: 10rem; }
.max-w-11 { max-width: 11rem; }
.max-w-14 { max-width: 14rem; }
.min-w-12 { min-width: 12rem; }
.font-lg { font-size: var(--font-size-lg); }
.font-xl { font-size: var(--font-size-xl); }
.inline-block { display: inline-block; }
.workflow-footer { display: flex; justify-content: space-between; align-items: center; gap: var(--space-4); }

/* Rail facts grid (dashboard right rail) */
.rail-facts { display: grid; grid-template-columns: 1fr 1fr; gap: var(--space-2); }
.rail-fact { border: 1px solid var(--border-color); border-radius: var(--radius-md); padding: var(--space-3); }
.rail-fact b { font-size: var(--font-size-lg); }
.rail-fact span { display: block; font-size: var(--font-size-xs); color: var(--muted); font-weight: 750; margin-top: 2px; }

/* Reorder/cta panel (dark) */
.cta-dark { background: linear-gradient(160deg, #13233a, #0f2e2a); color: #fff; border-radius: var(--radius-xl); padding: var(--space-5); box-shadow: var(--shadow-md); }
.cta-dark h3 { color: #fff; }
.cta-dark .text-muted { color: #9fb3c9; }
