.cbc-ui .cbc-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--cbc-space-1);
  width: fit-content;
  min-height: 1.75rem;
  padding: 0 var(--cbc-space-2);
  border: 1px solid currentColor;
  border-radius: var(--cbc-radius-pill);
  font-size: var(--cbc-font-size-100);
  font-weight: var(--cbc-font-weight-bold);
  line-height: 1;
  white-space: nowrap;
}

.cbc-ui .cbc-badge--neutral {
  background: var(--cbc-colour-neutral-state-surface);
  color: var(--cbc-colour-neutral-state);
}

.cbc-ui .cbc-badge--information {
  background: var(--cbc-colour-information-surface);
  color: var(--cbc-colour-information);
}

.cbc-ui .cbc-badge--success {
  background: var(--cbc-colour-success-surface);
  color: var(--cbc-colour-success);
}

.cbc-ui .cbc-badge--warning {
  background: var(--cbc-colour-warning-surface);
  color: var(--cbc-colour-warning);
}

.cbc-ui .cbc-badge--danger {
  background: var(--cbc-colour-danger-surface);
  color: var(--cbc-colour-danger);
}

.cbc-ui .cbc-empty-state,
.cbc-ui .cbc-restricted-state {
  display: grid;
  justify-items: center;
  gap: var(--cbc-space-3);
  padding: var(--cbc-space-7) var(--cbc-space-5);
  border: 1px dashed var(--cbc-colour-border-strong);
  border-radius: var(--cbc-radius-medium);
  background: var(--cbc-colour-surface-subtle);
  text-align: center;
}

.cbc-ui .cbc-empty-state__icon,
.cbc-ui .cbc-restricted-state__icon {
  display: grid;
  width: 3rem;
  height: 3rem;
  place-items: center;
  border-radius: 50%;
  background: var(--cbc-colour-blue-100);
  color: var(--cbc-colour-navy-800);
}

.cbc-ui .cbc-empty-state__icon .cbc-icon,
.cbc-ui .cbc-restricted-state__icon .cbc-icon {
  width: 1.5rem;
  height: 1.5rem;
}

.cbc-ui .cbc-restricted-state {
  border-style: solid;
  background: var(--cbc-colour-neutral-state-surface);
}

.cbc-ui .cbc-alert {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: var(--cbc-space-3);
  padding: var(--cbc-space-3) var(--cbc-space-4);
  border: 1px solid currentColor;
  border-radius: var(--cbc-radius-medium);
  font-size: var(--cbc-font-size-200);
}

.cbc-ui .cbc-alert--information {
  background: var(--cbc-colour-information-surface);
  color: var(--cbc-colour-information);
}

.cbc-ui .cbc-alert--success {
  background: var(--cbc-colour-success-surface);
  color: var(--cbc-colour-success);
}

.cbc-ui .cbc-alert--warning {
  background: var(--cbc-colour-warning-surface);
  color: var(--cbc-colour-warning);
}

.cbc-ui .cbc-alert--danger {
  background: var(--cbc-colour-danger-surface);
  color: var(--cbc-colour-danger);
}

.cbc-ui .cbc-alert__content {
  display: grid;
  gap: var(--cbc-space-1);
  color: var(--cbc-colour-text);
}

.cbc-ui .cbc-loading-region {
  display: grid;
  gap: var(--cbc-space-3);
}

.cbc-ui .cbc-skeleton {
  display: block;
  min-height: 1rem;
  overflow: hidden;
  border-radius: var(--cbc-radius-small);
  background: linear-gradient(
    90deg,
    var(--cbc-colour-neutral-state-surface) 25%,
    var(--cbc-colour-border) 50%,
    var(--cbc-colour-neutral-state-surface) 75%
  );
  background-size: 200% 100%;
  animation: cbc-skeleton-loading 1.4s ease-in-out infinite;
}

.cbc-ui .cbc-skeleton--heading {
  width: min(20rem, 75%);
  min-height: 1.75rem;
}

.cbc-ui .cbc-skeleton--text {
  width: min(32rem, 100%);
}

.cbc-ui .cbc-skeleton--short {
  width: min(12rem, 50%);
}

.cbc-ui .cbc-skeleton--card {
  min-height: 7rem;
}

@keyframes cbc-skeleton-loading {
  from { background-position: 200% 0; }
  to { background-position: -200% 0; }
}

@media (prefers-reduced-motion: reduce) {
  .cbc-ui .cbc-skeleton {
    background: var(--cbc-colour-neutral-state-surface);
    animation: none;
  }
}