/* ============================================================================
   Components - Keyboard key (kbd)
   system/components/kbd.css

   Inline display of a keyboard shortcut. Use the native <kbd> element.
   Combines well in sequences for chord shortcuts.

   See sibling kbd.md.
   ============================================================================ */

.gm kbd,
.gm .gm-kbd {
  display: inline-block;
  min-width: 1.6em;
  padding: 2px 6px;
  font-family: var(--gm-font-mono);
  font-size: 0.85em;
  font-weight: 600;
  line-height: 1.4;
  text-align: center;
  color: var(--gm-text-primary);
  background: var(--gm-bg-sunken);
  border: 1px solid var(--gm-border-default);
  border-bottom-width: 2px;
  border-radius: 4px;
  vertical-align: middle;
  white-space: nowrap;
}

/* Visual separator for chord shortcuts: <kbd>Ctrl</kbd>+<kbd>K</kbd> */
.gm .gm-kbd-sep {
  margin: 0 2px;
  color: var(--gm-text-muted);
  font-family: var(--gm-font-mono);
}