.panel-offers .promotion-preview-box {
  background: var(--bg-elevated);
  border-color: var(--border);
}

/* Hub + shared hero actions: tokenise legacy literals. */
.dashboard-body[data-page="hub"] .pill {
  background: rgba(var(--primary-rgb), 0.06);
}

.dashboard-body[data-page="hub"] .pill--muted {
  background: rgba(var(--text-rgb), 0.08);
}

.dashboard-body[data-page="hub"] .status-pill,
.dashboard-body[data-page="offers"] .status-pill,
.dashboard-body[data-page="restaurants"] .status-pill {
  background: linear-gradient(
    120deg,
    rgba(var(--success-rgb), 0.18),
    rgba(var(--success-rgb), 0.1)
  );
  border-color: rgba(var(--success-rgb), 0.18);
}

.dashboard-body[data-page="hub"] .logout-form button:hover,
.dashboard-body[data-page="offers"] .logout-form button:hover,
.dashboard-body[data-page="restaurants"] .logout-form button:hover,
.dashboard-body[data-page="hub"] .security-link:hover,
.dashboard-body[data-page="offers"] .security-link:hover,
.dashboard-body[data-page="restaurants"] .security-link:hover {
  border-color: rgba(var(--primary-rgb), 0.28);
}

/* Shared dialogs + form helper text. */
.status-card {
  border: 1px solid var(--border);
}

.form-field small {
  color: var(--text-secondary);
}

.input-addon {
  color: var(--text-secondary);
}

.dashboard-body[data-page="deleted_cards"] .trash-card:hover {
  transform: none;
}

.dashboard-body[data-page="deleted_cards"] .trash-card__checkbox:checked + .trash-card__checkmark {
  transform: none;
}

.dashboard-body[data-page="account_security"] .security-panel {
  background: var(--bg-card);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-large);
  padding: clamp(20px, 3vw, 32px);
  box-shadow: var(--shadow-soft);
  display: grid;
  gap: var(--space-4);
}

.dashboard-body[data-page="account_security"] .security-panel .alert {
  margin: 0;
}

.dashboard-body[data-page="account_security"] .security-panel h2 {
  margin: 0;
  color: var(--text-strong, var(--text));
}

.dashboard-body[data-page="account_security"] .dashboard-hero h1 {
  color: var(--text-strong, var(--text));
}

.dashboard-body[data-page="account_security"] .security-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--space-3);
  align-items: center;
}

.dashboard-body[data-page="account_security"] .qr-grid {
  display: grid;
  grid-template-columns: 240px 1fr;
  gap: var(--space-6);
  align-items: start;
}

.dashboard-body[data-page="account_security"] .security-qr {
  background: var(--bg-elevated);
  border: 1px solid var(--border-soft);
  border-radius: var(--radius-medium);
  padding: var(--space-3);
  display: grid;
  gap: var(--space-2);
  justify-items: center;
}

.dashboard-body[data-page="account_security"] #security-qrcode {
  background: #fff;
  padding: 10px;
  border-radius: var(--radius-small);
  border: 1px solid var(--border);
  display: inline-flex;
}

.dashboard-body[data-page="account_security"] .qr-status {
  margin: 0;
  font-size: var(--font-size-0);
  color: var(--muted);
  text-align: center;
  overflow-wrap: anywhere;
  word-break: break-word;
}

.dashboard-body[data-page="account_security"] .qr-status[data-tone="ok"] {
  color: var(--success);
}

.dashboard-body[data-page="account_security"] .qr-status[data-tone="error"] {
  color: var(--danger);
}

.dashboard-body[data-page="account_security"] .secret-copy-row {
  display: flex;
  gap: var(--space-3);
  align-items: flex-end;
  flex-wrap: wrap;
  margin-top: var(--space-3);
}

.dashboard-body[data-page="account_security"] .security-secret-field {
  flex: 1 1 260px;
}

.dashboard-body[data-page="account_security"] .security-secret-field input {
  font-family: var(--font-mono);
  overflow-wrap: anywhere;
  word-break: break-word;
}

.dashboard-body[data-page="account_security"] .security-confirm-form {
  display: grid;
  gap: var(--space-3);
  margin-top: var(--space-4);
}

@media (max-width: 640px) {
  .dashboard-body[data-page="account_security"] .qr-grid {
    grid-template-columns: 1fr;
    gap: var(--space-4);
  }

  .dashboard-body[data-page="account_security"] .security-actions button,
  .dashboard-body[data-page="account_security"] .secret-copy-row button,
  .dashboard-body[data-page="account_security"] .security-confirm-form button {
    width: 100%;
  }
}

/* Restaurants: tokenise license blocks + chips + coupling switch (Style.css light-only literals). */
.dashboard-body[data-page="restaurants"] .license-block {
  background: var(--bg-elevated);
  border-color: var(--border-soft);
}

.dashboard-body[data-page="restaurants"] .license-block:hover {
  background: var(--bg-card);
  border-color: rgba(var(--primary-rgb), 0.3);
}

.dashboard-body[data-page="restaurants"] .license-block--secondary {
  background: var(--bg-card);
}

.dashboard-body[data-page="restaurants"] .btn-chip {
  background: var(--bg-card);
}

.dashboard-body[data-page="restaurants"] .btn-chip.is-active {
  color: var(--primary-contrast);
}

.dashboard-body[data-page="restaurants"] .duration-field {
  background: var(--input-bg);
  border-color: var(--input-border);
}

.dashboard-body[data-page="restaurants"] .duration-field:focus-within {
  border-color: var(--accent);
  box-shadow: var(--focus-ring);
}

.dashboard-body[data-page="restaurants"] .duration-field input {
  color: var(--input-text);
}

.dashboard-body[data-page="restaurants"] .duration-field .unit {
  background: var(--input-bg);
}

.dashboard-body[data-page="restaurants"] .coupling-switch {
  background: var(--bg-card);
  border-color: var(--border-soft);
}

.dashboard-body[data-page="restaurants"] .coupling-switch__slider {
  background: var(--bg-elevated);
}

.dashboard-body[data-page="restaurants"] .coupling-switch__slider::after {
  background: var(--primary-contrast);
}

.dashboard-body[data-page="restaurants"] .license-block.is-disabled {
  background: var(--bg-elevated);
}

.dashboard-body[data-page="restaurants"] .license-block.is-disabled .license-status-badge {
  background: rgba(var(--text-rgb), 0.08);
  color: var(--text-secondary);
}

/* Restaurants: status pills + modal details need token-safe colors in Dark Mode. */
.dashboard-body[data-page="restaurants"] .subscription-pill {
  background: rgba(var(--success-rgb), 0.16);
  color: var(--success);
  border: 1px solid rgba(var(--success-rgb), 0.22);
}

.dashboard-body[data-page="restaurants"] .subscription-pill--expiring {
  background: rgba(var(--warning-rgb), 0.16);
  color: var(--warning);
  border-color: rgba(var(--warning-rgb), 0.26);
}

.dashboard-body[data-page="restaurants"] .subscription-pill--expired {
  background: rgba(var(--danger-rgb), 0.12);
  color: var(--danger);
  border-color: rgba(var(--danger-rgb), 0.24);
}

.dashboard-body[data-page="restaurants"] .subscription-pill--unknown {
  background: rgba(var(--text-rgb), 0.08);
  color: var(--text-secondary);
  border-color: rgba(var(--text-rgb), 0.18);
}

.dashboard-body[data-page="restaurants"] .card-details-logo {
  background: var(--bg-elevated);
}

.dashboard-body[data-page="restaurants"] .card-details-dpa {
  border-color: rgba(var(--warning-rgb), 0.32);
  background: rgba(var(--warning-rgb), 0.12);
}

.dashboard-body[data-page="restaurants"] .card-details-dpa--accepted {
  border-color: rgba(var(--success-rgb), 0.38);
  background: rgba(var(--success-rgb), 0.12);
}

.dashboard-body[data-page="restaurants"] .restaurant-card__delete-icon {
  background: rgba(var(--surface-rgb), 0.72);
  border: 1px solid var(--border);
  color: var(--text-secondary);
  box-shadow: none;
}

.dashboard-body[data-page="restaurants"] .restaurant-card__delete-icon:hover {
  background: rgba(var(--danger-rgb), 0.14);
  border-color: rgba(var(--danger-rgb), 0.35);
  color: var(--danger);
}