/* Status/role chips for coloured <mark> text. Square, not pills. */
mark.chip {
  background: none;
  padding: 0;
  font-weight: 600;
  color: var(--chip, inherit);
}
.chip-success { --chip: #2e9d4f; }
.chip-danger  { --chip: #d14343; }
.chip-warning { --chip: #c98a00; }
.chip-info, .chip-blue { --chip: #1ebbf0; }
.chip-green   { --chip: #2e9d4f; }
.chip-pink    { --chip: #d0479a; }

/* Status: rows for commands that aren't Enabled read greyed out; the chip/icon keeps its colour. */
.md-typeset table tr:has(td:last-child > mark.chip-danger:only-child, td:last-child > mark.chip-warning:only-child, td:first-child > .st.st-off, td:first-child > .st.st-sit) td,
.md-typeset table tr:has(td:last-child > mark.chip-danger:only-child, td:last-child > mark.chip-warning:only-child, td:first-child > .st.st-off, td:first-child > .st.st-sit) td a,
.md-typeset table tr:has(td:last-child > mark.chip-danger:only-child, td:last-child > mark.chip-warning:only-child, td:first-child > .st.st-off, td:first-child > .st.st-sit) td code { color: #a3a4a9; }

/* Start Here status column: thin, headerless, icon only (tooltip says the word). */
/* Fixed layout so every Start Here table lines up: same column edges in every section. */
.md-typeset table:has(td:first-child > .st):not(:has(.st-cmd)) { table-layout: fixed; }
.md-typeset table:has(td:first-child > .st):not(:has(.st-cmd)) th:nth-child(1) { width: 1.9em; min-width: 0; }
.md-typeset table:has(td:first-child > .st):not(:has(.st-cmd)) th:nth-child(2) { width: 30%; }
.md-typeset table:has(td:first-child > .st):not(:has(.st-cmd)) th:nth-child(4) { width: 7.5em; }
.md-typeset table:has(td:first-child > .st):not(:has(.st-cmd)) td:first-child,
.md-typeset table:has(td:first-child > .st):not(:has(.st-cmd)) th:first-child { padding-left: .7em; padding-right: 0; }
/* Icon box is one text line tall and centres the glyph, so it sits level with the first line of the row. */
.md-typeset td > .st { cursor: help; display: inline-flex; align-items: center; justify-content: center; width: 1.1em; height: 1.6em; vertical-align: top; }
.md-typeset .st svg { display: block; width: 1.05em; height: 1.05em; }
.md-typeset .st-key { display: inline-block; width: 1.1em; height: 1.1em; }
.md-typeset .st-on  { color: #2e9d4f; }
.md-typeset .st-off { color: #d14343; }
.md-typeset .st-sit { color: #c98a00; }

/* Command tables: status icon first (thin, headerless), then Available to / Cooldown / Aliases; Aliases gets the room. */
.md-typeset table:has(td:first-child > .st-cmd) th:first-child,
.md-typeset table:has(td:first-child > .st-cmd) td:first-child { width: 1.9em; min-width: 0; padding-left: .7em; padding-right: 0; }
.md-typeset table:has(td:first-child > .st-cmd):has(> thead > tr > th:nth-child(4):last-child) { table-layout: fixed; }
.md-typeset table:has(td:first-child > .st-cmd):has(> thead > tr > th:nth-child(4):last-child) th:nth-child(2) { width: 20%; }
.md-typeset table:has(td:first-child > .st-cmd):has(> thead > tr > th:nth-child(4):last-child) th:nth-child(3) { width: 20%; }

/* The column after the status icon sits a little closer to it. */
.md-typeset table:has(td:first-child > .st) th:nth-child(2),
.md-typeset table:has(td:first-child > .st) td:nth-child(2) { padding-left: .6em; }

/* Example boxes (fenced code blocks): charcoal grey panel (the page's own code-text grey), light text. Inline code stays light. */
.md-typeset pre > code { background: #4a4b50; color: #f1f1f3; white-space: pre-wrap; overflow-wrap: anywhere; padding-right: 2.6em; }
.md-typeset pre > code * { color: inherit; }
.md-typeset .md-code__nav { background: transparent; }
.md-typeset .md-code__button, .md-typeset .md-clipboard { color: rgba(241, 241, 243, .55); }
.md-typeset .md-code__button:hover, .md-typeset .md-code__button.focus-visible,
.md-typeset .md-clipboard:hover, .md-typeset .md-clipboard:focus { color: #1ebbf0; }
.md-typeset pre::selection, .md-typeset pre > code::selection { background: rgba(30, 187, 240, .35); }

/* Aliases in command tables: same charcoal pill as the example boxes. */
.md-typeset table:has(td:first-child > .st-cmd) td:nth-child(4) code { background: #4a4b50; color: #f1f1f3; }
.md-typeset code.cmd { background: #4a4b50; color: #f1f1f3; }
.md-typeset a code.cmd { background: none; color: inherit; padding: 0; } /* clickable = looks like our links */
/* On a greyed-out row the pill fades as a whole instead of going grey-on-charcoal. */
.md-typeset table:has(td:first-child > .st-cmd) tr:has(td:first-child > .st.st-off, td:first-child > .st.st-sit) td:nth-child(4) code { color: #f1f1f3; opacity: .45; }