/**
 * File Purpose: Shared styles for install-first click-to-copy command rows.
 * Primary Classes: .install-cmd, .install-copy, .install-registry, .install-alts
 * I/O: Visual only; pairs with /downloads/assets/install-copy.js
 */

.install-block .install-cmd {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: calc(var(--step) * 1.5);
  margin: 0 0 calc(var(--step) * 1.5);
  padding: calc(var(--step) * 1.5) calc(var(--step) * 2);
  border: 1px solid var(--rule-strong);
  border-radius: var(--radius-card);
  background: var(--paper-clean);
  cursor: pointer;
}

.install-block .install-cmd:focus-within {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}

.install-block .install-cmd.primary {
  border-color: var(--ink);
}

.install-block .install-registry {
  font-family: var(--font-mono);
  font-size: var(--size-eyebrow);
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--muted);
  white-space: nowrap;
}

.install-block .install-text {
  font-family: var(--font-mono);
  font-size: var(--size-small);
  color: var(--ink);
  overflow-x: auto;
  white-space: nowrap;
  user-select: all;
}

.install-block .install-copy {
  font-family: var(--font-mono);
  font-size: var(--size-eyebrow);
  letter-spacing: 0.06em;
  text-transform: uppercase;
  min-height: 36px;
  min-width: 4.5rem;
  padding: calc(var(--step) * 0.6) calc(var(--step) * 1.25);
  border: 1px solid var(--rule-strong);
  border-radius: var(--radius);
  background: var(--paper);
  color: var(--ink);
  cursor: pointer;
}

.install-block .install-copy:hover {
  border-color: var(--hot);
  color: var(--hot);
  background: var(--hot-wash);
}

.install-block .install-copy:focus-visible {
  outline: var(--focus-ring);
  outline-offset: var(--focus-offset);
}

.install-block .install-copy.is-copied {
  border-color: var(--ink);
  color: var(--ink);
}

.install-block .install-alts {
  display: grid;
  gap: calc(var(--step) * 1);
  margin-top: calc(var(--step) * 2);
}

.install-block .install-alts .install-cmd {
  opacity: 0.92;
}

.install-block .install-hint {
  color: var(--ink-soft);
  font-size: var(--size-small);
  margin: calc(var(--step) * 1.5) 0 0;
}

@media (max-width: 640px) {
  .install-block .install-cmd {
    grid-template-columns: 1fr auto;
    grid-template-areas:
      "reg copy"
      "cmd cmd";
  }
  .install-block .install-registry { grid-area: reg; }
  .install-block .install-text { grid-area: cmd; white-space: normal; }
  .install-block .install-copy { grid-area: copy; }
}