/* ============================================================================
 * Hide every remaining ntfy-era UI element so users don't see references to
 * the old push system. FCM has fully replaced it; topics, install instructions,
 * and QR codes don't apply anymore.
 *
 * We hide via CSS instead of mutating the 38k-line index.html so the file
 * stays in lockstep with the Apps Script source and the diff is auditable.
 * ========================================================================== */

/* Integrations → Push notifications block (entire block + per-user cards) */
.ntfy-features,
.ntfy-features-title,
.ntfy-features-desc,
.ntfy-features-grid,
.ntfy-feature,
.ntfy-setup-steps,
.ntfy-user-card,
.ntfy-user-head,
.ntfy-user-titles,
.ntfy-user-name,
.ntfy-user-role,
.ntfy-user-status,
.ntfy-user-badge,
.ntfy-user-badge-set,
.ntfy-user-badge-none,
.ntfy-user-topic,
.ntfy-copy-btn,
.ntfy-user-qr-wrap,
.ntfy-qr-error,
.ntfy-user-actions,
#ntfyUsersList { display: none !important; }

/* Profile → Ntfy Topic row (input + label + helper text together) */
label[for="profile-ntfy"],
input#profile-ntfy,
input#profile-ntfy ~ .muted,
input#profile-ntfy + small,
label[for="profile-ntfy"] + input,
label[for="profile-ntfy"] + input + small { display: none !important; }

/* Manage Users → Ntfy Topic column. The column has no stable selector in the
 * Apps Script source, so we target any header cell whose text *contains* ntfy
 * via the `:has()` selector. Browsers ignore selectors they don't support, so
 * older browsers just show the column harmlessly. */
th:has(> span:contains("Ntfy")),
td:has(> span:contains("Ntfy")) { display: none !important; }

/* ============================================================================
 * Notification permission gate — modal shown after sign-in if push permission
 * is not yet granted.  See /js/notification-gate.js for behaviour.
 * ========================================================================== */
.fcm-gate-backdrop {
  position: fixed; inset: 0;
  background: rgba(0, 0, 0, 0.55);
  z-index: 99999;
  display: flex; align-items: center; justify-content: center;
  padding: 16px;
  animation: fcm-gate-in 0.2s ease-out;
}
@keyframes fcm-gate-in { from { opacity: 0; } to { opacity: 1; } }

.fcm-gate-modal {
  background: #fff;
  border-radius: 14px;
  max-width: 460px; width: 100%;
  box-shadow: 0 24px 60px rgba(0, 0, 0, 0.35);
  padding: 28px 26px 22px;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
}
.fcm-gate-icon {
  font-size: 42px; line-height: 1;
  text-align: center;
  margin-bottom: 8px;
}
.fcm-gate-title {
  font-size: 20px; font-weight: 600;
  text-align: center;
  margin: 4px 0 10px;
  color: #1f2937;
}
.fcm-gate-body {
  font-size: 14px;
  color: #475569;
  line-height: 1.5;
  text-align: center;
  margin: 6px 0 18px;
}
.fcm-gate-body strong { color: #1f2937; }
.fcm-gate-actions {
  display: flex; flex-direction: column; gap: 10px;
  margin-top: 18px;
}
.fcm-gate-btn {
  border: 0; border-radius: 8px;
  padding: 12px 14px;
  font: inherit; font-weight: 600; font-size: 15px;
  cursor: pointer;
  transition: background 0.15s ease;
}
.fcm-gate-btn-primary {
  background: #3C7538; color: #fff;
}
.fcm-gate-btn-primary:hover { background: #2f5e2c; }
.fcm-gate-btn-primary:disabled { opacity: 0.6; cursor: default; }
.fcm-gate-btn-link {
  background: transparent; color: #2f5e2c;
  text-decoration: underline; font-weight: 500;
  padding: 6px;
}
.fcm-gate-status {
  font-size: 12px;
  color: #6b7280;
  text-align: center;
  min-height: 18px;
  margin-top: 8px;
}
.fcm-gate-status.fcm-gate-err { color: #b91c1c; }
.fcm-gate-help {
  font-size: 12px;
  background: #fff4e6;
  border-left: 3px solid #f59e0b;
  border-radius: 6px;
  padding: 10px 12px;
  margin-top: 14px;
  color: #78350f;
  line-height: 1.5;
}
.fcm-gate-help code {
  background: #fde68a; padding: 1px 5px; border-radius: 3px;
  font-size: 11px;
}