/* =========================================================================
   Account page
   =========================================================================
   Profile header, party notices, admin panel, favorite-character card,
   and table-cell styling that layers on the shared .saga-table system.
   ========================================================================= */

.acct-header {
  margin-bottom: 1.5rem;
}

.acct-missing {
  text-align: center;
  padding: 3rem 1rem;
}

.acct-missing p {
  color: var(--sg-ink-muted);
  margin-top: 0.75rem;
}

/* ---- Account information ------------------------------------------------ */

.acct-meta {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(10rem, 1fr));
  gap: 1rem;
  margin: 0;
}

.acct-meta dt {
  font-size: 0.8125rem;
  font-weight: 500;
  color: var(--sg-ink-muted);
}

.acct-meta dd {
  margin: 0.125rem 0 0;
  font-size: 0.875rem;
  color: var(--sg-ink-strong);
}

/* ---- Party notice --------------------------------------------------------- */

.acct-party-note {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  background: var(--sg-info-soft);
  border-radius: var(--sg-radius-md);
  padding: 1rem;
  margin-bottom: 1rem;
}

.acct-party-note__icon {
  width: 1.25rem;
  height: 1.25rem;
  flex: none;
  color: var(--sg-info);
}

.acct-party-note__body {
  flex: 1;
  min-width: 0;
}

.acct-party-note__body h3 {
  margin: 0;
  font-size: 0.875rem;
  font-weight: 600;
}

.acct-party-note__body p {
  margin: 0.125rem 0 0;
  font-size: 0.8125rem;
  color: var(--sg-info);
}

.acct-party-note__cta {
  flex: none;
  font-size: 0.875rem;
  font-weight: 600;
  color: var(--sg-info);
  text-decoration: none;
}

.acct-party-note__cta:hover {
  text-decoration: underline;
}

/* ---- Card title icons ------------------------------------------------------ */

.acct-card-title {
  display: flex;
  align-items: center;
  gap: 0.5rem;
}

.acct-icon {
  width: 1.25rem;
  height: 1.25rem;
  flex: none;
}

.acct-icon--warn { color: var(--sg-warning); }
.acct-icon--gold { color: var(--sg-gold); }

/* ---- Admin panel ------------------------------------------------------------- */

.acct-admin-field {
  margin-bottom: 1.5rem;
}

.acct-admin-label {
  font-size: 0.75rem;
  font-weight: 600;
  text-transform: uppercase;
  letter-spacing: 0.05em;
  color: var(--sg-ink-muted);
  margin: 0 0 0.5rem;
}

.acct-admin-value {
  font-weight: 600;
  color: var(--sg-ink-strong);
}

.acct-group {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
}

.acct-group__role {
  font-size: 1.125rem;
  font-weight: 600;
  color: var(--sg-ink-strong);
}

.acct-group__id {
  font-size: 0.8125rem;
  color: var(--sg-ink-muted);
}

.acct-admin-form {
  margin-bottom: 1.5rem;
}

.acct-form-actions {
  display: flex;
  justify-content: flex-end;
}

/* ---- Favorite character --------------------------------------------------------- */

.acct-fav__head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  margin-bottom: 1rem;
}

.acct-fav__name {
  margin: 0;
  font-size: 1.5rem;
}

.acct-fav__levels {
  margin-bottom: 1rem;
}

.acct-attrs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem 1.5rem;
}

@media (min-width: 768px) {
  .acct-attrs {
    grid-template-columns: repeat(3, 1fr);
  }
}

.acct-attr {
  display: flex;
  justify-content: space-between;
  font-size: 0.875rem;
}

.acct-attr span {
  color: var(--sg-ink-muted);
}

.acct-attr strong {
  color: var(--sg-ink-strong);
  font-weight: 600;
}

.acct-vitals {
  display: flex;
  justify-content: space-between;
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px solid var(--sg-edge);
  font-size: 0.875rem;
  color: var(--sg-ink-muted);
}

.acct-vitals strong {
  color: var(--sg-ink-strong);
  font-weight: 600;
}

/* ---- Table cells ------------------------------------------------------------------- */

.acct-char-link {
  display: inline-flex;
  align-items: center;
  gap: 0.75rem;
  color: var(--sg-ink-strong);
  font-weight: 500;
  text-decoration: none;
}

.acct-char-link:hover span {
  color: var(--sg-link);
  text-decoration: underline;
}

.acct-avatar {
  width: 2rem;
  height: 2rem;
  flex: none;
  object-fit: contain;
  border-radius: var(--sg-radius-sm);
}

.acct-cell-link {
  color: var(--sg-link);
  text-decoration: none;
}

.acct-cell-link:hover {
  text-decoration: underline;
}

.acct-none {
  color: var(--sg-ink-faint);
}

.acct-cell-strong { font-weight: 500; color: var(--sg-ink-strong); }
.saga-table td.acct-cell-muted { color: var(--sg-ink-muted); }

.acct-flag-on  { color: var(--sg-success); font-weight: 500; }
.saga-table td.acct-flag-off { color: var(--sg-ink-faint); font-weight: 500; }

/* ---- Past runs: whole row is clickable via the floor link ---------------------------- */

.saga-table tr.acct-row-link {
  position: relative;
}

.acct-run-link {
  color: var(--sg-accent-strong);
  font-weight: 600;
  text-decoration: none;
}

.acct-run-link:hover {
  text-decoration: underline;
}

.acct-run-link::after {
  content: "";
  position: absolute;
  inset: 0;
}

.acct-pager {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1rem;
  padding: 0.75rem 1.5rem;
  border-top: 1px solid var(--sg-edge);
}

.acct-pager p {
  margin: 0;
  font-size: 0.875rem;
  color: var(--sg-ink-muted);
}

.acct-pager__nav {
  display: flex;
  gap: 0.5rem;
}