/* Tables Management Page Specific Styles - base card defined in manager.css */

.table-card h2 {
  margin: 0 0 var(--spacing-md) 0;
  font-size: var(--font-size-lg);
  color: var(--text-primary);
}

.table-card.inactive {
  opacity: 0.6;
  border-color: var(--warning-color);
}

.table-info {
  display: flex;
  justify-content: space-between;
  margin: var(--spacing-md) 0;
}

.capacity {
  color: var(--success-color);
  font-weight: var(--font-weight-bold);
}

.status {
  padding: 5px var(--spacing-md);
  border-radius: 20px;
  font-size: var(--font-size-xs);
  font-weight: var(--font-weight-medium);
}

.status.active {
  background-color: var(--success-color);
  color: var(--text-white);
}

.status.inactive {
  background-color: var(--warning-color);
  color: var(--text-white);
}

.qr-info {
  background: var(--bg-light);
  padding: var(--spacing-md);
  border-radius: var(--border-radius-sm);
  margin: var(--spacing-md) 0;
  font-family: monospace;
  font-size: var(--font-size-sm);
  word-break: break-all;
}

/* Subscription note in page-controls bar */
.subscription-note {
  font-size: var(--font-size-sm);
  color: var(--text-secondary);
}

.limit-warning-inline {
  font-size: var(--font-size-sm);
  color: var(--color-warning-dark);
  background: var(--color-warning-light);
  padding: 2px 8px;
  border-radius: var(--border-radius-sm);
}

/* Action buttons group */
.settings-group {
  display: flex;
  gap: var(--spacing-sm);
  align-items: center;
  flex-wrap: wrap;
}

/* New stacked actions layout to prevent overflow with long localized labels */
.button-group.stacked-actions {
  display: flex;
  flex-direction: column;
  gap: var(--spacing-sm);
  margin-top: var(--spacing-md);
}
.button-group.stacked-actions .primary-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--spacing-sm);
}
.button-group.stacked-actions .delete-form {
  width: 100%;
}
.button-group.stacked-actions .delete-form .btn {
  width: 100%;
}

@media (min-width: 640px) {
  .button-group.stacked-actions .primary-actions {
    justify-content: flex-start;
  }
}

@media (min-width: 900px) {
  /* If plenty of horizontal space, keep delete inline optionally */
  .button-group.stacked-actions {
    flex-direction: column;
  }
}

@media (max-width: 768px) {
  .settings-group {
    justify-content: center;
  }
}
