/* Minerva Servers — wiki custom styles */

/* Team member layout */
.po-role {
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.5rem 1rem;
}

@media (min-width: 720px) {
  .po-role {
    grid-template-columns: repeat(2, 1fr);
  }
}

.po-member {
  display: grid;
  grid-template-columns: auto 1fr;
  /* Place avatar only beside the name; description sits below name */
  grid-template-areas:
    "avatar name"
    ".      desc";
  align-items: start;
  column-gap: 0.75rem;
  row-gap: 0.15rem;
  padding: 0.4rem 0.25rem;
}

/* Flatten the inner wrapper so .po-name and .po-desc participate in the grid */
.po-member > div { display: contents; }

.po-avatar {
  grid-area: avatar;
  width: 40px;
  height: 40px;
  border-radius: 999px;
  object-fit: cover;
  border: 1px solid var(--md-default-fg-color--lighter);
  background: var(--md-default-bg-color);
  align-self: start;
}

.po-name {
  margin-top: 0.35rem;
  grid-area: name;
  font-weight: 600;
  line-height: 1.2;
}

.po-desc {
  grid-area: desc;
  font-size: 0.9em;
  opacity: 0.85;
}

.po-role-desc {
  margin: 0 0 0.75rem 0;
  font-size: 0.95em;
  opacity: 0.9;
}

/* Role header color-coding */
:root,
[data-md-color-scheme="default"] {
  /* Owner needs contrast on light backgrounds */
  --po-role-owner: #111111;
  --po-role-rep: #66BB6A;         /* Server Representative - green */
  --po-role-staffmgr: #FB8C00;    /* Staff Manager - orange */
  --po-role-admin: #E53935;       /* Server Administration - red */
  --po-role-mod: #42A5F5;         /* Server Moderator - light blue */
  --po-role-creative: #1E88E5;    /* Creative Director - blue */
  --po-role-gm: #1565C0;          /* Server Gamemaster - deep blue */
  --po-role-media: #66BB6A;       /* Media Team - dark green */
}

[data-md-color-scheme="slate"] {
  /* Owner appears white in dark mode per reference */
  --po-role-owner: #ffffff;
}

/* Base style for role headings */
.md-content h2[id] {
  position: relative;
  padding-left: 0.75rem;
  border-left: 0.25rem solid transparent;
}

/* Map heading ids (auto-generated by MkDocs Material) to colors */
.md-content h2#owner { border-left-color: var(--po-role-owner); }
.md-content h2#server-representative { border-left-color: var(--po-role-rep); }
.md-content h2#staff-manager { border-left-color: var(--po-role-staffmgr); }
.md-content h2#server-administration { border-left-color: var(--po-role-admin); }
.md-content h2#server-moderator { border-left-color: var(--po-role-mod); }
.md-content h2#creative-director { border-left-color: var(--po-role-creative); }
.md-content h2#server-gamemaster { border-left-color: var(--po-role-gm); }
.md-content h2#media-team { border-left-color: var(--po-role-media); }