:root {
  --ty-avatar-bg: #ccc;
  --ty-avatar-border: var(--ty-color-bg-container);
  --ty-avatar-border-radius: var(--ty-border-radius);
  --ty-avatar-color: #fff;
  --ty-avatar-offline-color: #ced4da;
  --ty-avatar-presence-shadow: 0 0 0 0.1rem #fff;
  --ty-avatar-border-width: 2px;
  --ty-avatar-presence-size: 0.4em;
  --ty-avatar-presence-color-online: var(--ty-color-success);
  --ty-avatar-presence-color-busy: var(--ty-color-danger);
  --ty-avatar-presence-color-away: var(--ty-color-warning);
}

[data-tiny-theme='dark'] {
  --ty-avatar-bg: #555;
  --ty-avatar-border: #1f1f1f;
  --ty-avatar-border-radius: var(--ty-border-radius);
  --ty-avatar-color: #e8e8e8;
  --ty-avatar-offline-color: #525252;
  --ty-avatar-presence-shadow: 0 0 0 0.1rem #1f1f1f;
  --ty-avatar-border-width: 2px;
  --ty-avatar-presence-size: 0.4em;
  --ty-avatar-presence-color-online: var(--ty-color-success);
  --ty-avatar-presence-color-busy: var(--ty-color-danger);
  --ty-avatar-presence-color-away: var(--ty-color-warning);
}

@media (prefers-color-scheme: dark) {
  [data-tiny-theme='system'] {
  --ty-avatar-bg: #555;
  --ty-avatar-border: #1f1f1f;
  --ty-avatar-border-radius: var(--ty-border-radius);
  --ty-avatar-color: #e8e8e8;
  --ty-avatar-offline-color: #525252;
  --ty-avatar-presence-shadow: 0 0 0 0.1rem #1f1f1f;
  --ty-avatar-border-width: 2px;
  --ty-avatar-presence-size: 0.4em;
  --ty-avatar-presence-color-online: var(--ty-color-success);
  --ty-avatar-presence-color-busy: var(--ty-color-danger);
  --ty-avatar-presence-color-away: var(--ty-color-warning);
}
}