/**
 * Svarog Theme — zajedničke UI komponente (DEO A3 briefa).
 *
 * Ovde: status bedž, prikaz radnika, upozorenje o isteku.
 * NE ovde: timeline rasporeda, satna traka dostupnosti — to su
 * funkcionalne komponente i žive u svarog_shifts modulu.
 */

/* Status bedž — koristi se za smene, incidente, obračune, reverse. */
.svarog-badge {
  display: inline-block;
  padding: 0.125rem 0.625rem;
  border-radius: 0.625rem;
  font-size: 0.75rem;
  line-height: 1.4;
  white-space: nowrap;
}

.svarog-badge--planned    { background: var(--svarog-status-planned-bg);   color: var(--svarog-status-planned-fg); }
.svarog-badge--published  { background: var(--svarog-status-published-bg); color: var(--svarog-status-published-fg); }
.svarog-badge--changed    { background: var(--svarog-status-changed-bg);   color: var(--svarog-status-changed-fg); }
.svarog-badge--done       { background: var(--svarog-status-done-bg);      color: var(--svarog-status-done-fg); }
.svarog-badge--noshow,
.svarog-badge--incident   { background: var(--svarog-status-noshow-bg);    color: var(--svarog-status-noshow-fg); }
.svarog-badge--locked     { background: var(--svarog-status-locked-bg);    color: var(--svarog-status-locked-fg); }

/* Prikaz radnika: avatar/inicijali + ime + funkcija + skor. */
.svarog-worker {
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  min-width: 0;
}

.svarog-worker__avatar {
  flex: none;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 0.6875rem;
  font-weight: 500;
  background: var(--svarog-status-published-bg);
  color: var(--svarog-status-published-fg);
  overflow: hidden;
}

.svarog-worker__avatar img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.svarog-worker__name {
  font-weight: 500;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.svarog-worker__role {
  font-size: 0.75rem;
  color: var(--gin-color-text-light, #5f5e5a);
}

/* Skor — vidljiv samo ulogama sa pravom uvida (kontroliše server, ne CSS). */
.svarog-worker__score {
  margin-inline-start: auto;
  font-size: 0.75rem;
  color: var(--gin-color-text-light, #5f5e5a);
}

/* Upozorenje o isteku — trakica u listama i karticama. */
.svarog-expiry {
  display: inline-block;
  padding: 0.125rem 0.5rem;
  border-radius: 0.375rem;
  font-size: 0.75rem;
}

.svarog-expiry--soon   { background: var(--svarog-expiry-soon-bg);   color: var(--svarog-expiry-soon-fg); }
.svarog-expiry--urgent { background: var(--svarog-expiry-urgent-bg); color: var(--svarog-expiry-urgent-fg); }