/* utilities.css — sparing utility classes (Design-Direction §7). Prefix: .u-*. */

.u-visually-hidden,
.u-sr-only {
    position: absolute !important;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.u-hidden {
    display: none !important;
}

.u-text-truncate {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.u-text-center {
    text-align: center;
}

/* Subtle, thin scrollbar — opt in by adding .u-scrollbar to any scroll container. Thin track-less
   bar with a light, pill-shaped thumb that darkens on hover. Reusable site-wide. */
.u-scrollbar {
    scrollbar-width: thin;                                  /* Firefox */
    scrollbar-color: var(--color-neutral-20) transparent;  /* thumb, track */
}
.u-scrollbar::-webkit-scrollbar { width: 8px; height: 8px; }
.u-scrollbar::-webkit-scrollbar-track { background: transparent; }
.u-scrollbar::-webkit-scrollbar-thumb {
    background: var(--color-neutral-20);
    border-radius: 999px;
    border: 2px solid transparent;   /* inset the thumb so it reads thinner / subtler */
    background-clip: padding-box;
}
.u-scrollbar::-webkit-scrollbar-thumb:hover {
    background: var(--color-neutral-40);
    background-clip: padding-box;
}