/* ============================================================================
 * Visibility, accessibility & reveal utilities.
 * ========================================================================== */

.wb-invisible { visibility: hidden; }
.wb-visible   { visibility: visible; }

.wb-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;
}

.wb-not-sr-only {
  position: static;
  width: auto;
  height: auto;
  padding: 0;
  margin: 0;
  overflow: visible;
  clip: auto;
  white-space: normal;
}

/* Cursor */
.wb-cursor-pointer { cursor: pointer; }
.wb-cursor-default { cursor: default; }

/* Pointer events */
.wb-pointer-none { pointer-events: none; }
.wb-pointer-auto { pointer-events: auto; }

/* Border + radius helpers */
.wb-border          { border: var(--wb-border-width) solid var(--wb-color-border); }
.wb-border-soft     { border: var(--wb-border-width) solid var(--wb-color-border-soft); }
.wb-border-strong   { border: var(--wb-border-width) solid var(--wb-color-border-strong); }
.wb-border-0        { border: 0; }
.wb-border-t        { border-top: var(--wb-border-width) solid var(--wb-color-border); }
.wb-border-b        { border-bottom: var(--wb-border-width) solid var(--wb-color-border); }

.wb-rounded-none    { border-radius: 0; }
.wb-rounded-xs      { border-radius: var(--wb-radius-xs); }
.wb-rounded-sm      { border-radius: var(--wb-radius-sm); }
.wb-rounded-md      { border-radius: var(--wb-radius-md); }
.wb-rounded-lg      { border-radius: var(--wb-radius-lg); }
.wb-rounded-xl      { border-radius: var(--wb-radius-xl); }
.wb-rounded-2xl     { border-radius: var(--wb-radius-2xl); }
.wb-rounded-full    { border-radius: var(--wb-radius-full); }

/* Background helpers */
.wb-bg-white   { background-color: var(--wb-color-white); }
.wb-bg-soft    { background-color: var(--wb-color-bg-soft); }
.wb-bg-muted   { background-color: var(--wb-color-bg-muted); }
.wb-bg-ink     { background-color: var(--wb-color-ink); }
.wb-bg-brand   { background-color: var(--wb-color-brand); }

/* Shadows */
.wb-shadow-none { box-shadow: none; }
.wb-shadow-xs   { box-shadow: var(--wb-shadow-xs); }
.wb-shadow-sm   { box-shadow: var(--wb-shadow-sm); }
.wb-shadow-md   { box-shadow: var(--wb-shadow-md); }
.wb-shadow-lg   { box-shadow: var(--wb-shadow-lg); }
.wb-shadow-xl   { box-shadow: var(--wb-shadow-xl); }