/* ==========================================================================
   COMANDA — Badges / Status Chips
   ========================================================================== */

.chip{
  display:inline-flex;
  align-items:center;
  gap:.4rem;
  font-size:.72rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.03em;
  padding:.32rem .65rem;
  border-radius:var(--radius-pill);
  line-height:1;
  white-space:nowrap;
}
.chip::before{
  content:"";
  width:6px; height:6px;
  border-radius:50%;
  background:currentColor;
  flex-shrink:0;
}

.chip-accent{ background:var(--accent-100); color:var(--accent-600); }
.chip-navy{ background:var(--navy-100); color:var(--navy-700); }
.chip-success{ background:var(--success-100); color:var(--success-600); }
.chip-warning{ background:var(--warning-100); color:var(--warning-600); }
.chip-danger{ background:var(--danger-100); color:var(--danger-600); }
.chip-info{ background:var(--info-100); color:var(--info-600); }
.chip-neutral{ background:var(--ink-100); color:var(--ink-500); }

/* Order status specific naming (semantic aliases) */
.chip-new{ background:var(--accent-100); color:var(--accent-600); }
.chip-preparing{ background:var(--info-100); color:var(--info-600); }
.chip-ready{ background:var(--success-100); color:var(--success-600); }
.chip-served{ background:var(--navy-100); color:var(--navy-700); }
.chip-cancelled{ background:var(--danger-100); color:var(--danger-600); }

/* Order-type tag (dine-in / takeaway / delivery) */
.tag-type{
  display:inline-flex;
  align-items:center;
  gap:.35rem;
  font-size:.74rem;
  font-weight:600;
  padding:.28rem .6rem;
  border-radius:var(--radius-xs);
  border:1px solid var(--ink-200);
  color:var(--ink-700);
  background:var(--white);
}
.tag-type i{ font-size:.82rem; }
.tag-type.dine-in{ border-color:#cfe0f5; color:var(--info-600); background:var(--info-100); }
.tag-type.takeaway{ border-color:#ffe0c2; color:var(--accent-600); background:var(--accent-100); }
.tag-type.delivery{ border-color:#c8ecd9; color:var(--success-600); background:var(--success-100); }

/* Small round counter badge (used on sidebar / icon buttons) */
.badge-dot{
  min-width:18px; height:18px;
  padding:0 .3rem;
  border-radius:var(--radius-pill);
  background:var(--accent-500);
  color:var(--white);
  font-size:.66rem;
  font-weight:700;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

/* Avatar group, e.g. staff assigned to a table */
.avatar-group{ display:flex; align-items:center; }
.avatar-group img{
  width:28px; height:28px;
  border-radius:50%;
  border:2px solid var(--white);
  object-fit:cover;
  margin-left:-10px;
}
.avatar-group img:first-child{ margin-left:0; }