/* utilities.css — utility layer (design layer).
   Replaces REPEATED inline styles with reusable classes. Loaded
   globally AFTER the other CSS via partials/head.ejs. `!important` because a
   utility replaces an inline style (which took precedence over classes): it must
   retain that priority. Naming convention: encoded value (rem×100, or px suffix).
   Rare values / multi-margin shorthands / dynamic values remain inline. */

/* -- Display and flex -- */
.u-flex { display: flex !important; }
.u-grid { display: grid !important; }
.u-block { display: block !important; }
.u-inline-flex { display: inline-flex !important; }
.u-inline-block { display: inline-block !important; }
.u-inline { display: inline !important; }
.u-hidden { display: none !important; }
.u-items-center { align-items: center !important; }
.u-items-start { align-items: flex-start !important; }
.u-items-end { align-items: flex-end !important; }
.u-items-baseline { align-items: baseline !important; }
.u-justify-between { justify-content: space-between !important; }
.u-justify-center { justify-content: center !important; }
.u-justify-end { justify-content: flex-end !important; }
.u-flex-col { flex-direction: column !important; }
.u-flex-wrap { flex-wrap: wrap !important; }
.u-flex-1 { flex: 1 !important; }
.u-shrink-0 { flex-shrink: 0 !important; }
.u-min-w-0 { min-width: 0 !important; }

/* ── Text alignment ── */
.u-text-right { text-align: right !important; }
.u-text-center { text-align: center !important; }
.u-text-left { text-align: left !important; }

/* ── Font size (rem×100; px suffix for pixel values) ── */
.u-fs-70 { font-size: 0.7rem !important; }
.u-fs-72 { font-size: 0.72rem !important; }
.u-fs-74 { font-size: 0.74rem !important; }
.u-fs-75 { font-size: 0.75rem !important; }
.u-fs-76 { font-size: 0.76rem !important; }
.u-fs-78 { font-size: 0.78rem !important; }
.u-fs-80 { font-size: 0.8rem !important; }
.u-fs-82 { font-size: 0.82rem !important; }
.u-fs-84 { font-size: 0.84rem !important; }
.u-fs-85 { font-size: 0.85rem !important; }
.u-fs-86 { font-size: 0.86rem !important; }
.u-fs-88 { font-size: 0.88rem !important; }
.u-fs-90 { font-size: 0.9rem !important; }
.u-fs-92 { font-size: 0.92rem !important; }
.u-fs-95 { font-size: 0.95rem !important; }
.u-fs-100 { font-size: 1rem !important; }
.u-fs-105 { font-size: 1.05rem !important; }
.u-fs-150 { font-size: 1.5rem !important; }
.u-fs-11px { font-size: 11px !important; }
.u-fs-13px { font-size: 13px !important; }
.u-fs-14px { font-size: 14px !important; }

/* ── Font weight & style ── */
.u-fw-400 { font-weight: 400 !important; }
.u-fw-500 { font-weight: 500 !important; }
.u-fw-600 { font-weight: 600 !important; }
.u-fw-700 { font-weight: 700 !important; }
.u-mono { font-family: 'JetBrains Mono', 'SF Mono', Consolas, monospace !important; }
.u-italic { font-style: italic !important; }

/* ── Text colors (semantic, palette tokens) ── */
.u-text-navy { color: var(--navy) !important; }
.u-text-secondary { color: var(--label-secondary) !important; }
.u-text-slate { color: var(--slate) !important; }
.u-text-primary { color: var(--label-primary) !important; }
.u-text-accent { color: var(--accent) !important; }
.u-text-green { color: var(--system-green) !important; }
.u-text-red { color: var(--system-red) !important; }
.u-text-body { color: var(--text) !important; }
.u-text-inherit { color: inherit !important; }

/* ── Zero margin / zero padding ── */
.u-m-0 { margin: 0 !important; }
.u-p-0 { padding: 0 !important; }

/* ── Marge basse (rem×100) ── */
.u-mb-25 { margin-bottom: 0.25rem !important; }
.u-mb-30 { margin-bottom: 0.3rem !important; }
.u-mb-40 { margin-bottom: 0.4rem !important; }
.u-mb-50 { margin-bottom: 0.5rem !important; }
.u-mb-70 { margin-bottom: 0.7rem !important; }
.u-mb-85 { margin-bottom: 0.85rem !important; }
.u-mb-100 { margin-bottom: 1rem !important; }
.u-mb-125 { margin-bottom: 1.25rem !important; }
.u-mb-150 { margin-bottom: 1.5rem !important; }

/* ── Marge haute (rem×100) ── */
.u-mt-0 { margin-top: 0 !important; }
.u-mt-15 { margin-top: 0.15rem !important; }
.u-mt-20 { margin-top: 0.2rem !important; }
.u-mt-25 { margin-top: 0.25rem !important; }
.u-mt-30 { margin-top: 0.3rem !important; }
.u-mt-50 { margin-top: 0.5rem !important; }
.u-mt-60 { margin-top: 0.6rem !important; }
.u-mt-70 { margin-top: 0.7rem !important; }
.u-mt-85 { margin-top: 0.85rem !important; }
.u-mt-90 { margin-top: 0.9rem !important; }
.u-mt-100 { margin-top: 1rem !important; }
.u-mt-125 { margin-top: 1.25rem !important; }
.u-mt-150 { margin-top: 1.5rem !important; }

/* -- Spacing for flex and grid: gap, in rem times 100 -- */
.u-gap-30 { gap: 0.3rem !important; }
.u-gap-35 { gap: 0.35rem !important; }
.u-gap-40 { gap: 0.4rem !important; }
.u-gap-45 { gap: 0.45rem !important; }
.u-gap-50 { gap: 0.5rem !important; }
.u-gap-60 { gap: 0.6rem !important; }
.u-gap-70 { gap: 0.7rem !important; }
.u-gap-80 { gap: 0.8rem !important; }
.u-gap-85 { gap: 0.85rem !important; }
.u-gap-100 { gap: 1rem !important; }
.u-gap-125 { gap: 1.25rem !important; }

/* ── Miscellaneous (generic, safe) ── */
.u-nowrap { white-space: nowrap !important; }
.u-pre-wrap { white-space: pre-wrap !important; }
.u-w-full { width: 100% !important; }
.u-cursor-pointer { cursor: pointer !important; }
.u-no-underline { text-decoration: none !important; }
.u-overflow-hidden { overflow: hidden !important; }
.u-overflow-x-auto { overflow-x: auto !important; }
.u-list-none { list-style: none !important; }
.u-uppercase { text-transform: uppercase !important; }
.u-col-full { grid-column: 1 / -1 !important; }
.u-col-span-2 { grid-column: span 2 !important; }

/* ─── Utilities written in templates but which existed nowhere ──
 *
 * Detected on 31/07/2026 by scripts/classes-fantomes.js. A missing class raises
 * no error: the browser ignores it, the page renders, and the intended spacing
 * never appears. Seventeen at once, including u-mt-40 used fourteen times.
 *
 * The values follow the file's convention: the number is one hundredth of a rem.
 * Some (u-mb-1, u-mb-4) were clearly written thinking in pixels; we
 * defines them anyway, at their literal value — that is what the author would have
 * obtained if the class had existed, and it changes nothing on screen.
 */
.u-fs-110 { font-size: 1.1rem !important; }
.u-fs-120 { font-size: 1.2rem !important; }
.u-gap-25 { gap: 0.25rem !important; }
.u-items-stretch { align-items: stretch !important; }
.u-mb-0 { margin-bottom: 0 !important; }
.u-mb-1 { margin-bottom: 0.01rem !important; }
.u-mb-16 { margin-bottom: 0.16rem !important; }
.u-mb-20 { margin-bottom: 0.2rem !important; }
.u-mb-24 { margin-bottom: 0.24rem !important; }
.u-mb-4 { margin-bottom: 0.04rem !important; }
.u-mr-30 { margin-right: 0.3rem !important; }
.u-mr-35 { margin-right: 0.35rem !important; }
.u-mt-16 { margin-top: 0.16rem !important; }
.u-mt-35 { margin-top: 0.35rem !important; }
.u-mt-40 { margin-top: 0.4rem !important; }
.u-mt-75 { margin-top: 0.75rem !important; }
.u-w-100 { width: 100% !important; }