/* Intercept admin portal — built from styles.css tokens only (no new fonts/colors). */

/* styles.css's .btn{display:inline-block} loads after the UA stylesheet's [hidden]{display:none}
   and wins on equal specificity + source order, so a hidden .btn (e.g. #sign-out-button during
   the error state) stayed visible. Re-assert display:none for any hidden element in this app. */
[hidden] { display: none !important; }

.phead { padding: 40px 0 24px; }
.phead p { color: var(--gray); margin-top: 6px; }

#loading-state, #error-state { padding: 24px 0; }

.admin-error-box {
  border: 1px solid var(--line);
  background: var(--ph);
  border-radius: 2px;
  padding: 18px 20px;
  display: grid;
  gap: 12px;
}

.admin-toolbar { display: flex; gap: 20px; align-items: center; padding: 16px 0; }
.admin-toolbar label { display: flex; gap: 8px; align-items: center; font-size: 14px; color: var(--gray); }
.admin-toolbar select {
  border: 1px solid var(--line);
  border-radius: 2px;
  background: var(--bg);
  color: var(--ink);
  padding: 6px 10px;
  font-size: 14px;
}

.admin-table {
  width: 100%;
  border-collapse: collapse;
  font-size: 13px;
  margin-bottom: 40px;
}
.admin-table th, .admin-table td {
  border-bottom: 1px solid var(--line);
  padding: 10px 12px;
  text-align: left;
  vertical-align: top;
}
.admin-table th {
  background: var(--ph);
  font-size: 13px;
  font-weight: 500;
  color: var(--gray);
}
.admin-table td { font-size: 14px; }

/* Flags a row whose stored record was missing/malformed required fields (rendered with
   placeholders) so the operator can spot it for cleanup — existing tokens only, no new colors. */
.data-issue-row { background: var(--ph); }