/* Commands */

/* The filter is hidden until the page script runs. These elements set their
   own display, so [hidden] needs restating to win. */
.sf-cmd-filter[hidden], .sf-jump a[hidden], .sf-cmd-group[hidden], .sf-cmd[hidden], .sf-cmd-empty[hidden] { display: none; }
.sf-cmd-filter { max-width: 420px; }
.sf-cmd-filter[hidden] + .sf-jump { margin-top: 0; }
.sf-cmd-filter .sf-input { -webkit-appearance: none; appearance: none; }

/* Gaps and dividers that skip hidden groups and commands while filtering. */
.sf-cmd-groups > .sf-cmd-group { margin-top: 0; }
.sf-cmd-group:not([hidden]) ~ .sf-cmd-group { margin-top: 48px; }
.sf-cmds > .sf-cmd { border-top: 0; }
.sf-cmd:not([hidden]) ~ .sf-cmd { border-top: 1px solid rgba(255, 255, 255, .08); }

.sf-cmd-args { color: var(--ink-2); font-weight: 400; }
.sf-cmd dd b { color: var(--ink); }
.sf-cmd dd > .sf-cmd-meta {
	display: flex;
	flex-wrap: wrap;
	align-items: baseline;
	gap: 6px 8px;
	margin-top: 12px;
	font-size: 15px;
}
.sf-cmd dd > .sf-cmd-meta + .sf-cmd-meta { margin-top: 8px; }
.sf-cmd-label { color: var(--ink); font-weight: 700; }
.sf-cmd-meta code { min-width: 0; overflow-wrap: anywhere; }

.sf-cmd-empty { color: var(--ink-2); }

.sf-page > .sf-cmd-tips { margin-top: 48px; }
.sf-cmd-tips h2 { font-size: 22px; font-weight: 800; line-height: 1.3; }
.sf-cmd-tips .sf-prose { margin-top: 12px; }
