/* Badges, Tags, Chips */
.badge {
  display: inline-block;
  padding: 0.25em 0.6em;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-bold);
  line-height: 1;
  text-align: center;
  white-space: nowrap;
  vertical-align: baseline;
  border-radius: var(--radius-sm);
  color: #fff;
  background-color: var(--color-gray-500);
}

.badge-primary { background-color: var(--color-primary-500); }
.badge-secondary { background-color: var(--color-secondary-500); color: var(--color-text-primary); }
.badge-success { background-color: var(--color-success-500); }
.badge-error { background-color: var(--color-error-500); }
.badge-warning { background-color: var(--color-warning-500); color: var(--color-text-primary); }
.badge-info { background-color: var(--color-info-500); }

/* Rounded Badge/Chip */
.badge-pill,
.chip {
  padding-right: 0.8em;
  padding-left: 0.8em;
  border-radius: var(--radius-full);
}

/* Tags (outline style) */
.tag {
  display: inline-flex;
  align-items: center;
  padding: 0.2em 0.8em;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
  color: var(--color-text-secondary);
  background-color: transparent;
  border: 1px solid var(--color-border);
  border-radius: var(--radius-full);
  transition: var(--transition-colors);
  text-decoration: none;
}
.tag:hover {
  background-color: var(--color-bg-secondary);
  color: var(--color-text-primary);
}

/* Restaurant Status Badge */
.status-badge {
  display: inline-flex;
  align-items: center;
  gap: var(--spacing-1);
  padding: 0.3em 0.8em;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-semibold);
  border-radius: var(--radius-full);
}
.status-badge::before {
  content: "";
  display: block;
  width: 6px;
  height: 6px;
  border-radius: 50%;
}
.status-badge.open {
  background-color: var(--color-success-100);
  color: var(--color-success-700);
}
.status-badge.open::before {
  background-color: var(--color-success-500);
}
.status-badge.closed {
  background-color: var(--color-error-100);
  color: var(--color-error-700);
}
.status-badge.closed::before {
  background-color: var(--color-error-500);
}

/* Divider */
.divider {
  display: flex;
  align-items: center;
  text-align: center;
  margin: var(--spacing-6) 0;
  color: var(--color-text-muted);
}
.divider::before,
.divider::after {
  content: '';
  flex: 1;
  border-bottom: 1px solid var(--color-border);
}
.divider:not(:empty)::before { margin-right: var(--spacing-4); }
.divider:not(:empty)::after { margin-left: var(--spacing-4); }

html[dir="rtl"] .divider:not(:empty)::before { margin-left: var(--spacing-4); margin-right: 0; }
html[dir="rtl"] .divider:not(:empty)::after { margin-right: var(--spacing-4); margin-left: 0; }